使用 Docker 部署 VS Code in The Browser

2024-05-12 16:12

本文主要是介绍使用 Docker 部署 VS Code in The Browser,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

1)介绍

GitHub:https://github.com/coder/code-server

在日常学习工作中,Vscode 已成为我们首选的代码编辑器。然而,其局限性在于当我们从家到公司移动时,难以保持连续的编码体验。针对这一痛点,虽然市面上已有如 Visual Studio Codespaces、Cloudstudio 和 CloudIDE 等 在线编辑器(Web IDE)可供选择,但它们要么处于测试阶段,要么免费使用存在限制或价格较高,目前并非完美之选。因此,若想以较低成本实现连续、流畅的编码体验,此时自主搭建一个在线编辑器或许是个值得考虑的好方案。

Code-Server 是由 Coder 开发的,把 VS Code 搬到了浏览器上。
我们可以在任何地方的任何机器上运行 Code-Server 然后通过浏览器访问它。

2)特点

Code Server,作为一款开源代码编辑器,完美地将 Visual Studio Code 的强大功能融入到了 Web 浏览器中。它不仅具备基本的代码编辑、语法高亮、智能感知和自动补全等特性,更支持多人协作和远程开发,为开发者提供了前所未有的便捷体验。

这种能够在浏览器中运行的集成开发环境,通常被称为 Cloud IDE,而 Code Server 正是其中的佼佼者。无论是本地计算机还是云服务器,只需部署 Code Server,用户即可通过浏览器随时随地访问并使用其中的编辑器功能,无需额外安装本地编辑器。

Code Server 的这一特性极大地便利了远程开发、多人协作以及快速搭建开发环境等操作。此外,它还支持丰富的自定义插件和扩展,满足了不同用户的个性化需求,使得开发过程更加高效、灵活。

3)环境

3.1)安装 Docker 软件

# 高版本 Docker 安装
curl -fsSL https://get.docker.com/ | sh
# 关闭防火墙
systemctl disable --now firewalld
setenforce 0
# 启用 Docker
systemctl enable --now docker

3.2)检查 Docker 服务

systemctl status docker

3.3)开启 IPv4 forwarding

echo "net.ipv4.ip_forward=1" >> /etc/sysctl.conf
systemctl restart network
sysctl net.ipv4.ip_forward

4)部署

4.1)下载镜像

docker pull codercom/code-server:latest

4.2)创建目录

mkdir /docker/vscode -p && cd /docker/vscode

4.3)启用容器

docker run -d --name code-server -p 8000:8080 -e PASSWORD=123456 -v /docker/vscode/data:/root/.vscode-server codercom/code-server:latest

4.4)验证容器

docker ps -a

image.png

5)访问验证

使用浏览器访问 VS Code 前台 http://服务器IP地址:8000

填写我们启用容器时 配置的密码

image.png
image.png

5.1)更换主题

image.png

5.2)扩展商店

image.png

5.3)中文配置

安装简体中文语言包:@category:“language packs”

image.png

打开搜索框,输入:> configure display language

image.png

重启服务后生效

image.png
image.png

大功告成~

这篇关于使用 Docker 部署 VS Code in The Browser的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!


原文地址:
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.chinasem.cn/article/983107

相关文章

linux部署NFS和autofs自动挂载实现过程

《linux部署NFS和autofs自动挂载实现过程》文章介绍了NFS(网络文件系统)和Autofs的原理与配置,NFS通过RPC实现跨系统文件共享,需配置/etc/exports和nfs.conf,... 目录(一)NFS1. 什么是NFS2.NFS守护进程3.RPC服务4. 原理5. 部署5.1安装NF

使用Go调用第三方API的方法详解

《使用Go调用第三方API的方法详解》在现代应用开发中,调用第三方API是非常常见的场景,比如获取天气预报、翻译文本、发送短信等,Go作为一门高效并发的编程语言,拥有强大的标准库和丰富的第三方库,可以... 目录引言一、准备工作二、案例1:调用天气查询 API1. 注册并获取 API Key2. 代码实现3

MySQL8.0临时表空间的使用及解读

《MySQL8.0临时表空间的使用及解读》MySQL8.0+引入会话级(temp_N.ibt)和全局(ibtmp1)InnoDB临时表空间,用于存储临时数据及事务日志,自动创建与回收,重启释放,管理高... 目录一、核心概念:为什么需要“临时表空间”?二、InnoDB 临时表空间的两种类型1. 会话级临时表

MySQL之复合查询使用及说明

《MySQL之复合查询使用及说明》文章讲解了SQL复合查询中emp、dept、salgrade三张表的使用,涵盖多表连接、自连接、子查询(单行/多行/多列)及合并查询(UNION/UNIONALL)等... 目录复合查询基本查询回顾多表查询笛卡尔积自连接子查询单行子查询多行子查询多列子查询在from子句中使

Kotlin 协程之Channel的概念和基本使用详解

《Kotlin协程之Channel的概念和基本使用详解》文章介绍协程在复杂场景中使用Channel进行数据传递与控制,涵盖创建参数、缓冲策略、操作方式及异常处理,适用于持续数据流、多协程协作等,需注... 目录前言launch / async 适合的场景Channel 的概念和基本使用概念Channel 的

C#使用SendMessage实现进程间通信的示例代码

《C#使用SendMessage实现进程间通信的示例代码》在软件开发中,进程间通信(IPC)是关键技术之一,C#通过调用WindowsAPI的SendMessage函数实现这一功能,本文将通过实例介绍... 目录第一章:SendMessage的底层原理揭秘第二章:构建跨进程通信桥梁2.1 定义通信协议2.2

使用python制作一款文件粉碎工具

《使用python制作一款文件粉碎工具》这篇文章主要为大家详细介绍了如何使用python制作一款文件粉碎工具,能够有效粉碎密码文件和机密Excel表格等,感兴趣的小伙伴可以了解一下... 文件粉碎工具:适用于粉碎密码文件和机密的escel表格等等,主要作用就是防止 别人用数据恢复大师把你刚删除的机密的文件恢

MySQL使用EXISTS检查记录是否存在的详细过程

《MySQL使用EXISTS检查记录是否存在的详细过程》EXISTS是SQL中用于检查子查询是否返回至少一条记录的运算符,它通常用于测试是否存在满足特定条件的记录,从而在主查询中进行相应操作,本文给大... 目录基本语法示例数据库和表结构1. 使用 EXISTS 在 SELECT 语句中2. 使用 EXIS

Docker多阶段镜像构建与缓存利用性能优化实践指南

《Docker多阶段镜像构建与缓存利用性能优化实践指南》这篇文章将从原理层面深入解析Docker多阶段构建与缓存机制,结合实际项目示例,说明如何有效利用构建缓存,组织镜像层次,最大化提升构建速度并减少... 目录一、技术背景与应用场景二、核心原理深入分析三、关键 dockerfile 解读3.1 Docke

在Android中使用WebView在线查看PDF文件的方法示例

《在Android中使用WebView在线查看PDF文件的方法示例》在Android应用开发中,有时我们需要在客户端展示PDF文件,以便用户可以阅读或交互,:本文主要介绍在Android中使用We... 目录简介:1. WebView组件介绍2. 在androidManifest.XML中添加Interne