DEV Community

Bart Wijnants
Bart Wijnants

Posted on • Originally published at Medium on

Continuous deployment to Firebase hosting using Travis CI

#github #travisci #firebase #ci

Intro

Last night I had another multi million dollar web app idea. So of course first thing I do in the morning is start to work on my idea. Got to earn those dollars.

The first thing I need is some place on the internet where my customers can start handing me over their money. I want to move fast, so each time I change something I want to see the results immediately.

Enablers

Firebase is a platform by Google that provides hosting with minimal effort and for free. Travis is a hosted continuous integration solution that will allow me to deploy my changes to Firebase. GitHub is the place where I’ll be storing my precious code.

To build this stuff I installed Node.js and Docker on my laptop. I didn’t really need Docker but I did not feel like installing Ruby.

Let’s go to work

  • Go to Firebase and create a new project.
  • Create a new repository on GitHub.
  • Clone the repository locally.
  • Create a minimal index.html.
mkdir public touch public/index.html
  • Connect GitHub repository to Firebase project using the Firebase tools. Don’t overwrite index.html when initializing.
npm install -g firebase-tools firebase login firebase init
  • Generate a Firebase CI token (and keep it handy).
firebase login:ci
  • Go to Travis and activate the GitHub repository.
  • Encrypt the Firebase CI token using Travis CLI.
# only run the docker command if you don't have and don't want to install Ruby docker run -it --rm ruby:latest bash gem install travis travis encrypt "1/firebase_CI_token" -r githubusername/reponame
  • Create a .travis.yml file to deploy to Firebase after every push to GitHub.
language: node_js node_js: - "node" script: - deploy: provider: firebase token: secure: "encrypted_firebase_CI_token"
  • Commit and push the changes to GitHub.
  • Watch Travis build and deploy.
  • Check Firebase Hosting to see the deployment history.
  • Go to the Firebase Hosting domain for the project to see the website.

Conclusion

I just spent half a day on writing a guide on continuously deploying a website to Firebase using Travis CI and I didn’t start working on my multi million dollar idea.

Find the code on GitHub.

See the website here.

Top comments (0)