简单说下技术，前端vue打包的dist直接扔到服务器(此文应用nginx)里，后端node（此文应用了express）造好接口并且开启服务，nginx配置下接口转发即可。当然也要启一个mysql数据库（我还特意看了一天的mysql，无奈）。简单实现前端输入内容，调接口，存数据库这么一个流程。由于本人较穷，买不起服务器，故用了vmvare+ubuntu耍耍
整体技术：docker、vue、express+sequelize、mysql
Docker 是一个开源的应用容器引擎,可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中，然后发布到任何流行的 Linux 机器上，也可以实现虚拟化。容器是完全使用沙箱机制，相互之间不会有任何接口。（简单点，就比如你去一个商场，商场里有很多专卖店，小吃店，化妆品店，这些店就好比容器，你根据自己的需求去哪个店就好，而且这些店本质上互不干扰对方做生意）
vue我就不介绍了，这玩意都写的我想吐了。
node呢，现在是很多中高级前端常备的一个技能了，毕竟没那么多精力学java和世界上最好的语言php了。简单的说就是运行在服务端的 JavaScript，基于V8引擎，速度非常快，性能非常好。前端一般用的比较多的是它的服务端框架express/koa。vue-cli我记得就是用了express启的服务。
首先肯定在ubuntu里安装docker（自行度娘官网）
镜像
镜像仓库官网：hub.docker.com/
镜像是 Docker 运行容器的前提，仓库是存放镜像的场所，可见镜像更是Docker的核心。简单理解Docker 镜像可以看作是一个特殊的文件系统，提供容器运行时所需的程序、库、资源、配置等文件（运行环境）。
方便理解我们来搞下mysql。
docker search mysql ：在仓库里搜下mysql镜像
此时看到mysql版本为官方，大可安心下载，然后docker pull mysql:latest来拉取最新版本镜像。当然我这边下载的是5.6版本。docker pull mysql:5.6成功后，docker images来查看所有已装镜像，即可看到mysql:5.6镜像已安装ok
容器
容器是基于镜像运行的一个软件单元。它将代码及其所有依赖关系打包，以便应用程序从一个计算环境可靠快速地运行到另一个计算环境。是一个轻量的独立的可执行的软件包。容器将软件与其环境隔离开来，并确保它可以统一运行。一台机器上可运行多个容器。
以mysql镜像运行一个容器：
docker ps：查询处于运行状态的容器
此时我们可以用mysql客户端连接看下：
当然先得看下你linux的ip：可以看到此时ip为10.0.0.178（vm网络连接方式采用了桥接）。
此时mysql客户端配置连接测试：
ok，说明你已经离成功不远了
也就是我们的前端啦，页面很简单，就造了一个接口。
项目github地址：github.com/qianduanwuz…
然后打包一下npm run build生成dist。前面说到前端资源要放到服务器nginx里。
所以我们这继续开搞：
docker search nginx 仓库里为官方最新版本
docker pull nginx:latest 安装
docker images看下nginx镜像是否安装成功
然后我们运行下nginx容器看下浏览器是否能正常访问nginx服务：
运行完后看10.0.0.178:8080能访问说明ok
此时我们可以进入这个容器来看一些配置及操作
docker ps查看下容器nginx-test
此时我们可看见nginx的配置/usr/share/nginx/html/index.html，那我们把前端dist直接放进就ok，但此时我们来用Dockerfile来定制下镜像。
什么是 Dockerfile？
Dockerfile 是一个用来构建镜像的文本文件，文本内容包含了一条条构建镜像所需的指令和说明。
此时可以在vmvare创建Dockerfile文件夹，并且touch一个Dockerfile。命令如下：
然后在/Dockerfile/创建web文件夹，在/Dockerfile/web/创建front文件夹，然后把前端dist拖到/Dockerfile/web/front/。可参照下面看是否文件目录正确
好，我们来开搞Dockerfile，切到/Dockerfile/目录下 vim Dockerfile编辑
FROM：定制的镜像都是基于 FROM 的镜像，这里的 nginx 就是定制需要的基础镜像。后续的操作都是基于 nginx。
COPY：复制指令，从上下文目录中复制文件或者目录到容器里指定路径。
前面我们看过nginx容器里静态文件的目录为/usr/share/nginx/html/，所以故dist复制到此即可。
开始构建镜像
构建完后docker images可看到web-front:latest镜像
运行容器
docker ps 查看容器web-front-1
进入容器
/usr/sbin/nginx开启nginx服务
访问10.0.0.178:2222
ok，阔以访问前端服务了，你基本接近成功了。
准备造接口啦。express+sequelize（orm）
项目github地址：github.com/qianduanwuz…
贴部分核心代码
连接数据库：
建模：
接口：
server.js:
后面node容器node server.js即可启动服务
部署node准备工作
在/Dockerfile/web/下创建node文件夹，然后把node项目文件放到/Dockerfile/web/node/里，当然也需要/Dockerfile/web/node/创建个Dockerfile来做node的定制镜像（暂不使用docker compose）。
编辑Dockerfile
开始构建镜像
docker build -t web-node:beta . //一定注意末尾加上 .
beta其实就是web-node的tag
运行容器
docker ps 查看容器web-node-beta
此时可用postman来跑下接口
ps：数据库里你得预先建张表u_users(sequelize建模时会自动找这张表，没有使用sync来强制建表)
哇！很激动有木有。前后端现在都能访问了，那前端接口跨域怎么办？没事，还记得web-front-1容器吗，对，没错，只要修改容器里nginx里的配置即可。来，我们操作下：
docker exec -it f6d33f03653f bash 进入web-front-1容器，然后我们发现conf配置文件目录为：/etc/nginx/conf.d/default.conf，那我们直接编辑配置即可
保存退出，此时我们需要重启下nginx。可以nginx -s reload 或者 nginx -s stop然后 /usr/sbin/nginx 即可。然后我们可以模拟下前端输入内容，调接口，存数据库这么一个流程。
前端输入内容
调接口
请求成功
数据库发现有这数据了