ijlee2 / ember-animated-tutorial

Ember Animated & Ember Data Storefront tutorial for Ember ATX Meetup

Ember Animated Tutorial

This is the code companion to my Animation and Predictable Data Loading in Ember, presented at the Ember ATX Meetup on 3/28/2019.

How to Run

Option 1

You can run the app as is. Ember Mirage will create random data each time.

1. Do npm install.

2. Run ember s, then visit localhost:4200.

Option 2

You can also run the app on a local Postgres server (you need this for step-1d).

1. Set the environment variables POSTGRES_USERNAME and POSTGRES_PASSWORD.

export POSTGRES_USERNAME=<your username>
export POSTGRES_PASSWORD=<your password>

2. In /config/environment.js, please edit the ember-cli-mirage option under development environment.

if (environment === 'development') {
    ENV['ember-cli-mirage'] = {
        enabled: false,
    };
}

3. In terminal, go to /api folder.

rake db:create db:migrate db:seed

This will create two databases, ember-animated-tutorial-development and ember-animated-tutorial-test. If you need to delete them, you can type rake db:drop.

4. Run rails s, then visit localhost:3000.

Branches

You can check a starter code by running git checkout <branch name>:

Branch name	Added features
step-1a	Starter for {{link-to}} bug
step-1b	Starter for findRecord bug
step-1c	Starter for findAll bug
step-1d	Starter for (n + 1) query bug
step-2a	Starter for animation with Web Animations API
step-2b	Starter for animation with Ember Animated
master	Completed