Skip to content

GitLab CI/CD template with GitLab-Runner to deploy a Vue.js project in a docker container on a VPS

Notifications You must be signed in to change notification settings

theechofive/GitLab-CICD-Docker-VueJS

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

GitLab CI/CD Docker Vue 3

GitLab CI/CD template with GitLab-Runner for deploying a project in a docker container to a VPS using.

When using artifacts, you can download the archive of any stage in the list of pipelines.

For example, the deployment was made to two VPS, one for development, the second for production.

Add files from this repository to your project root directory

Example for Vue

|_src
  |_assets
  |_components
  |_...
|_public
    |_favicon.ico
|_index.html
|_package.json
|_.env
|_docker-compose.yml
|_.gitlab-ci.yml
|_Dockerfile

Gitlab CI/CD Variables

To run container with your project docker-compose.yml uses variables from .env, add these lines to your variables (.env)

### DOCKER ENV ###
CONTAINER_NAME = app_name
CONTAINER_PORT = 3001
### DOCKER ENV ###
%your env strings%
  • nginx - type: File

Paste nginx.conf from repository for nginx

  • ENV_DEV - type: File

Paste your .env for develop and add strings for docker

  • ENV_PROD - type: File

Paste your .env for production and add strings for docker

Deploy to DEVELOP VPS

  • Deploy from - branch develop
  • Runner with tag - develop

Deploy to PRODUCTION VPS

  • Runner with tag - production
  • Deploy from - tag v.X.X.Xnn
Examples tags
  • v.1.0.1
  • v.1.0.1test
  • v.1.0.11
  • v.1.0.111

Settings

Install stage

  • image - Docker image for your project from https://hub.docker.com/
  • script - Command for install packges
  • expire_in - Specify how long job artifacts are stored before they expire and are deleted
  • paths - The paths are relative to the project directory of the files\directories that are saved to the artifact

Test Stage

  • image - Docker image for your project from https://hub.docker.com/
  • script - Command for start unit test
  • expire_in - Specify how long job artifacts are stored before they expire and are deleted
  • paths - The paths are relative to the project directory of the files\directories that are saved to the artifact
  • reports - Use to collect artifacts generated by included templates in jobs

Build Stage

  • image - Docker image for your project from https://hub.docker.com/
  • script - If for get .env file from repository settings and command for start build project
  • expire_in - Specify how long job artifacts are stored before they expire and are deleted
  • paths - The paths are relative to the project directory of the files\directories that are saved to the artifact
  • reports - Use to collect artifacts generated by included templates in jobs

Deploy Stages

  • image - Docker image for your project from https://hub.docker.com/
  • script - Command for build and start docker container
  • expire_in - Specify how long job artifacts are stored before they expire and are deleted
  • paths - The paths are relative to the project directory of the files\directories that are saved to the artifact
  • reports - Use to collect artifacts generated by included templates in jobs
  • only - Branches and conditions that are suitable for deployment
  • tags - Runner tags that can take this job
  • except - Except main branch from deploy stage

If you do not specify an image in the stages, the default image will be used, which is specified in the runner settings

Runner settings

  • executor = "docker"
  • default image = ...
config.toml

/etc/gitlab-runner/config.toml

...
volumes = ["/cache"]
...

change to

volumes = ["/var/run/docker.sock:/var/run/docker.sock", "/cache"]

Deploy to develop or create tag

image

Deploy to other branch

image

Download artifacts

image image

About

GitLab CI/CD template with GitLab-Runner to deploy a Vue.js project in a docker container on a VPS

Topics

Resources

Stars

Watchers

Forks