Deploying Ember Applications to Firebase

18 March, 2016
post-banner

Deploying an Ember application is made extremely simple with Firebase, and can be done by running just one command.

Firebase's hosting service will host cache of the app's static assets over a HTTPS server, with fast load times. It also comes with automated SSL provisioning, meaning you won't have to worry about setting up your own security certificates. Another great thing about using Firebase hosting is that deployment is really fast, and rolling back to previous versions is super simple.

If you haven't used Firebase before, you should check out my previous posts on building Ember apps with Firebase, and simple third-party authentication in Firebase to get started.

Apps deployed using the free plan will be hosted at https://<APP-NAME>.firebaseapp.com, but deploying to a custom domain is offered in all paid plans. The 'Spark' plan is a great and cheap option for deploying to a custom domain, at $5 per month.

Setup

We'll need to install the Firebase command line tools globally, which can be done using npm. Or, if you already have an old version of the command line tools installed, you can easily update them in the same way.

$ npm install -g firebase-tools
$ npm update -g firebase-tools # optionally update tools

Once the command line tools have been installed on our computers, we can initialise the Firebase app that we want to deploy. It can be a good idea to run an ember build beforehand.

Running the init command will prompt you with two questions: which Firebase app to use, and where is the public root directory of your app. Ember apps are built into the dist directory, so we can enter this at the prompt.

$ ember build
$ firebase init
Initializing in a directory with 23 files

? What Firebase do you want to use? flint-books-article
? What directory should be the public root? dist
Firebase initialized, configuration written to firebase.json  

This will then create a firebase.json file at the root directory of our application, which will contain all of the config we need to deploy the app.

{
  "firebase": "flint-books-article",
  "public": "dist",
  "ignore": [
    "firebase.json",
    "**/.*",
    "**/node_modules/**"
  ]
}

You can add more configurations to your deployment, which are fully documented in the Firebase docs.

Deployment

Once everything has been set up, deploying our Firebase app is as simple as running firebase deploy. This can be done at any time we want to deploy our applications in the future.

$ firebase deploy

=== Deploying to 'flint-books-article'...

i  deploying hosting  
i  preparing dist directory for upload...  
✔  24 files uploaded successfully

✔  Deploy complete!

URL: https://flint-books-article.firebaseapp.com  
Dashboard: https://flint-books-article.firebaseio.com  

Now we can head to https://<APP-NAME>.firebaseapp.com/ to view the deployed app, or just run firebase open at the command line to open the app in the browser.

$ firebase open

If you're interested in deploying Firebase apps to a custom domain, you can check out this short walkthrough video on how to do just that.

Rollbacks

You may want to rollback the version of your app to an old revision. This could be because the latest deployment caused some errors, and you want to revert the app to its last working state. In Firebase, this is done by clicking just one button in the dashboard.

If we look in the Firebase dashboard, and head over to the Hosting tab, we can see a list of all deployments for the specified app. From here we can also rollback to previous deployment states very easily, just by clicking the 'Rollback' button.

Version Messages

You can also specify an optional message parameter to deployments, to add short version messages to better understand each deployment. Simply add an -m or --message flag to the deploy command, followed by a string for the version message.

$ firebase deploy -m 'Test message'

Further Reading

You may need a staging environment to test your app before deploying to production. If so, you can check out this blog post from the Firebase team on how to set this up.

For a full list of deployment commands that are available with the Firebase command line tools, check out the command line docs.

My Firebase series:

comments powered by Disqus