> For the complete documentation index, see [llms.txt](https://tutorial.specian.co.uk/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://tutorial.specian.co.uk/devops/ci.md).

# CI/CD

The first thing we're going to do is automating the tests. The CI will run the `backend` and `frontend` tests for each commit pushed.

Later, we will also automate the deployment of the app when we push to the `master` branch.

The end goal is to automate the pipeline from commit to deploy.

![](/files/-LrEq6kTHyZv2559o8iH)

### CircleCI

[CircleCI](https://circleci.com) is a popular platform offering CI in the cloud. You get one container for free.\
Let's get started:

1. Create a folder named `.circleci` and add a file`config.yml`.
2. Populate the `config.yml` with the contents of the sample `.yml` bellow.
3. Change `"test": "echo \"Error: no test specified\" && exit 1"` to `"test": "jest"` in `packages/api`.
4. Commit and push up to GitHub
5. Go to CircleCI and watch your build.

```yaml
# Javascript Node CircleCI 2.0 configuration file
#
# Check https://circleci.com/docs/2.0/language-javascript/ for more details
#
version: 2
jobs:
  build:
    docker:
      # specify the version you desire here
      - image: circleci/node:10

      # Specify service dependencies here if necessary
      # CircleCI maintains a library of pre-built images
      # documented at https://circleci.com/docs/2.0/circleci-images/
      # - image: circleci/mongo:3.4.4

    working_directory: ~/repo

    steps:
      - checkout

      # Download and cache dependencies
      - restore_cache:
          keys:
            - v1-dependencies-{{ checksum "package.json" }}-{{ checksum "packages/api/package.json" }}-{{ checksum "packages/web/package.json" }}
            - v1-dependencies-

      - run: yarn install

      - save_cache:
          paths:
            - node_modules
            - packages/web/node_modules
            - packages/api/node_modules
          key: v1-dependencies-{{ checksum "package.json" }}-{{ checksum "packages/api/package.json" }}-{{ checksum "packages/web/package.json" }}

      # run tests!
      - run: yarn --cwd packages/web test
      - run: yarn --cwd packages/api test
```

When tests are broken, CircleCI will let you know:

![](/files/-LrEviS5SIjsx70QbA0g)

We can also see the build status on the commits:

![The  ❌ on the right end side indicates the build is not passing.](/files/-LrEw2uSXQV4iXLTKoA3)

{% hint style="info" %}
You can configure GitHub to require the CI to pass before you merge into a branch in `Setting`> `Branches` > `Rule settings` > `Require status checks to pass before merging`.

* Branch name pattern: `master`
* Check CircleCI steps
  {% endhint %}

### Environment variables

Locally, we are reading the `.env` file. But this file is not committed to the repo. We have to setup the environment  variables on CircleCI.

Go to the project's settings by clicking on the cog next to the project name:

![](/files/-LrEybPgtNOfOqTQ7eBu)

Scroll down to `BUILD SETTINGS` and click `Environment Variables` then `Add Variable`.\
Add the variables from the `.env` file:

![](/files/-LrEz5lmiCjPFkIooNnZ)

The tests should now be passing:

![](/files/-LrEzyhCEQFSdJT1_cGC)

![](/files/-LrF0E7xIGHXNJO0KIA8)