Ember Twiddle Demo: Mirage with Ember Twiddle

README.md

Ember Twiddle Demo: Mirage with Ember Twiddle

Demo

This is a very trivial example of using mirage with Ember Twiddle.

controllers.application.js

import Ember from 'ember';

export default Ember.Controller.extend({

});

mirage.config.js

import Collection from 'ember-cli-mirage/orm/collection';

export default function() {
  window.server = this;

  this.get('/foo', function (schema, request) {
    var posts = [{
      id: '1',
      author: { id: '1', name: 'Jane Eyre'}
    }, {
      id: '1',
      author: {id: '1', name: 'Emily Dickinson'}
    }];
    return posts;
  });
};

routes.application.js

import Ember from 'ember';
import { hash } from 'rsvp';

export default Ember.Route.extend({
  model() {
    
    return hash({
      posts: fetch('/foo').then((r) => r.json()),
    });
  }
});

templates.application.hbs

<header>
  <h1>Mirage</h1>
</header>

<ul>
{{log model}}
  {{#each model.posts as |post|}}
    <li>{{post.author.name}}</li>
  {{/each}}
</ul>

twiddle.json

{
  "version": "1.0.0",
  "ENV": {
    "ember-cli-mirage": {
      "enabled": true
    }
  },
  "EmberENV": {},
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "ember": "3.8.3"
  },
  "addons": {
    "ember-cli-mirage": "0.4.12",
    "ember-data": "3.8.1"
  }
}