Apps

Completing the CircleCI – Digital product development agency

It’s nice to have the sense of security and confidence in your code that testing can provide, but running tests manually before every push can feel like a real chore. Thankfully there are some very handy cloud-based SaaS solutions that can outsource this repetitive task.

The solution we’ll be working with is CircleCI. If you are unfamiliar with continuous integration and deployment, take a look at Lev Lazinskiy’s explanation.

Before We Start

Get or Make the App

This repository has some starter code. Alternately, you can install vue-cli and set up a new project. After running create, remember to choose:

Cool. You should be good to go. Take a minute to cd into your new app and spin up the local dev server, run the tests and familiarize yourself with it. While you are there check that you have a config file on the right path. If you don’t, add it:

$ touch .circleci/config.yml

Link Everything Up

Sign in to your CircleCI account and navigate to the add projects tab. Search for your Vue Hello World repo and select add project.Preflight checklist done. Let’s set up our CI/CD.

 

CircleCI Configuration

Orbs and Workflows

Orbs are certified or third party configurations that streamline an action while simultaneously allowing you to access the underlying configuration options. We are going to use two orbs. The Heroku orb and the Cypress orb. The Heroku orb is in CircleCI’s registry. For the Cypress orb to work correctly, you’ll need to change security settings in CircleCI to allow for uncertified and third-party orbs.

Workflows are a collection of jobs run in parallel or sequence. We’ll define those as we build our configuration file.

jobs section of the Heroku orb at the deploy-via-git command you’ll see that CircleCI needs an API key and an app name to complete its remote URI. We can set those up in our project env vars.

Push it to GitHub and watch it build:Now as you start to build tests and code CircleCI will check all your tests and only deploy if your tests pass. From here you can customize even further. Some options you can experiment with are adding unit tests, running them in parallel, deploying different branches or deploying to different hosting services. There are a lot of possibilities. Take some time and keep exploring.

 


Related Articles

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to top button
Close
Close

Adblock Detected

Please consider supporting us by disabling your ad blocker