Raúl Jiménez

elecash@gmail.com

@elecash

Angular Continuous Integration

about me

Angular GDE

videogular

google partner

toptal partner

nightmares?

insomnia?

stress?

you're probably under the effects of non-CI development workflow syndrome

a.k.a... "iwoml"

a classic "iwoml" development workflow

start

using

CI now!

and stop worrying you about

• It worked on my laptop
• It worked with my-dependency v1.X.X
• It worked with the previous backend API
• It worked...

create a

github repo

log in to Travis with your Github user

enable a repo on your Travis profile

install the Travis CLI and run "travis init"

modify the .travis.yml file

sudo: false
language: node_js
cache:
  directories:
    - node_modules
notifications:
  email: false
node_js:
  - '4'
before_install:
  - export CHROME_BIN=chromium-browser
  - export DISPLAY=:99.0
  - sh -e /etc/init.d/xvfb start
  - npm i -g npm@^3.0.0
before_script:
  - npm prune
script:
  - npm run build
branches:
  except:
    - /^v\d+\.\d+\.\d+$/

add your scripts on package.json

"prebuild": "npm test -- --single-run",
"build": "ng build --prod --aot",

modify the karma.conf.js

if (process.env.TRAVIS) {
  configuration.browsers = ['Chrome_travis_ci'];
}

config.set(configuration);

create a branch and send a pull request

but

we can

make it

even better

Tools that we will use in this demo

Travis

Greenkeeper

Github

npm

Semantic Release

CI development workflow

Frontend repo

Backend repo

Backend repo

Frontend repo

demo

• Travis CI is easy to setup
• Greenkeeper is really great for your libraries, not only your external deps
• If you can, use Semantic Release
• This workflow is also replicable for private repos
• All this tools are free for Open Source! Start playing today!

Summary

Links

• Slides: http://slides.com/elecash/angular-continuous-integration/
• Repos: Front and Back
• Angular CLI: https://cli.angular.io/
• Travis CI: https://travis-ci.org/
• Greenkeeper: https://greenkeeper.io/ and gk-postpublish
• Semantic Release: Github repo
• Commitizen: Github repo

thank you!