Today we'll see a solution to the previous exercise, as well as a few resources to help prepare you for the upcoming episodes.


In the last episodes you were asked to add a person model that belongsTo the event model. You can do this with by creating an app/models/person.js which would look like this:

import Model from 'ember-data/model';
import attr from 'ember-data/attr';
import { belongsTo } from 'ember-data/relationships';

export default Model.extend({
  firstName: attr('string'),
  lastName: attr('string'),
  event: belongsTo('event')

We should add a the person model as a hasMany on the event model.

import Model from 'ember-data/model';
import attr from 'ember-data/attr';
import { belongsTo, hasMany } from 'ember-data/relationships';
import Ember from 'ember';

export default Model.extend({
  title: attr('string'),
  description: attr('string'),
  address: belongsTo('address'),
  people: hasMany('person'),

  attendeeCount: Ember.computed('people', function(){
    let people = this.get('people');
    return people.get('length');

We'll need a person mirage model:

import { Model, belongsTo } from 'ember-cli-mirage';

export default Model.extend({
  event: belongsTo()

We'll need to update the event mirage model:

import { Model, belongsTo, hasMany } from 'ember-cli-mirage';

export default Model.extend({
  address: belongsTo(),
  people: hasMany()

Create a mirage factor for person:

import { Factory, faker } from 'ember-cli-mirage';

export default Factory.extend({
  firstName() { return;},
  lastName() { return; }

In our event factory we should remove our attendeesCount line as it is now a computed property.

In mirage/scenarios/default.js:

export default function(server) {
  let addresses = server.createList('address', 10);

  addresses.forEach((address) => {
    let people = server.createList('person', Math.floor((Math.random() * 30) + 1));
    server.create('event', { address,  people});

We will then add our people routes to mirage/config.js:

this.get('/people', (schema) => {
  return schema.people.all();
this.get('/people/:id', (schema, request) => {
  return schema.people.find(;

You can clone the completed app here:


This week we will be going in more depth with components. If you want to do some preparatory reading I suggest the following: