How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

Time:2021-5-12

How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

Build deployment, has been a very cumbersome process
  • As a developer, I’m most afraid to encounter version release, especially when the front and back end are released together and there are many projects
  • For example, you have10If you want to publish a project at the same time, you need to merge code, build, and repeat a lot of actions. Besides, you need to care about whether the build machine environment has changed? If the configuration can support the construction of multiple applications at the same time, the number of manual operations is too many, so it is difficult to guarantee the safety
  • How can this situation be broken? Should we consider improving efficiency from a technical point of view? If I move all my builds and releases to the cloud, I can do it with one clickpushCode, and then automatically complete the build, I just need to execute a command to complete the deployment, and do not need to care about machine configuration and environmental changes, then our work efficiency can be greatly improved?
My previous build release process
  • I used to useTravis CIandgitHubas well asdocker-composeCombined with one key codepushBuild release
  • But there is an obvious problem,gitHubandTravisThese two platforms are completely independent, especially when my code is hosted ingitHubOn the other hand, sometimes the access speed is still very slow. What’s more, a complete link closed loop is not formed on a platform
  • So I looked for a lot of platforms and finally found that,Hua WeiyunIt can meet my needs, not only code hosting, but also configurable automatic construction process, and the access speed is fast, and the pure Chinese interface is friendly

New project & move to huaweiyun

  • Like our front end andNode.jsThere are some scaffolding, for exampleReactIn this framework, there are a lot of scaffolds that can generate project templates with one click, so that you don’t care about the problem of engineering configuration. Huawei clouddeveloperThe module also provides this function

    How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

  • Choose the template you want, like the one I choseReact+expressThe template will be generated in about 10 seconds. At this time, you can see it in my template products

    How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

  • At this point, download the compressed package, unzip and run the following command to start the development

`npm run install-all
npm run dev
`

  • When creating a new project, we can choose the above mode to quickly generate code according to the template, but I’m going to remove my code from the template todaygitHubMigrate to Huawei cloud for hosting, and then complete the closed loop of the whole development process on Huawei cloud
Will IgitHubImport warehouse code into Huawei cloud hosting

How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

  • Enter Huawei clouddevcloudModule, enter the module you want to importgitHubWarehouse address and account password (if necessary), and then start to import, about time consuming30S
  • At this point, it is generated locallygit sshAnd put the public key on Huawei cloud

    How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

  • At this time, we can click the code warehouse and go in to see the details of the warehouse(Pure Chinese interface, really friendly)

    How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

  • This can be done locally by using the following commandcloneAnd start up

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

`

  • The above code migration has been completed. At present, our code has been managed toHua WeiyunIn order to complete the closed loop of the whole R & D process, we need to migrate the build and release toHuawei cloud Kunpeng serverupper
Change my build strategy
  • I was based ongitHubandTravis CIanddocker-composeOne click FinishpushCode, and then a key to complete the release, now in theHua WeiyunRealize a set of automatic construction process on the platform
The difficulty of building strategy adaptation is very low, far beyond my imagination
  • My project is a front end based onReact, back end based onNode.jsOfexpressFramework, similar to Huawei clouddevstarThe template is very similar
  • How to design the task flow?
Write task flow
  • Create a new compile build task based on the project

    How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

  • Write task flow task flow, the so-called task flow, is to complete one, and then the next, Huawei cloud here is more intimate, according to the different environment to distinguish the environment, unlike the traditional server, you have to installdocker、node.jsWait for this(PS:After a task is created, it can be modified

How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click

  • Here, Huawei’s image source warehouse is used by default to solve the problem of slow download caused by environment configuration~
How to write task flow?
  • Take a data website project of mine as an example, based ondocker-composeThe front and back ends are packaged in one image
  • First, codepushAfter that, the build task doesn’t need to be executed immediately, and my push times may be very frequent. At this time, I can set it to a scheduled task and limit the number of times (it’s really sweet)
  • How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click
Write dockerfile
  • Write it firstdockerfileFiles fordocker, based onNode.js 12.16.3Version of the image, specify the port

`#Reference image
FROM node:12.16.3

Execute the command to create a folder

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

Configure environment variables

 ENV HOST 0.0.0.0
 ENV PORT 8080

Define program default port

EXPOSE 8080

Run program command

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

  • At this point, you can imagine that after we push the code(What branch can I choose)According to the configuration, it can be built automatically, and then it can be built through the interface or manuallydocker-composeCommand for one click Update release
  • How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click
  • Three simple commands, completedocker-imageProduction and application ofpush(please refer to the prompt for specific parameters)
  • How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click
  • touchdowndocker, and thenbuildPackaging image, finallypushTo complete the construction step, we are not aware of the local ~ also do not need to consider the configuration and environment
  • At this point, we manually trigger the build task (for example, our company’s project is particularly large, one computer)4-core 8gYou may not be able to build several projects at the same time, so don’t worry about it here.)
  • How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click
  • After waiting for a period of time, it is found that the command execution is completed,dockerThe image has been published
  • How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click
release
  • Two methods
  • adoptsshConnect to Huawei’s cloud server and execute the writtendocker-composefile
  • Through the interface bandtokenMethod (authorized personnel can publish) call, executedocker-composeCommand to achieve the purpose of release
  • We focus on the first, through thesshconnection toHuawei cloud Kunpeng server
  • `How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click
    `
  • Enter user andipAfter the address,sshConnection successful, writedocker-composefile

`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
`

  • Execute the command and pull the image

    docker-compose pull

  • After the pull is completed, rundocker-compose

docker-compose up -d

  • Start successfully, enter the domain name, you can visit my website, complete the migration and the whole development and construction process of the closed loop, only took less than 1 hour
How to use Huawei cloud service to build deployment and publishing front end and node.js service with one click
feel
  • Huawei cloud comes out from the developer’s point of view. The project template is generated with one click, the task is built regularly, and the task flow is customized. It is very humanized, which greatly reduces the threshold of development and operation, and forms a closed loop of the whole R & D and construction process
  • Our company is also preparing to purchase and migrate Huawei cloud products, and all hosting, construction and release are completed in the cloud
  • I believe that through this article, you can quickly migrate your code hosting, build publishing toHuawei cloud Kunpeng serverupper

Recommended Today

Looking for frustration 1.0

I believe you have a basic understanding of trust in yesterday’s article. Today we will give a complete introduction to trust. Why choose rust It’s a language that gives everyone the ability to build reliable and efficient software. You can’t write unsafe code here (unsafe block is not in the scope of discussion). Most of […]