前言
前几天有事需要外出一趟，恰好某个项目出现了个比较严重的BUG，可苦于当时没有带电脑，借用朋友的电脑用了用也因为其上边没有我平常用的IDE，也没有相关的环境，修复的过程可谓是痛苦万分，最终只能在宝塔的编辑器中完成...这时我不禁琢磨，是否能搭建这么一套基于WEB的开发全家桶，让开发者能够随时随地用浏览器就能进行开发呢？说干就干！
正文
既然要搭建这么一套全家桶，那么需要准备以下物品：
- VPS服务器一台
- 域名一个（如果你直接记IP也没问题）
首先是VPS服务器，正如我们的标题一般，轻量折腾计划，故而我们这里选择的服务器是腾讯云的轻量应用服务器Lighthouse。腾讯云的轻量服务器因其活动多、优惠大、性价比高而广泛闻名于国内的中小站长群体之间，虽然没有弹性网卡等一些CVM的功能，但其近期上线了VPC内网互联也同样补齐了很大一块短板。对于我们这些需求不大的小站长的需求可以说是基本上覆盖全的了，而且还不限制CPU，一核比某些灵车的四核还强。
image-20210815185421450而且还长期打活动中（https://cloud.tencent.com/act/new），99/1年，这价位算是性价比之王了吧，有兴趣的同学可别错过了哟。
零、基础准备
既然是全家桶，那么肯定是需要安装多款应用的，而且苦于口袋里的钱包厚度，那肯定是要一台机子就干全部活儿啦。那么就需要安装如下环境：
- 宝塔面板（方便管理，如果你是大佬也可以无视）
- Nginx（主要用于做反代，如果是国内机子 没备案的域名可以不用反代，直接解析IP后加上端口就行）
- Docker（快速安装某些应用）
（0）宝塔面板
关于宝塔面板的安装可以说是非常简单的，根据官网的这个帖子：https://www.bt.cn/bbs/thread-19376-1-1.html
Centos安装命令：
代码语言：txt复制yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.shUbuntu/Deepin安装命令：
代码语言：txt复制wget -O install.sh http://download.bt.cn/install/install-ubuntu_6.0.sh && sudo bash install.shDebian安装命令：
代码语言：txt复制wget -O install.sh http://download.bt.cn/install/install-ubuntu_6.0.sh && bash install.shFedora安装命令:
代码语言：txt复制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后回车，等待一会儿就成功安装好了：
==================================================================
Congratulations! Installed successfully!
==================================================================
外网面板地址: http://xxx.xxx.xxx.xxx:8888/6e21e07d
内网面板地址: http://10.0.8.17:8888/6e21e07d
username: gunftd4a
password: f92c3dd4
If you cannot access the panel,
release the following panel port [8888] in the security group
若无法访问面板，请检查防火墙/安全组是否有放行面板[8888]端口
==================================================================
Time consumed: 0 Minute!
[root@VM-8-17-centos ~]# 我们打开浏览器，访问上边的外网面板地址（轻量用户记得去防火墙添加8888端口），填入随机生成的用户名和密码，并同意用户协议后进入面板。进入面板后第一件事就是修改面板设置，将默认的8888端口进行修改（注意防火墙/安全组提前放行），用户名、密码、与安全入口进行修改、开启BasicAuth认证（推荐），到这我们的宝塔面板算是安装好了。
（1）Nginx
在上一步中我们安装了宝塔面板，那么在这一步中就特别简单了，直接在宝塔面板的左侧栏点击软件商店，找到Nginx之后点击安装即可：
image-20210815193313309点击确定后等待一会儿就安装好了：
image-20210815193729477（2）Docker
Docker是一种容器化技术，可以利用容器快速的搭建起我们想要的环境/应用，类似于虚拟机，但是相比较于虚拟机来说要轻量许多。
关于Docker的安装我们可以直接使用官方提供的一键安装脚本来进行，安装命令如下：
代码语言：txt复制curl -fsSL https://get.docker.com | bash -s docker --mirror Aliyun也可以使用国内 daocloud 一键安装命令：
代码语言：txt复制curl -sSL https://get.daocloud.io/docker | sh两条命令，任意选择一个都可以，复制后到服务器终端粘贴后回车运行，等待一会儿后安装成功。
docker安装成功之后，执行以下命令启动docker：
代码语言：txt复制service docker start启动好docker后，尝试运行：docker ps，看看是否有无报错产生。
最后，我们来修改docker的镜像源，保证能够成功地拉取docker镜像；编辑文件/etc/docker/daemon.json（若不存在则可以新建一个），内容如下：
代码语言：txt复制{
"registry-mirrors": [
"https://hub-mirror.c.163.com",
"https://mirror.baidubce.com"
]
}如果读者用的也是轻量服务器的话，可以使用腾讯内网的加速源：mirror.ccs.tencentyun.com。
编辑好文件并保存后，输入命令：service docker restart让docker重启以载入配置文件，重启完成后输入docker info查看是否设置成功：
Registry Mirrors:
https://mirror.ccs.tencentyun.com/
Live Restore Enabled: false
[root@VM-8-17-centos ~]# 至此，我们的一些列准备过程结束。
一、在线IDE
既然是要编程，那么肯定离不开IDE呀，这年头，不会真有人用记事本编程吧。
经过一段时间的查找，我们打算使用vscode官方出的WEB班vscode：https://github.com/cdr/code-server，从外观上来看，可谓是跟桌面版vscode别无二致。
接下来是code-server的安装，首先我们新建一个配置项目录：
代码语言：txt复制mkdir ~/.config && mkdir /project接着直接使用docker进行安装：
代码语言：txt复制docker run -itd --name code-server -p 127.0.0.1:8080:8080
-v "$HOME/.config:/home/coder/.config"
-v "/project:/home/coder/project"
-u "$(id -u):$(id -g)"
-e "DOCKER_USER=$USER"
codercom/code-server:latest可以看到，我们将容器内的8080端口映射到本地的8080端口（若是直接使用端口的朋友可以把此处的127.0.0.1改为0.0.0.0），并且我们把新建的两个目录给挂载到了容器内，这样一来我们可以直接在容器内修改容器外部的文件。
使用命令docker ps可以看到我们的容器在运行当中：
[root@VM-8-17-centos ~]# docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
51fb2363150e codercom/code-server:latest "/usr/bin/entrypoint…" 45 seconds ago Up 44 seconds 127.0.0.1:8080->8080/tcp code-server
[root@VM-8-17-centos ~]# 然后就是反向代理，将我们的域名（此处使用test.com做演示之用）跟容器的环境结合在一起。
在宝塔添加一个网站（ide.test.com）：
image-20210815202500007添加好后点击设置，添加反向代理：
image-20210815202718092由于需要用到websocket，故而我们还需要修改配置文件，添加如下配置项：
代码语言：txt复制 proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection upgrade;
image-20210815204515678打开浏览器，输入我们的网站：ide.test.com
image-20210815202926044输入cat ~/.config/code-server/config.yaml查看随机生成的密码：
[root@VM-8-17-centos ~]# cat ~/.config/code-server/config.yaml
bind-addr: 127.0.0.1:8080
auth: password
password: 352e558396b4688211258ebd
cert: false
[root@VM-8-17-centos ~]#输入密码进入即可，若想要修改密码，可直接修改此文件中的密码，再重启容器即可。
image-20210815204818984二、GIT平台
既然我们有了自己的IDE，那干脆在给直接整个git平台作为我们平常项目的记录库岂不美哉。说干就干，因为我们是要多个应用共同搭建在同一台服务器上，故而此处我们不选择gitlab（有点吃配置），而是选择相对精简的gogs（https://github.com/gogs/gogs）。
同样也是用docker部署，在这种多应用同时部署的环境中，不同应用直接使用不同的容器做隔离，互不影响，减少了直接的干扰，可以说是优势巨大了。
首先新建一个目录做为挂载点，让容器内的数据与外部数据互通：
代码语言：txt复制midir /gogs接着运行命令：
代码语言：txt复制docker run -p 3022:22 -p 3000:3000 --name=gogs
-v /gogs:/data
-d gogs/gogs使用命令docker ps查看部署情况：
[root@VM-8-17-centos ~]# docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
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，故而也不需要编辑配置文件的操作了。
反代好之后访问我们的域名：
image-20210815223506425这里为了方便，我们直接选择使用sqlite作为数据库。
image-20210815223724298应用基本设置内，除了应用URL我们修改为：http://git.test.com之外，其他保持默认即可：
image-20210815223829494可选设置中设置上管理员：
image-20210815224019698点击立即安装后，GIT平台搭建完毕：
image-20210815224147038来看下我们的资源占用情况（2核4G内存）：
image-20210815224658414可以看到，4G的内存目前占用不足1G，可以说是相当的精简了，小主机也能轻松跑起来，这使得我们为后续应用的安装腾出了许多的空间。
后话
现在，我们已经拥有了自己的在线IDE，也有了自己的GIT平台，已经可以完成日常中大部分开发常需要的功能了，不过这还不够，由于篇幅所限，在下篇文章中，我将继续带大家完善我们的开发者全家桶套餐，将我们的浏览器编程板块继续补充完整~
