Continuous Deployment for Open Source projects

Slide 1

Slide 1 text

Rock the #OpenSource Continuous Deployment

Slide 2

Slide 2 text

Confidential Angel M de Miguel UX Engineer github.com/Angelmmiguel @laux_es

Slide 3

Slide 3 text

Confidential svgi graaf.space material Icons For Rails ...

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

Benefits • Visibility • Adoption • Conversations & Contributions

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

Static apps and sites

Slide 14

Slide 14 text

Static apps and sites Applications that can be fully run in the browser

Slide 15

Slide 15 text

Static apps and sites HTML + CSS + Javascript

Slide 16

Slide 16 text

Static apps and sites • Sites for our projects • Browser apps with vue, react... • Full Stack apps that use external services. Ex. Firebase.

Slide 17

Slide 17 text

Static sites CI/CD • Github Pages (Travis) • Surge.sh (Travis) • Netlify

Slide 18

Slide 18 text

Github pages

Slide 19

Slide 19 text

Github pages

Slide 20

Slide 20 text

Github pages # Generate deploy key ssh-keygen -t rsa -b 4096 -C "email" # deploy.pub deploy

Slide 21

Slide 21 text

Github pages

Slide 22

Slide 22 text

Github pages (encrypt key) gem install travis travis login travis encrypt-file deploy

Slide 23

Slide 23 text

Travis environment variables

Slide 24

Slide 24 text

Github pages (deploy.sh) deploy.sh

Slide 25

Slide 25 text

language: node_js node_js: - "7" cache: yarn install: - yarn install - yarn global add surge now Github Pages (.travis.yml)

Slide 26

Slide 26 text

jobs: include: - stage: test script: yarn test Github Pages (.travis.yml)

Slide 27

Slide 27 text

jobs: include: # ... - stage: publish script: - yarn build - ./deploy.sh Github pages (.travis.yml)

Slide 28

Slide 28 text

Travis stages Test Publish https://docs.travis-ci.com/user/build-stages

Slide 29

Slide 29 text

Github pages CI/CD • Automatic deployments with Travis • Encrypt files with Travis

Slide 30

Slide 30 text

Surge.sh

Slide 31

Slide 31 text

Surge.sh npm install -g surge surge login surge token

Slide 32

Slide 32 text

Surge.sh # Create variables in the CI SURGE_LOGIN=email SURGE_TOKEN=token

Slide 33

Slide 33 text

jobs: include: # ... - stage: publish script: - yarn build - surge --project ./build --domain rock-the-open-source.surge.sh Surge.sh (.travis.yml)

Slide 34

Slide 34 text

Netlify

Slide 35

Slide 35 text

Netlify

Slide 36

Slide 36 text

Netlify

Slide 37

Slide 37 text

Netlify

Slide 38

Slide 38 text

Netlify

Slide 39

Slide 39 text

Netlify

Slide 40

Slide 40 text

Static sites CI/CD

Slide 41

Slide 41 text

Static sites CI/CD • https://angelmmiguel.github.io/rock-the-open- source • https://rock-the-open-source.surge.sh/ • https://rock-the-open-source.netlify.com/

Slide 42

Slide 42 text

Full Stack Applications

Slide 43

Slide 43 text

Full Stack Applications Applications that need to run a backend server

Slide 44

Slide 44 text

Applications CI/CD • Heroku • now (Travis)

Slide 45

Slide 45 text

Heroku

Slide 46

Slide 46 text

Heroku

Slide 47

Slide 47 text

Heroku

Slide 48

Slide 48 text

Heroku

Slide 49

Slide 49 text

Heroku

Slide 50

Slide 50 text

Heroku

Slide 51

Slide 51 text

Heroku

Slide 52

Slide 52 text

Now

Slide 53

Slide 53 text

Now (get token) https://zeit.co/account/tokens

Slide 54

Slide 54 text

Now (now_deploy.sh) now_deploy.sh

Slide 55

Slide 55 text

jobs: include: # ... - stage: publish script: - ./now_deploy.sh now (.travis.yml)

Slide 56

Slide 56 text

Applications CI/CD

Slide 57

Slide 57 text

Applications CI/CD

Slide 58

Slide 58 text

Applications CI/CD

Slide 59

Slide 59 text

Applications CI/CD • https://rock-the-open-source.now.sh • https://rock-the-open-source.herokuapp.com/