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

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

image.png

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

  • 做为开发,最惧怕遇到版本发布,特别是前、后端一块儿上线发布,项目又特别多的时候
  • 例如你有10个项目,先后端都要同时发布,那么就须要屡次合并代码、构建,重复不少动做..并且还要去关心构建机器环境是否是变了?配置是否能扛住同时构建多个应用,人为的操做次数多了,就很难保证万无一失
  • 那这种局面怎么破? 是否是要考虑从技术角度来提效? 假如我把全部的构建、发布都迁移到云端,能够一键push代码,而后自动完成构建,我只要执行一个命令就能够完成部署,又不须要关心机器配置和环境变化,那咱们的工做效率是否是能够大大提高?

我以前的构建发布流程

  • 以前我是使用Travis CIgitHub以及docker-compose结合进行一键代码push构建发布
  • 可是有一个很明显的问题,gitHubTravis这两个平台是彻底独立的,特别是我代码托管在gitHub上,有时候访问速度还很慢,更要命的是没有在一个平台上造成完整的链路闭环
  • 因而我找了不少个平台,最终发现,华为云能够知足个人需求,既能够代码托管,也有可配置的自动化构建流程,并且访问速度快,纯中文界面友好

新建项目 & 迁移到华为云

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

    image.png

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

    image.png

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

`npm run install-all
npm run dev
`前端

  • 新建项目时候,咱们能够选择上面这种模式快速根据模版生成代码,可是我今天是要把个人代码从gitHub迁移到华为云上托管,而后在华为云上完成整个开发流程的闭环

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

image.png

  • 进入华为云devcloud模块,输入想要导入的gitHub仓库地址和帐号密码(若是须要),而后开始导入,大约耗时30S
  • 此时,在本地生成git ssh,将公钥放置到华为云上

    image.png

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

    image.png

  • 在本地使用如下命令便可完成clone和启动

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

`git

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

改变个人构建策略

  • 我以前是基于gitHubTravis CIdocker-compose完成一键push代码,而后一键完成发布,如今要在华为云上实现一套自动化构建流程

构建策略适配难度极低,远超个人想象

  • 个人项目是一个前端基于React,后端基于Node.jsexpress框架,跟华为云的devstar的模板很是像
  • 如何设计这个任务流?

编写任务流

  • 基于项目,新建编译构建任务

    image.png

  • 编写任务流任务流,所谓任务流,就是完成一个,而后接着下一个,华为云这里比较贴心,根据不一样的环境进行了区分环境,不像传统的服务器,你还要去装docker、node.js等等这些(PS:任务新建后能够修改任务~)

image.png

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

如何编写任务流?

  • 以个人一个资料网站项目为例子,基于docker-compose发布,先后端都打包在一个镜像中
  • 首先代码push后,构建任务不必定须要立刻执行,并且个人推送次数可能很频繁,此时我能够调成定时任务,还能限制次数(真的很贴心)
  • image.png

编写dockerfile

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

`#引用镜像
FROM node:12.16.3redis

执行命令,建立文件夹

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

配置环境变量

 ENV HOST 0.0.0.0
 ENV PORT 8080express

定义程序默认端口

EXPOSE 8080npm

运行程序命令

CMD ["node","./server/index.js"]
`后端

  • 此时能够想象,咱们推送代码后(能够选择什么分支),根据配置定时自动构建,而后能够经过接口或者手动借助docker-compose命令进行一键更新发布
  • image.png
  • 简单三个命令,完成docker-image的制做和push(具体参数能够参考提示)
  • image.png
  • 首先登录docker,而后build打包镜像,最后push便可完成构建这一步,咱们本地彻底是无感知的~也不须要考虑配置和环境的问题
  • 此时咱们手动触发构建任务(像咱们公司项目特别大,一台4核8G的机器可能就扛不住几个项目同时构建,在这里就不用担忧)
  • image.png
  • 等待一段时间后,发现命令执行完成,docker镜像已经发布完成
  • image.png

发布

  • 两种手段
  • 经过ssh链接华为云服务器,执行编写好的docker-compose文件
  • 经过接口带token方式(有权限的人才能够发布)调用,执行docker-compose命令,达到发布目的
  • 咱们重点关注第一种,经过ssh链接到华为云鲲鹏服务器
  • `image.png
    `
  • 输入用户和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 pullapp

  • 拉取完成后,运行docker-compose

docker-compose up -d

  • 启动成功,输入域名,便可访问到个人网站了,完成这个迁移和整套开发构建流程的闭环,仅仅用了1个小时不到

image.png

感觉

  • 华为云从开发者角度出来,项目模板一键生成,定时构建任务,任务流的定制化处理这些,很是人性化,大大下降了开发运维门槛,造成整套研发构建流程的闭环
  • 我司也正在准备购买迁移华为云产品,全部托管、构建发布都放在云端完成闭环
  • 相信你经过这篇文章,也能够快速的将你的代码托管、构建发布快速迁移到华为云鲲鹏服务器
相关文章
相关标签/搜索