Ember Deployment Guide

Use this guide to deploy Ember apps based on our Ember Template to GitHub Pages.

Prerequisites

• Ember Template
• Ember

Objectives

By the end of this, developers should be able to:

• Deploy an Ember app to GitHub Pages

Deployment to Github

1. If you haven't already, run npm install and bower install.
2. Make sure that everything is named consistently (i.e. ember-template -> <% NAME OF YOUR CLIENT %>). (Search via command+shift+f)
3. You need to tell your Ember client to point to your deployed API. Update config/environment.js to follow below:

Important:

-Note that if you do not see the apiHost line, you will need to add it now as seen below.

module.exports = function(environment) {
  var ENV = {
    modulePrefix: '<% NAME OF YOUR CLIENT will be here %>',
    environment: environment,
    rootURL: '/',
    locationType: 'auto',
    apiHost: 'http://localhost:3000/',
    EmberENV: {
      FEATURES: {
        // Here you can enable experimental features on an ember canary build
        // e.g. 'with-controller': true
      }
    },

Yes, user var for ENV. Do not use const. Do not use let.

AND FURTHER DOWN IN config/environment.js:

if (environment === 'production') {
  ENV.rootURL = '/<name-of-git-repo>';
  ENV.locationType = 'hash';
  ENV.apiHost = '<% replace with the URL to your deployed API %>';
}

1. Now change the value of ENV.rootURL to be the name of your git repository; e.g. in the case of this repository it would be ENV.rootURL = '/ember-deployment-guide'

Important:

-Note that rootURL is NOT camelcase. For example, rootUrl will not work.

1. Now you have to ensure you have your adapters/application.js and ajax files import the apiHost link.

In adapters/application.js file:

import ActiveModelAdapter from 'active-model-adapter';
import ENV from '<% ember-deployment-example name %>/config/environment';

export default ActiveModelAdapter.extend({
  host: ENV.apiHost,
  ...
  ...
  ...
});

IF/WHEN you have a services/ember-ajax file:

import AjaxService from 'services/ember-ajax';
import ENV from '<% ember-deployment-example name %>/config/environment';

export default AjaxService.extend({
  host: ENV.apiHost,
  ...
  ...
  ...
});

1. Make sure all work is committed and working on your master branch.
2. Create a gh-pages branch locally via git checkout -b gh-pages.
3. DO NOT PUSH TO GH-PAGES YET
4. Remove /dist from .gitignore by adding a '#' before it.
5. Add and commit this change. (git add dist/)why?
6. Run ember build --environment=production.
7. git status and add all files changed (mainly dist/) and some other changes; Then commit all changes.
8. Use "subtree push" to create a new gh-pages branch on GitHub composed only of the dist directory by using:

git subtree push --prefix dist origin gh-pages

1. Go check to your github page site and ensure all requests are working and appear the same as on localhost:4200.
2. Congrats, you've successfully deployed your Ember App! Zoey and Tomster are proud of you!

Adding dist/

You just said remove, why am I adding again? This is because you just removed dist/ from the gitignore, which means that git is now aware of it and will track it if added. We want to track dist on the gh-pages branch, so we add and commit it here.

License

1. All content is licensed under a CC­BY­NC­SA 4.0 license.
2. All software code is licensed under GNU GPLv3. For commercial use or alternative licensing, please contact legal@ga.co.