【code-server】部署浏览器上的VSCode「IPAD编程」

已于 2022-05-23 10:46:43 修改
阅读量4.6k 收藏 96
点赞数 14
分类专栏： 环境配置 文章标签： vscode ipad编程 code server 网页编程 服务器
于 2022-04-03 17:21:34 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_33884853/article/details/123937724
版权

IPAD编程

1.搞起

有时候出门在外,没带电脑,又或是带了电脑但是没电了(xiao),这就很难搞.偶然间发现一个东西叫做code server,正好可以利用上ipad来进行远程编程,即浏览器编程!妙极了!将ipad利用起来吧,随时随地,只要有网就可以愉快的敲代码!

2.关于服务器

要部署code server是需要去租用一个服务器的,我选择的阿里云的服务器,好像新号是有优惠的,我这2核2g的是一年69,其实不贵,还好.
我用的是Ubuntu 20.04,其实其他linux都是可以的.

3.下载code server

在服务器购买完成之后,我们需要下载对应版本的code server在服务器里面.
根据自己的服务器系统进行下载对应的,以下我采用的是Ubuntu20.04系统.
github的项目地址为github code server

1. 可以使用wget直接在服务器里进行下载

这个方法由于某种dddd的原因,速度会比较慢,如果不嫌慢的话就这样下吧

wget https://github.com/coder/code-server/releases/download/v4.2.0/code-server-4.2.0-linux-amd64.tar.gz

这样下载的可以跳过第四步.

2. 自行下载,然后传到服务器中

点击这个进行下载下载链接
如果速度慢的可以可以用迅雷等工具下载会快一点.

4. 将下载的code server上传到服务器

我这里使用的软件是Xftp7,下载的话百度就可以找到了,此处就不放链接了.
下载安装完成之后,新建会话,名称随意,主机填你的服务器公网ip,这个可以在阿里云里看到的.然后下面的用户名和密码,一般用户名为root,密码是你自己设置的(注意:刚买的话是需要自己在服务器里重置一下密码的)
在这里插入图片描述
连接之后的界面是这样的:
在这里插入图片描述

右边本来应该是空白的,然后我们把刚才下载的code server文件拖进去就可以了.

5. 下载Xshell7连接服务器

此处我用的软件是Xshell7,其实其他的也可以,不过此处我用的是这个.
下载安装之后,新建连接
在这里插入图片描述
然后再点击用户身份认证,输入用户名和密码
在这里插入图片描述
之后连接成功之后是这样的,这样就完成了这一步.
在这里插入图片描述

6. 解压code server

首先可以使用linux指令 ls来看看有什么东西

ls

正常情况下再完成上一步之后会看到这个文件.
在这里插入图片描述
然后进行解压

tar -xvzf code-server-4.2.0-linux-amd64.tar.gz

然后再ls就可以看到一个解压过的文件夹了
在这里插入图片描述

7. 部署code server

1. 首先进入对应的文件夹

使用指令cd来进入

cd code-server-4.2.0-linux-amd64

再进到bin

cd bin

2.运行

输入指令来将密码修改为你想要的,以及将端口设置为你想要的.此处为密码123456,端口号8888

export PASSWORD="123456" && ./code-server --port 8888 --host 0.0.0.0

当你看到这样的样子就说明运行成功了
在这里插入图片描述

8. 安全组开放对应的端口

千万不要高兴的太早,此时还需要在服务器的安全组中开放一下你现在用的8888端口.如果是其他端口就变通一下(血与泪的教训,之前部署的时候忘了这一点然后就怎么也打不开一致404,哎)
我用的是阿里云,进入安全组之后,点击手动添加.
在这里插入图片描述
然后输入端口8888/8888,源就0.0.0.0/0表示所有用户.
在这里插入图片描述

9. 在浏览器中看看自己的成功吧!

在浏览器地址栏处输入 你的服务器公网ip:8888 来进行访问.如12.234.34.232:8888.
在这里插入图片描述
输入你设置的密码,就可以迎接崭新的vscode了
在这里插入图片描述
是不是和vscode一模一样!我这是加过中文插件的,你们刚进去应该是英文的,只需要去插件里安装一个chinese就可以了.至于其他的插件,看你们需要自己去下载就完事了!我这里简单的演示一下python的运行
在这里插入图片描述
运行成功,✌!

10. 还有一步,别跑!使用screen来让他一直运行.

现在看似我们基本成了,但是还有一个问题没有解决.那就是当我们把Xshell7关了之后就不能打开网页了.我们可以通过screen来解决这个问题.

1. 安装screen

apt install screen

2. 新建一个screen

名字自己可以随便取,我这叫codeServer

screen -S codeServer

新建成功会出现一个新的窗口,然后在这里进行上面运行的操作
在这里插入图片描述
当再次出现这个样子,就说明你成功了!!!
在这里插入图片描述
此时你需要按住ctrl + a + d来退出来就大功告成了.这样你关掉Xshell7也就没有问题了.

11. 享受你的Ipad编程吧!

此处附上一张Ipad上打开的界面请添加图片描述
有关code server的环境配置,这里就不细说了,在下面这个链接里将描述怎么配置java,python,C++等语言的环境.
【code-server】配置code server语言运行环境「IPAD编程」「Python」「JAVA」「C++」

新手上路,有错请指正!

Khalil三省
关注
  • 14
    点赞
  • 踩
  • 96
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 8
    评论
专栏目录
为ipad搭建code-server服务
MyCyber
01-10 4717
为ipad搭建code-server服务   时常会遇到想写两行代码验证某个想法而手边没有电脑的情况，这时有个网页版的vscode就会很方便。 下载运行code-server （这次使用的服务器环境：阿里云Ubuntu 20.4） 1、从GitHub的code-server仓库下载release版本   https://github.com/cdr/code-server/releases   选择合适的版本 2、传至服务器并解压   本文下载的是code-server-3.8.0-linux-amd64
docker-compose部署code-server配置文件详情
06-15
code-server部署在docker上需要的配置文件，一件部署，实现在线编码
code server 服务端完整部署教程，轻松实现移动办公，平板手机也可在vs code上编程
jump89的博客
05-15 2061
本文详细描述了在服务器上安装code server的过程及疑难点，让读者可以轻松地实现在平板和手机上使用vs code来进行编程。
浏览器编程，部署code-server指南
comfly的博客
02-18 3649
code-server是一款在线的 VS Code，只需将其部署到服务端，就可以在浏览器上使用 VS Code，适合团队协作，本文将介绍 code-server 安装和使用方法，以docker为例。
【iPad使用Vscode】iPad安装IDE应用使用Vscode远程开发写代码详细流程
最新发布
Koma_zhe的学习笔记
06-06 1796
【iPad使用Vscode】iPad安装IDE应用使用Vscode远程开发写代码详细流程
服务器（容器）开发指南——code-server
focus：Follow One Cause Until Success
08-24 6369
运行在浏览器上的VSCode。自VSCode发布以来，VSCode就受到了广大程序员的青睐。VSCode丰富的插件能够满足使用者各色各样的需求。但VSCode使用受限于图形化界面的需求，只能安装在客户端而不能安装在服务器上。code-server的出现完美的解决了VSCode不能安装在服务端的缺陷。
让IPad变成你的生产力工具？在IPad上用Vscode写代码搞开发
狂小伍的博客
06-01 4460
让IPad变成你的生产力工具？在IPad上用Vscode写代码搞开发
在线代码编辑器code-server
wbsu2004的博客
05-02 8170
在任何地方的任何机器上运行 VS Code 并在浏览器中访问它。
【Linux】浏览器写代码！部署code-server远程vscode网页
慕雪华年的博客
04-24 5628
注意，这不是在linux系统上安装vscode软件（和windows一样的vscode客户端）开源仓库 https://github.com/coder/code-servercode-server是一个社区项目（非微软官方）其作用是在你的linux主机（云服务器）上部署一个可以在浏览器上访问的vscode页面，类似官方的vscode.dev微软官方推出的vscode网页版 https://vscode.dev/它可以通过浏览器的api访问你电脑上的本地文件，此时浏览器就是一个vscode客户端。
开源IPad Pro应用IDE：使用SSH远程连接服务器进行云端编程开发
Aron的博客
12-14 4507
本文主要介绍开源iPad应用IDE如何下载安装，并通过cpolar内网穿透工具实现SSH远程连接服务器进行云端编程开发，有效节省工作时间并提高开发效率。随着平板电脑的普及，它已经不仅仅是一个娱乐工具，而是逐渐融入我们的工作与生产活动中。更为值得一提的是，强大的性能让 iPad 在越来越多的场景下，成为生产力工具，如设计、协同办公、教学领域等等。不论是编辑文件，还是进行代码编写，平板电脑都能轻松胜任，实现移动办公的全新体验。「Code App」。并如何使用SSH远程连接服务器进行云端编程开发。
git-commit-lint-vscode:vscode一款git 规范化提交插件
05-17
git-commit-lint-vscode 在日常的开发中,目前主流的代码管理工具就是 git 了,当我们对代码进行改动了,首先得git commit提交到本地仓库,git 规定了提交时必须填写提交信息作为改动说明,保存 commit 历史中,可以找到...
code-translate-vscode:vscode的代码翻译
08-03
代码翻译简介vscode 滑词 & 悬浮 翻译插件预览悬浮翻译执照麻省理工学院执照版权所有 (c) [2020] [w88975] 特此授予任何人免费获得本软件副本和相关文档文件（“软件”）的许可，不受限制地处理本软件，包括但不限于...
vscode-langservers-extracted:vscode longservers bin集合
05-07
当前，最新的css-language-server比vscode-css-langserver-bin有所改进。 用法 您可以通过npm i -g vscode-langservers-extracted安装它。 之后，您将获得用于$ PATH的vscode-html-language-server ， vscode-css-...
vscode-css-languageserver-bin：在VSCode树中提取的vscode-css-languageserver的npm上发布的二进制版本
02-05
vscode-css-languageserver-bin 从提取的npm上发布的二进制版本产品特点 CSS支持 更少的支持 SASS支持 完成提供商（需要代码片段支持） 代码操作（重命名拼写错误的属性） 验证（语法和皮棉错误） 悬停工具提示提供...
code-server安装使用
mijichui2153的博客
07-18 1万+
code-server是一款基于VSCode的在线编辑器，它提供了一个web话的在线IDE。 服务端上运行code-server(可以理解为一个在远程服务器上运行的VS Code)，客户端就可以使用浏览器打开vscode，vscode上的资源都是服务器上的资源。通过code-server我们可以实现远程编辑调试服务器端的程序，相当于vscode的ssh remote。code-server和直接ssh remote的区别就后者还需要安装vscode软件，而前者连客户端软件都不需要安装。不过code-ser
简单3步部署code-server(vscode网页版)
weixin_41521681的博客
08-26 1万+
浏览器上的IDE：code-server安装——服务器版的vscode
在你的ipad上使用Vscode撸代码（快速操作向）
热门推荐
文杰的博客
11-29 3万+
单独在ipad上运行肯定是不行的，毕竟不是pc端。所以code-server的功能就是将其部署在服务器上，ipad使用网页或app访问其服务，使用服务器的资源来跑代码，而ipad前端上只负责撸代码与运行就可以啦 一、预备条件 一个云服务器（推荐学生买个阿里云学生机，一年一百来块钱，便宜又好用） 一个ipad 二、配置服务器 远程连接到云服务器，我的是阿里云的学生机 系统：Ubuntu18.04 执行以下步骤: # 创建文件夹下载code server安装包 wget https://github.
ipad使用code_server实现远程开发
四库全书的酷
11-12 445
不过，虽然我们现在可以直接访问 code-server 了，但直接在 Safari 浏览器里面使用 code-server 体验还是比较糟糕，上面地址栏和下面外接键盘出现的菜单栏都让直接在浏览器里使用 code-server 非常不顺畅，因此我们最好使用下面介绍的 VSApp 来管理、连接 code-server 使用。我们将得到这样的一个文件夹，其中 code-server 是 Linux 可执行文件，我们直接运行即可在远程服务器上开启 code-server。
如何在iPad上使用VScode
zinc1234596的博客
08-23 1万+
如何在iPad上使用VScode 部署code-server 前提工作： 一台云服务器、iPad上的SSH工具(推荐使用软件Termius) 这里用的是Linux centOS、IPad上用Termius 步骤： 在服务器上下载code-server GitHub上的开源地址https://github.com/cdr/code-server 下载方式可以选择在windows下使用下载器下载，再传到Linux服务器上。或者直接在服务器终端上命令下载。这里用第二种方式。 下载： wget https:/
如何只用 code-server 的服务，不用vscode
08-17
### 回答1： 您可以使用以下方法在不使用 VSCode 的情况下使用 Code-Server： 1. 安装 Code-Server：可以通过以下命令安装 Code-Server： ``` curl -fsSL https://code-server.dev/install.sh | sh ``` 2. 启动 Code-Server：启动 Code-Server 的命令如下： ``` code-server ``` 3. 使用浏览器访问 Code-Server：在浏览器中输入 Code-Server 的 URL，即可访问 Code-Server。URL 的格式如下： ``` http://[hostname]:[port] ``` 其中，`hostname` 是 Code-Server 所在服务器的主机名或 IP 地址，`port` 是 Code-Server 监听的端口号。默认情况下，Code-Server 监听的端口号为 8080。 您还可以使用命令行选项来自定义 Code-Server 的启动参数。例如，要将 Code-Server 的监听端口设为 8443，可以使用以下命令启动 Code-Server： ``` code-server --port 8443 ``` 希望这些信息能帮到您。 ### 回答2： 要只使用 code-server 服务而不使用 VS Code，可以按照以下步骤进行操作： 1. 安装 code-server：在你的服务器或电脑上安装和配置 code-server 。你可以在 GitHub 上找到 code-server 的代码仓库，并按照文档上的指导进行安装步骤。 2. 启动 code-server：在安装完成后，运行 code-server 的命令来启动服务。命令的具体内容可以在 code-server 的文档中找到。通常情况下，你需要提供一个端口号和访问密码。 3. 访问 code-server：使用任何支持 web 浏览器的设备，输入服务器的 IP 地址和端口号来访问 code-server。例如，如果你的服务器 IP 地址是 192.168.0.100，而 code-server 的端口号是 8080，那么你可以在浏览器中输入 `192.168.0.100:8080` 来访问 code-server。 4. 登录 code-server：在浏览器打开 code-server 后，你可能需要输入访问密码来登录。这个密码是你在启动 code-server 时设置的。 5. 使用 code-server：一旦成功登录，你就可以在浏览器中开始使用 code-server 了。code-server 的界面和功能与 VS Code 类似，你可以在其中编写和调试代码，并使用各种插件和扩展。 熟练掌握 code-server 后，你就可以只使用这个服务，而不用安装和配置本地的 VS Code 软件。这样可以方便地在多个设备上访问代码，并在服务器上进行开发和编辑。 ### 回答3： code-server 是一个基于浏览器的远程开发工具，允许用户通过浏览器访问并使用 Visual Studio Code 的功能。如果你只想使用 code-server 的服务而不使用本地的 Visual Studio Code 客户端，可以按照以下步骤进行操作： 1. 安装 code-server： - 在你的服务器上安装 Docker，或者使用其他适用于你的操作系统的方法安装 code-server。 - 根据官方文档提供的说明，下载并安装 code-server。这将在服务器上创建一个可访问的 code-server 实例。 2. 访问 code-server： - 打开任意支持现代浏览器的设备，并在浏览器中输入服务器的 IP 地址和端口号。默认端口号为 8080，可以根据需要进行配置。 - 如果一切正常，你将在浏览器中看到 code-server 的登录页面。 3. 登录并使用 code-server： - 输入你在以前设置的密码，或者按照首次登录时的提示设置密码。 - 成功登录后，你将看到一个与 Visual Studio Code 相似的编辑器界面。 - 在这里你可以编写、编辑代码，使用扩展和插件等功能，与使用本地的 Visual Studio Code 时类似。 尽管 code-server 提供了许多与 Visual Studio Code 相似的功能，但仍然有一些限制，例如某些扩展可能无法正常工作，某些高级功能可能不可用。此外，由于在远程服务器上运行，可能会受到网络延迟的影响。因此，如果你的需求无法满足 code-server 的限制，或者对你的开发工作有严格的性能要求，你可以考虑使用本地的 Visual Studio Code 客户端进行开发。
评论 8
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Khalil三省

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值