乐趣区

关于javascript:如何使用华为云服务一键构建部署发布前端和Nodejs服务

jiezi

如何应用华为云服务一键构建部署公布前端和 Node.js 服务

构建部署, 始终是一个很繁琐的过程

  • 作为开发, 最胆怯遇到版本公布, 特地是前、后端一起上线公布, 我的项目又特地多的时候
  • 例如你有 10 个我的项目, 前后端都要同时公布, 那么就须要屡次合并代码、构建, 反复很多动作.. 而且还要去关怀构建机器环境是不是变了? 配置是否能扛住同时构建多个利用, 人为的操作次数多了, 就很难保障十拿九稳
  • 那这种场面怎么破? 是不是要思考从技术角度来提效? 如果我把所有的构建、公布都迁徙到云端, 能够一键 push 代码, 而后主动实现构建, 我只有执行一个命令就能够实现部署, 又不须要关怀机器配置和环境变动, 那咱们的工作效率是不是能够大大晋升?

我之前的构建公布流程

  • 之前我是应用 Travis CI 和gitHub以及 docker-compose 联合进行一键代码 push 构建公布
  • 然而有一个很显著的问题,gitHub和 Travis 这两个平台是齐全独立的, 特地是我代码托管在 gitHub 上，有时候访问速度还很慢, 更要命的是没有在一个平台上造成残缺的链路闭环
  • 于是我找了很多个平台，最终发现，华为云 能够满足我的需要, 既能够代码托管, 也有可配置的自动化构建流程, 而且访问速度快, 纯中文界面敌对

新建我的项目 & 迁徙到华为云

  • 像咱们前端和 Node.js 都是有一些脚手架，例如 React 这种框架, 就有很多脚手架能够一键生成我的项目模板, 让你不再关怀工程化配置的问题, 华为云的 developer 模块也提供了这个性能

  • 抉择想要的模板, 像我抉择的是 React+express 模板,10 秒钟左右就生成好了, 此时就能够在我的模板产物中看

  • 此时下载压缩包, 解压运行以下命令即可开始开发

`npm run install-all
npm run dev
`

  • 新建我的项目时候, 咱们能够抉择下面这种模式疾速依据模版生成代码, 然而我明天是要把我的代码从 gitHub 迁徙到华为云上托管, 而后在华为云上实现整个开发流程的闭环

将我 gitHub 仓库代码导入到华为云托管

  • 进入华为云 devcloud 模块, 输出想要导入的 gitHub 仓库地址和账号密码（如果须要）, 而后开始导入, 大概耗时30S
  • 此时, 在本地生成git ssh, 将公钥搁置到华为云上

  • 咱们此时能够点击代码仓库, 进去就能够看到仓库详情了 ( 纯中文界面, 真的敌对)

  • 在本地应用以下命令即可实现 clone 和启动

`git clone remoteurl
cd your projectName
npm install
npm run dev

`

  • 以上实现了代码迁徙, 目前咱们代码曾经托管到 华为云 上, 为了实现整套研发环节的闭环, 咱们须要将构建、公布都迁徙到 华为云鲲鹏服务器 上

扭转我的构建策略

  • 我之前是基于 gitHub 和Travis CI和 docker-compose 实现一键 push 代码, 而后一键实现公布, 当初要在 华为云 上实现一套自动化构建流程

构建策略适配难度极低, 远超我的设想

  • 我的我的项目是一个前端基于 React, 后端基于Node.js 的express框架, 跟华为云的 devstar 的模板十分像
  • 如何设计这个工作流?

编写工作流

  • 基于我的项目, 新建编译构建工作

  • 编写工作流工作流, 所谓工作流, 就是实现一个, 而后接着下一个, 华为云这里比拟贴心, 依据不同的环境进行了辨别环境, 不像传统的服务器, 你还要去装 docker、node.js 等等这些 (PS: 工作新建后能够批改工作～)

  • 这里默认应用了华为的镜像源仓库, 解决了因为环境配置问题导致下载慢的问题~

如何编写工作流?

  • 以我的一个材料网站我的项目为例子, 基于 docker-compose 公布, 前后端都打包在一个镜像中
  • 首先代码 push 后, 构建工作不肯定须要马上执行, 而且我的推送次数可能很频繁, 此时我能够调成定时工作, 还能限度次数(真的很贴心)

编写 dockerfile

  • 此时先编写 dockerfile 文件, 用于 docker, 基于Node.js 12.16.3 版本的镜像, 指定端口

`# 援用镜像
FROM node:12.16.3

执行命令，创立文件夹

RUN mkdir -p /usr/www
WORKDIR /usr/www
COPY . /usr/www
RUN npm run build

配置环境变量

 ENV HOST 0.0.0.0
 ENV PORT 8080

定义程序默认端口

EXPOSE 8080

运行程序命令

CMD [“node”,”./server/index.js”]
`

  • 此时能够设想, 咱们推送代码后 ( 能够抉择什么分支 ), 依据配置定时主动构建, 而后能够通过接口或者手动借助docker-compose 命令进行一键更新公布
  • 简略三个命令, 实现 docker-image 的制作和push（具体参数能够参考提醒）
  • 首先登陆 docker, 而后build 打包镜像, 最初 push 即可实现构建这一步, 咱们本地齐全是无感知的~ 也不须要思考配置和环境的问题
  • 此时咱们手动触发构建工作（像咱们公司我的项目特地大，一台 4 核 8G 的机器可能就扛不住几个我的项目同时构建，在这里就不必放心）
  • 期待一段时间后, 发现命令执行实现,docker镜像曾经公布实现

公布

  • 两种伎俩
  • 通过 ssh 连贯华为云服务器, 执行编写好的 docker-compose 文件
  • 通过接口带 token 形式 (有权限的人才能够公布) 调用, 执行 docker-compose 命令, 达到公布目标
  • 咱们重点关注第一种, 通过 ssh 连贯到 华为云鲲鹏服务器
  • `
    `
  • 输出用户和 ip 地址后,ssh连贯胜利, 编写 docker-compose 文件

`version: “3.7”
services:
    redis:
        image: redis:3
        container_name: redis
        hostname: redis
        command: redis-server /usr/local/etc/redis/redis.conf –requirepass huaweiapp666
        volumes:
          – ./redis/redis.conf:/usr/local/etc/redis/redis.conf
        ports:
          – “6379:6379”
    huaweiapp:
        image: jinjietan/huaweiapp:latest
        ports:
            – “8080:8080”
        restart: on-failure
`

  • 执行命令，拉取镜像

    docker-compose pull

  • 拉取实现后, 运行docker-compose

docker-compose up -d

  • 启动胜利, 输出域名, 即可拜访到我的网站了, 实现这个迁徙和整套开发构建流程的闭环, 仅仅用了 1 个小时不到

感触

  • 华为云从开发者角度进去, 我的项目模板一键生成, 定时构建工作, 工作流的定制化解决这些, 十分人性化, 大大降低了开发运维门槛, 造成整套研发构建流程的闭环
  • 我司也正在筹备购买迁徙华为云产品，所有托管、构建公布都放在云端实现闭环
  • 置信你通过这篇文章，也能够疾速的将你的代码托管、构建公布疾速迁徙到 华为云鲲鹏服务器 上
退出移动版