【教程】轻量折腾计划3，搭建属于自己的开发全家桶，上篇

nnt

原文Markdown写的，更好的阅读体验请前往：https://cloud.tencent.com/developer/article/1861516

前言

前几天有事需要外出一趟，恰好某个项目出现了个比较严重的BUG，可苦于当时没有带电脑，借用朋友的电脑用了用也因为其上边没有我平常用的IDE，也没有相关的环境，修复的过程可谓是痛苦万分，最终只能在宝塔的编辑器中完成...这时我不禁琢磨，是否能搭建这么一套基于WEB的开发全家桶，让开发者能够随时随地用浏览器就能进行开发呢？说干就干！

正文

既然要搭建这么一套全家桶，那么需要准备以下物品：

• VPS服务器一台
• 域名一个（如果你直接记IP也没问题）
  

首先是VPS服务器，正如我们的标题一般，轻量折腾计划，故而我们这里选择的服务器是腾讯云的轻量应用服务器Lighthouse。腾讯云的轻量服务器因其活动多、优惠大、性价比高而广泛闻名于国内的中小站长群体之间，虽然没有弹性网卡等一些CVM的功能，但其近期上线了VPC内网互联也同样补齐了很大一块短板。对于我们这些需求不大的小站长的需求可以说是基本上覆盖全的了，而且还不限制CPU，一核比某些灵车的四核还强。



而且还长期打活动中（https://cloud.tencent.com/act/new），99/1年，这价位算是性价比之王了吧，有兴趣的同学可别错过了哟。

零、基础准备

既然是全家桶，那么肯定是需要安装多款应用的，而且苦于口袋里的钱包厚度，那肯定是要一台机子就干全部活儿啦。那么就需要安装如下环境：

• 宝塔面板（方便管理，如果你是大佬也可以无视）
• Nginx（主要用于做反代，如果是国内机子+没北岸的域名可以不用反代，直接解析IP后加上端口就行）
• Docker（快速安装某些应用）
  

（0）宝塔面板

关于宝塔面板的安装可以说是非常简单的，根据官网的这个帖子：https://www.bt.cn/bbs/thread-19376-1-1.html

**Centos安装命令：**

1. yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh

复制代码

**Ubuntu/Deepin安装命令：**

1. wget -O install.sh http://download.bt.cn/install/install-ubuntu_6.0.sh && sudo bash install.sh

复制代码

**Debian安装命令：**

1. wget -O install.sh http://download.bt.cn/install/install-ubuntu_6.0.sh && bash install.sh

复制代码

**Fedora安装命令:**

1. wget -O install.sh http://download.bt.cn/install/install_6.0.sh && bash install.sh

复制代码

根据你服务器的操作系统选择不同的安装命令后执行，遇到`Do you want to install Bt-Panel to the /www directory now?(y/n)`输入`y`后回车，等待一会儿就成功安装好了：

1. ==================================================================
   
2. Congratulations! Installed successfully!
   
3. ==================================================================
   
4. 外网面板地址: http://xxx.xxx.xxx.xxx:8888/6e21e07d
   
5. 内网面板地址: http://10.0.8.17:8888/6e21e07d
   
6. username: gunftd4a
   
7. password: f92c3dd4
   
8. If you cannot access the panel,
   
9. release the following panel port [8888] in the security group
   
10. 若无法访问面板，请检查防火墙/安全组是否有放行面板[8888]端口
    
11. ==================================================================
    
12. Time consumed: 0 Minute!
    
13. [root@VM-8-17-centos ~]#

复制代码

我们打开浏览器，访问上边的外网面板地址（轻量用户记得去防火墙添加8888端口），填入随机生成的用户名和密码，并同意用户协议后进入面板。进入面板后第一件事就是修改面板设置，将默认的8888端口进行修改（注意防火墙/安全组提前放行），用户名、密码、与安全入口进行修改、开启BasicAuth认证（推荐），到这我们的宝塔面板算是安装好了。

（1）Nginx

在上一步中我们安装了宝塔面板，那么在这一步中就特别简单了，直接在宝塔面板的左侧栏点击软件商店，找到Nginx之后点击安装即可：



点击确定后等待一会儿就安装好了：



（2）Docker

Docker是一种容器化技术，可以利用容器快速的搭建起我们想要的环境/应用，类似于虚拟机，但是相比较于虚拟机来说要轻量许多。

关于Docker的安装我们可以直接使用官方提供的一键安装脚本来进行，安装命令如下：

1. curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun

复制代码

也可以使用国内 daocloud 一键安装命令：

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

复制代码

两条命令，任意选择一个都可以，复制后到服务器终端粘贴后回车运行，等待一会儿后安装成功。

docker安装成功之后，执行以下命令启动docker：

1. service docker start

复制代码

启动好docker后，尝试运行：`docker ps`，看看是否有无报错产生。

最后，我们来修改docker的镜像源，保证能够成功地拉取docker镜像；编辑文件/etc/docker/daemon.json（若不存在则可以新建一个），内容如下：

1. {
   
2. "registry-mirrors": [
   
3. "https://hub-mirror.c.163.com",
   
4. "https://mirror.baidubce.com"
   
5. ]
   
6. }

复制代码

如果读者用的也是轻量服务器的话，可以使用腾讯内网的加速源：`mirror.ccs.tencentyun.com`。

编辑好文件并保存后，输入命令：`service docker restart`让docker重启以载入配置文件，重启完成后输入`docker info`查看是否设置成功：

1. Registry Mirrors:
   
2.   https://mirror.ccs.tencentyun.com/
   
3. Live Restore Enabled: false
   
4. 
   
5. [root@VM-8-17-centos ~]#

复制代码

至此，我们的一些列准备过程结束。

一、在线IDE

既然是要编程，那么肯定离不开IDE呀，这年头，不会真有人用记事本编程吧。

经过一段时间的查找，我们打算使用vscode官方出的WEB班vscode：https://github.com/cdr/code-server，从外观上来看，可谓是跟桌面版vscode别无二致。



接下来是code-server的安装，首先我们新建一个配置项目录：

1. mkdir ~/.config && mkdir /project

复制代码

接着直接使用docker进行安装：

1. docker run -itd --name code-server -p 127.0.0.1:8080:8080 \
   
2.   -v "$HOME/.config:/home/coder/.config" \
   
3.   -v "/project:/home/coder/project" \
   
4.   -u "$(id -u):$(id -g)" \
   
5.   -e "DOCKER_USER=$USER" \
   
6.   codercom/code-server:latest

复制代码

可以看到，我们将容器内的8080端口映射到本地的8080端口（若是直接使用端口的朋友可以把此处的127.0.0.1改为0.0.0.0），并且我们把新建的两个目录给挂载到了容器内，这样一来我们可以直接在容器内修改容器外部的文件。

使用命令`docker ps`可以看到我们的容器在运行当中：

1. [root@VM-8-17-centos ~]# docker ps
   
2. CONTAINER ID   IMAGE                         COMMAND                  CREATED          STATUS          PORTS                      NAMES
   
3. 51fb2363150e   codercom/code-server:latest   "/usr/bin/entrypoint…"   45 seconds ago   Up 44 seconds   127.0.0.1:8080->8080/tcp   code-server
   
4. [root@VM-8-17-centos ~]#

复制代码

然后就是反向代理，将我们的域名（此处使用test.com做演示之用）跟容器的环境结合在一起。

在宝塔添加一个网站（ide.test.com）：



添加好后点击设置，添加反向代理：



由于需要用到websocket，故而我们还需要修改配置文件，添加如下配置项：

1.     proxy_http_version 1.1;
   
2.     proxy_set_header Upgrade $http_upgrade;
   
3.     proxy_set_header Connection upgrade;

复制代码

打开浏览器，输入我们的网站：ide.test.com



输入`cat ~/.config/code-server/config.yaml`查看随机生成的密码：

1. [root@VM-8-17-centos ~]# cat ~/.config/code-server/config.yaml
   
2. bind-addr: 127.0.0.1:8080
   
3. auth: password
   
4. password: 352e558396b4688211258ebd
   
5. cert: false
   
6. [root@VM-8-17-centos ~]#

复制代码

输入密码进入即可，若想要修改密码，可直接修改此文件中的密码，再重启容器即可。

nnt

二、GIT平台

既然我们有了自己的IDE，那干脆在给直接整个git平台作为我们平常项目的记录库岂不美哉。说干就干，因为我们是要多个应用共同搭建在同一台服务器上，故而此处我们不选择gitlab（有点吃配置），而是选择相对精简的gogs（https://github.com/gogs/gogs）。



同样也是用docker部署，在这种多应用同时部署的环境中，不同应用直接使用不同的容器做隔离，互不影响，减少了直接的干扰，可以说是优势巨大了。

首先新建一个目录做为挂载点，让容器内的数据与外部数据互通：

1. midir /gogs

复制代码

接着运行命令：

1. docker run -p 3022:22 -p 3000:3000 --name=gogs \
   
2. -v /gogs:/data  \
   
3. -d gogs/gogs

复制代码

使用命令docker ps查看部署情况：

1. [root@VM-8-17-centos ~]# docker ps
   
2. CONTAINER ID   IMAGE                         COMMAND                  CREATED          STATUS          PORTS                                                                              NAMES
   
3. 529a758630a8   gogs/gogs                     "/app/gogs/docker/st…"   10 seconds ago   Up 10 seconds   0.0.0.0:3000->3000/tcp, :::3000->3000/tcp, 0.0.0.0:3022->22/tcp, :::3022->22/tcp   gogs

复制代码

同样是老规矩，我们吧3000端口进行反代一下，这里我们用git.test.com做演示。反代过程参考codeserver的安装，由于不需要websocket，故而也不需要编辑配置文件的操作了。

反代好之后访问我们的域名：



这里为了方便，我们直接选择使用sqlite作为数据库。



应用基本设置内，除了应用URL我们修改为：`http://git.test.com`之外，其他保持默认即可：



可选设置中设置上管理员：



点击立即安装后，GIT平台搭建完毕：



来看下我们的资源占用情况（2核4G内存）：



可以看到，4G的内存目前占用不足1G，可以说是相当的精简了，小主机也能轻松跑起来，这使得我们为后续应用的安装腾出了许多的空间。

后话

现在，我们已经拥有了自己的在线IDE，也有了自己的GIT平台，已经可以完成日常中大部分开发常需要的功能了，不过这还不够，由于篇幅所限，在下篇文章中，我将继续带大家完善我们的开发者全家桶套餐，将我们的浏览器编程板块继续补充完整~

nnt

realspir 发表于 2021-8-19 02:00
大佬, 按教程配置好, 网页也能打开登录界面了, 但是去找密码的时候提示 ~/.config/code-server/config.yaml ...

啊这，可以尝试进入容器内修改，docker exec -it 容器ID /bin/bash，进去后vi编辑文件，然后exit退出容器终端，docker restart 容器ID

YorkZhao

ime 发表于 2021-8-19 10:28
腾讯科技(北京)有限公司客户端安全工程师 大佬都逛mjj论坛，荣幸荣幸。

良心云问卷里面就有loc
所以说，mjj里面肯定有内鬼（bushi

YorkZhao

最终极的玩法就是拉Ubuntu镜像并装宝塔

CNAME

牛掰大佬

xinchenmi

这就奇了怪了，我网站部署了后没有这个~/.config/code-server/config.yaml

nnt

drivefuse 发表于 2021-8-17 00:26
支持，更新踢我一下

下篇已发布~
https://lilynana.eu.org/thread-881917-1-1.html

ime

腾讯科技(北京)有限公司客户端安全工程师 大佬都逛mjj论坛，荣幸荣幸。

ab123li

感谢大佬分享  看完就当操作过了

brucex

谢谢楼主分享，很详细。