Skip to content

Ember Animated & Ember Data Storefront tutorial for Ember ATX Meetup

Notifications You must be signed in to change notification settings

ijlee2/ember-animated-tutorial

Repository files navigation

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>
  1. In /config/environment.js, please edit the ember-cli-mirage option under development environment.
if (environment === 'development') {
    ENV['ember-cli-mirage'] = {
        enabled: false,
    };
}
  1. 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.

  1. 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