{"componentChunkName":"component---src-templates-blog-post-template-js","path":"/2018/05/28/travis-ci/","result":{"data":{"mdx":{"id":"725d2d4d-1e4d-5119-908f-cab2af7aa85e","frontmatter":{"title":"Making a CI pipeline with Travis CI","date":"2018 May 28th","cover":{"id":"0b8fd75b-8bad-5300-ac5f-28f6e5a8c8e3","publicURL":"/static/cover-c912f0a6146ed7d56b64c905b16682c6.jpg"}},"body":"function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* @jsx mdx */\nvar _frontmatter = {\n  \"date\": \"2018-05-28T00:00:00.000Z\",\n  \"title\": \"Making a CI pipeline with Travis CI\",\n  \"tags\": [\"information\", \"guide\", \"travis-ci\", \"now\", \"zeit\"],\n  \"published\": true,\n  \"cover\": \"./cover.jpg\",\n  \"coverCredit\": \"Photo by Quinten de Graaf on Unsplash\"\n};\n\nvar makeShortcode = function makeShortcode(name) {\n  return function MDXDefaultShortcode(props) {\n    console.warn(\"Component \" + name + \" was not imported, exported, or provided by MDXProvider as global scope\");\n    return mdx(\"div\", props);\n  };\n};\n\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n      props = _objectWithoutProperties(_ref, [\"components\"]);\n\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"p\", null, \"I thought I\\u2019d set up this blog with some sort of build pipeline, the\\nintention was to have a good Continuous Integration pipeline so that\\nif there were any issues when building the site that I wouldn\\u2019t push a\\nbroken build. No one wants to see that \\uD83D\\uDE3F\"), mdx(\"p\", null, \"I\\u2019m feeling my way around with this and I\\u2019m presuming it\\u2019s far from\\nperfect or ideal even, but I have it as a functional work-flow.\"), mdx(\"h3\", {\n    \"id\": \"what-im-using\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h3\"\n  }, {\n    \"href\": \"#what-im-using\",\n    \"aria-label\": \"what im using permalink\",\n    \"className\": \"anchor-toc before\"\n  }), mdx(\"svg\", _extends({\n    parentName: \"a\"\n  }, {\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }), mdx(\"path\", _extends({\n    parentName: \"svg\"\n  }, {\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  })))), \"What I\\u2019m using\"), mdx(\"ul\", null, mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Zeit\\u2019s now\")), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Gatsby\")), mdx(\"li\", {\n    parentName: \"ul\"\n  }, mdx(\"p\", {\n    parentName: \"li\"\n  }, \"Travis DUH!\"))), mdx(\"h3\", {\n    \"id\": \"how-the-set-up-works\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h3\"\n  }, {\n    \"href\": \"#how-the-set-up-works\",\n    \"aria-label\": \"how the set up works permalink\",\n    \"className\": \"anchor-toc before\"\n  }), mdx(\"svg\", _extends({\n    parentName: \"a\"\n  }, {\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }), mdx(\"path\", _extends({\n    parentName: \"svg\"\n  }, {\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  })))), \"How the set-up works\"), mdx(\"p\", null, \"I have my GitHub project set up with two branches \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"master\"), \" and\\n\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"development\"), \", changes are made on feature branch of \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"development\"), \"\\nthen pushed into \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"development\"), \" then up to \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"master\"), \" once I\\u2019m happy the\\nchange is ok to go to production.\"), mdx(\"p\", null, \"Using \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"https://zeit.co/now\",\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"Zeit\\u2019s now\"), \" you can define a different url for each of your\\nenvironments. I have a \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \".now.sh\"), \" url for \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"development\"), \" and a\\nsub-domain of my \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"scottspence.me\"), \" domain for \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"master\"), \"/production.\"), mdx(\"h3\", {\n    \"id\": \"the-set-up\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h3\"\n  }, {\n    \"href\": \"#the-set-up\",\n    \"aria-label\": \"the set up permalink\",\n    \"className\": \"anchor-toc before\"\n  }), mdx(\"svg\", _extends({\n    parentName: \"a\"\n  }, {\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }), mdx(\"path\", _extends({\n    parentName: \"svg\"\n  }, {\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  })))), \"The set-up\"), mdx(\"p\", null, \"There are a few parts to setting this up, the first is adding your\\nrepository to \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"https://travis-ci.org/\",\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"https://travis-ci.org/\"), \" then adding your \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"NOW_TOKEN\"), \" from\\n\", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"https://zeit.co/account/tokens\",\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"https://zeit.co/account/tokens\"), \" to the repository settings page on\\nTravis-ci\"), mdx(\"p\", null, \"The \", mdx(\"a\", _extends({\n    parentName: \"p\"\n  }, {\n    \"href\": \"https://zeit.co/docs/examples/travis\",\n    \"target\": \"_blank\",\n    \"rel\": \"noopener\"\n  }), \"guide here\"), \" covers it for using now, the part I found\\nparticularly painful was generating the secure variable for the\\n\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \".travis.yml\"), \" file because I don\\u2019t have Ruby installed and I struggled\\nto set it up on my OpenSUSE WSL install, so instead I used a Cloud9\\nmachine in the end.\"), mdx(\"h4\", {\n    \"id\": \"the-flow\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", _extends({\n    parentName: \"h4\"\n  }, {\n    \"href\": \"#the-flow\",\n    \"aria-label\": \"the flow permalink\",\n    \"className\": \"anchor-toc before\"\n  }), mdx(\"svg\", _extends({\n    parentName: \"a\"\n  }, {\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }), mdx(\"path\", _extends({\n    parentName: \"svg\"\n  }, {\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  })))), \"the flow\"), mdx(\"p\", null, \"Issue is \\u201CAdd self hosted Fonts #75\\u201D I\\u2019ll make a branch from git and\\ngive it a name to reflect the issue number\\n\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"dev/75/add-self-hosted-fonts\"), \" I\\u2019ll make my changes locally then push\\nto the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"development\"), \" branch.\"), mdx(\"p\", null, \"Once I have merged these changes into the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"development\"), \" branch then I\\ncan view them om the \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \".now.sh\"), \" url configured in my \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"package.json\")), mdx(\"p\", null, \"My \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"travis.yml\"), \" looks like this:\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-yaml\"\n  }), \"sudo: false\\n\\nlanguage: node_js\\n\\ncache:\\n  directories:\\n    - node_modules\\n\\nnotifications:\\n  email: false\\n\\nnode_js:\\n  - '9'\\n\\nbefore_script:\\n  - npm prune\\n\\nscript:\\n  - npm i -g now@canary\\n  - npm run clean\\n  - npm run build\\n  - npm run deploy\\n\\nafter_script:\\n  - if [ \\\"$TRAVIS_BRANCH\\\" = \\\"development\\\" ]; then npm run alias:dev;\\n    fi\\n  - if [ \\\"$TRAVIS_BRANCH\\\" = \\\"master\\\" ]; then npm run alias:prod; fi\\n  - if [ \\\"$TRAVIS_BRANCH\\\" = \\\"master\\\" ]; then npm run release; fi\\n  - npm run cleanup\\n\\nenv:\\nglobal:\\n  secure: lngmfinghashvariable!\\n\")), mdx(\"p\", null, \"My \", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"package.json\"), \" looks like this:\"), mdx(\"pre\", null, mdx(\"code\", _extends({\n    parentName: \"pre\"\n  }, {\n    \"className\": \"language-json\"\n  }), \"  \\\"now\\\": {\\n    \\\"name\\\": \\\"scottblog\\\"\\n  },\\n  \\\"scripts\\\": {\\n    \\\"clean\\\": \\\"rm -rf .cache/ && rm -rf scottblog/ && rm -rf public/\\\",\\n    \\\"build\\\": \\\"gatsby build && mv public scottblog\\\",\\n    \\\"deploy:now\\\": \\\"npm run clean && npm run build && now scottblog/\\\",\\n    \\\"dev\\\": \\\"npm run clean && gatsby develop\\\",\\n    \\\"format\\\": \\\"pretty-quick\\\",\\n    \\\"precommit\\\": \\\"pretty-quick --staged\\\",\\n    \\\"deploy\\\": \\\"now scottblog/ --token $NOW_TOKEN\\\",\\n    \\\"alias:dev\\\": \\\"now alias blog-scottspence.now.sh --token $NOW_TOKEN\\\",\\n    \\\"alias:prod\\\": \\\"now alias blog.scottspence.me --token $NOW_TOKEN\\\",\\n    \\\"cleanup\\\": \\\"now rm scottblog --safe --yes --token $NOW_TOKEN\\\",\\n    \\\"release\\\": \\\"release-it\\\"\\n  },\\n\")));\n}\n;\nMDXContent.isMDXComponent = true;","excerpt":"I thought I'd set up this blog with some sort of build pipeline, the\nintention was to have a good Continuous Integration pipeline so that\nif…","tableOfContents":{"items":[{"url":"#what-im-using","title":"What I'm using"},{"url":"#how-the-set-up-works","title":"How the set-up works"},{"url":"#the-set-up","title":"The set-up","items":[{"url":"#the-flow","title":"the flow"}]}]},"timeToRead":1,"fields":{"slug":"/2018/05/28/travis-ci/","editLink":"https://github.com/spences10/thelocalhost.blog/edit/authoring/posts/2018/05/28/travis-ci/index.md"}}},"pageContext":{"slug":"/2018/05/28/travis-ci/","previous":{"id":"f508679a-76c6-54e9-a08d-cd1aa0914d29","excerpt":"I'm a bit late to the party using the new  React Context API , I did\nget to use it the other day at work, I also  made a snippet  to\nscaffold out a component for it. I had followed a couple of guides explaining how to use it and neither\nof them as…","frontmatter":{"title":"Use the React Context API with Gatsby","date":"2018-05-22T00:00:00.000Z"},"fields":{"slug":"/2018/05/22/react-context-api-with-gatsby/"}},"next":{"id":"63186e4b-d541-5997-8218-7d51482e6451","excerpt":"Let's use the React Context API to change theme in an app! But first, some  context ! 🤣 Ok terrible puns aside let's have a look at what the React Context API\nis for and what it does. There's a great one liner from the  React\ndocs ... Context…","frontmatter":{"title":"Using the React Context API  -  getting started","date":"2018-09-08T00:00:00.000Z"},"fields":{"slug":"/2018/09/08/react-context-api/"}}}}}