Class 3搭建在线编程环境

迈不过友情╰ 2022-11-25 10:05 144阅读 0赞

# Class 3搭建在线编程环境 #

## 一、服务器购买 ##

服务器购买已经在上篇文章中仔细讲解，所以在这里就不再累述，有需要的 点击下列地址查看。

[https://blog.csdn.net/m0\_46265254/article/details/107847422][https_blog.csdn.net_m0_46265254_article_details_107847422]

## 二、服务器管理软件 ##

### 管理终端 ###

管理我们的服务器我们需要通过相关软件，针对Linux服务器的管理，这⾥推荐使⽤ Putty。  
PuTTY 是⾃由的跨平台 Telnet/SSH 客户端，同时在 Win32 和 Unix 系统下模拟 xterm 终端。其主要作者是 Simon Tatham。  
由 Larry Li维护并开源的中⽂版：  
[下载][Link 1]

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70]

下载完成之后解压文件夹打开putty.exe文件

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70 1]

连接公网IP，如果Putty连接失败那么采取使用安全组的方案全部开放

![在这里插入图片描述][20200807173732696.jpg]

输入你的root账户和密码

### ⽂件传输 ###

推荐 Filezilla 通过 SFTP 协议进⾏本地和服务器的⽂件传输和管理。  
[下载][Link 2]

默认文本编辑器可能产生乱码因此我们选择VSCode

### 代码编辑 ###

很多⽼⼿会推荐⽤ vim，但是对新⼈来说可视化的 Visual Studio Code，可以更⾼效的进⾏代码编辑和管理。  
[下载][Link 3]

## 安装Docker容器环境 ##

我们需要安装⼀下 Docker 和 Docker Compose 来作为应⽤程序运⾏的基础环境。  
通过 Docker 开发者可以将应⽤以及其依赖打包到⼀个轻量、可移植的容器当中，这样就可以避免依赖和兼容性问题，极⼤的降低服务器环境的部署难度。例如开发者在交付⼀个项⽬时只需要给出 Docker⽅案，⽤户仅需要⼏⾏命令就可以快速运⾏项⽬。  
同时Docker容器完全使⽤沙箱机制，相互之间不会有任何接⼝（类似 iPhone 的 app），实现应⽤间的有效隔离，特别是在⼀些应⽤托管的领域， Docker ⼤⼤提升了安全性。  
⽬前云计算⽣态有⾮常多的产品和⽅案都是围绕 Docker 和其背后的容器服务展开的，学习 Docker 部署是很重要的能⼒。

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70 2]

首先我们已经使用过的ECS要停止服务

![在这里插入图片描述][2020080717381933.jpg]

然后我们在配置信息选更多，更换操作系统

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70 3]

选择公共镜像，然后选择Ubuntu18.04 64位 设置密码来更换操作系统

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70 4]

我们通过 Putty 连接服务器后

⼀、安装 Docker 环境

curl -sSL https://get.daocloud.io/docker | sh

安装的过程有些慢等待即可

⼆、安装 Docker-Compose 环境，其中 1.25.3 可以根据 最新版本 修改

curl -L
    https://get.daocloud.io/docker/compose/releases/download/1.25.4/dockercompose-`uname -s`-`uname -m` > /usr/local/bin/docker-compose
    chmod +x /usr/local/bin/docker-compose

## 部署WebIDE ##

我们可以使用code-server解决方案将Visual Studio Code在服务器中运行，那么我们就可以进行跨平台操作  
1.创建项⽬⽂件夹：

mkdir -p /home/coder/project

2.在 Docker 中运⾏：

docker run -it -p 80:8080 --name code -v
    "/home/coder/project:/home/coder/project" codercom/code-server:latest

3.Code-server 开始部署。

![在这里插入图片描述][20200807173852320.jpg]

4.在 info 的信息中，有⼀⾏是 `Password is xxxx` 就是我们的保护密码，要记住。

![在这里插入图片描述][20200807173901997.jpg]

5.在浏览器中输⼊我们的公⽹IP http://你的公⽹IP，就可以看到浏览器中运⾏的VSC了！

## 使用Web IDE ##

Code-Server 的使⽤和 Visual Studio ⼀致  
1.我们新建⼀个⽂件（File-New File）  
2.点击右下⻆的 Plain Text  
3.选择对应语⾔的⾼亮语法，例如我这⾥要写的是 Shell Script  
4.输⼊内容，例如我这⾥写了 Hello World  
5.然后左上⻆菜单键击 Save 保存  
6.我这⾥保存为 hello.sh

[https_blog.csdn.net_m0_46265254_article_details_107847422]: https://blog.csdn.net/m0_46265254/article/details/107847422
[Link 1]: https://github.com/larryli/PuTTY/releases
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70]: /images/20221124/3977a5fb583e41e2b0898a3f8ef8b09d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70 1]: /images/20221124/f706ac65b6ab466286aa9b8063df098d.png
[20200807173732696.jpg]: /images/20221124/66971f5ba9b2469b98f99f1df9d9e6d6.png
[Link 2]: https://filezilla-project.org/download.php?type=client
[Link 3]: https://code.visualstudio.com/Download
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70 2]: /images/20221124/3a49f6cb674d4c54a9bcaf671bde4d07.png
[2020080717381933.jpg]: /images/20221124/4e4a528f9c224bb5bb85e311f3ca25d1.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70 3]: /images/20221124/9f30a9f4465842bfb7a2295bc0075831.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzQ2MjY1MjU0_size_16_color_FFFFFF_t_70 4]: /images/20221124/1412ed719ab84946a920969d0b152e41.png
[20200807173852320.jpg]: /images/20221124/1154484269134e5aaf56161420663225.png
[20200807173901997.jpg]: /images/20221124/4d81b1c344c24983adce41f7123d7165.png