How to automatically deploy front-end gitlab projects to k8s

This article mainly introduces how to automatically deploy front-end projects into a Kubernetes-based container environment. Here we use GitLab CI/CD to complete this process. GitLab serves as a platform for code management, version control and collaboration, and Kubernetes serves as a tool for container orchestration and deployment, which can make the front-end development process more efficient and convenient.

1. GitLab Configuration

First create a project on GitLab and associate it with the Git repository. Then, turn on the CI/CD function in the project settings and select the Runner you want to use. Here we will install GitLab Runner and register it in GitLab's Runner list.

2. GitLab Runner Installation and Configuration

The process of installing GitLab Runner is relatively simple. You only need to follow the installation guides of different systems and platforms.

After the installation is complete, we need to configure GitLab Runner. Assuming you already have a Kubernetes cluster, we need to configure GitLab Runner to run on the cluster. The specific configuration process is as follows:

① First, we need to configure a Kubernetes Service Account for the Runner. The Service Account needs to be authorized to access the Kubernetes API in the cluster.

② Subsequently, we need to configure this Runner to use the Service Account to access the API. To do this, we need to set the following fields in the Runner's configuration file (config.toml):

[[runners.kubernetes.volumes.host_path]]
      name = "docker"
      mount_path = "/var/run/docker.sock"
      host_path = "/var/run/docker.sock"
    [[runners.kubernetes.volumes.config_map]]
      name = "kube-config"
      mount_path = "/etc/kubernetes"
    [[runners.kubernetes.volumes.empty_dir]]
      name = "tls"
      mount_path = "/etc/gitlab-runner/certs"
    [[runners.kubernetes.volumes.secret]]
      name = "runner-secret"
      mount_path = "/etc/gitlab-runner"

Among them, kube-config is the name of the config map related to the Runner, runner-secret is the name of the secret related to Runner.

③ Finally, we need to update and restart GitLab Runner so that it can use containers running in Kubernetes. Run the following command to automatically restart GitLab Runner:

sudo gitlab-runner restart

3. realize automated deployment

After obtaining a configured Runner, we can start to implement automated deployment. Here we use a file named .gitlab-ci.yml to define our CI/CD process.

First, we need to define a Dockerfile to use when running containers in Kubernetes. This Dockerfile will be used when building the Docker image, as shown below:

FROM nginx:1.15.8-alpine

COPY dist /usr/share/nginx/html

COPY nginx/default.conf /etc/nginx/conf.d/

The image will be nginx:1.15.8-alpine as the base image, copy our front-end files to Nginx Default directory and replace the default Nginx configuration file so that our application can run normally.

Subsequently, define our CI/CD process in the .gitlab-ci.yml file. Specifically, we will declare the project's build process in this file, then push the built Docker image to the container image library, and finally run this image in Kubernetes. The process is as follows:

stages:
  - build
  - release

build:
  stage: build
  script:
    - docker build -t registry.cn-hangzhou.aliyuncs.com/$CI_PROJECT_NAMESPACE/$CI_PROJECT_NAME:$CI_COMMIT_TAG .
    - docker login -u $DOCKER_USERNAME -p $DOCKER_PASSWORD registry.cn-hangzhou.aliyuncs.com
    - docker push registry.cn-hangzhou.aliyuncs.com/$CI_PROJECT_NAMESPACE/$CI_PROJECT_NAME:$CI_COMMIT_TAG
  only:
    - /^v\d+\.\d+(\.\d+)?(-\S*)?$/

release:
  stage: release
  script:
    - kubectl apply -f k8s/
  only:
    - /^v\d+\.\d+(\.\d+)?(-\S*)?$/

In this file, we first declare that our process has two stages: build and release, and in build## The process of building and pushing to the container image library is completed in the # stage, and the Kubernetes deployment process is completed in the release stage. Note that here we only enable the CI/CD process for Git commits whose tags are version numbers.

Application deployment

Finally, deploy our application in our Kubernetes. We will use a file called

deployment.yml to complete the deployment. This file declares a Deployment object for running front-end applications in Kubernetes.

apiVersion: apps/v1
kind: Deployment
metadata:
  name: frontend-deployment
spec:
  replicas: 1 # 运行一个副本
  selector:
    matchLabels:
      app: frontend
  template:
    metadata:
      labels:
        app: frontend
    spec:
      containers:
        - name: frontend
          image: registry.cn-hangzhou.aliyuncs.com/wbbry/frontend:latest # 镜像名称
          imagePullPolicy: Always
          ports:
            - containerPort: 80 # 前端端口

This file specifies the

replicas number of the Deployment object (here is 1), and declares the name and port number of the container image. After completing this deployment file, we can use the Kubernetes command line tool (kubectl) to create the Deployment object:

kubectl apply -f deployment.yml

At this point, our front-end application should be able to run successfully on Kubernetes.

Conclusion

This article introduces how to automatically deploy front-end projects into a Kubernetes-based container environment. It focuses on the use of GitLab CI/CD, Kubernetes and Docker, and demonstrates the deployment process through a complete DEMO. I hope this article is helpful to front-end development engineers.

The above is the detailed content of How to automatically deploy front-end gitlab projects to k8s. For more information, please follow other related articles on the PHP Chinese website!