Consume 3rd party api & display results & mirage

Ember Data
1

complete noob to emberjs and am trying to figure out how to pull data from, for example meetup.com api, and display the results in a route. I’m using mirage for TDD.

My main issue is understanding the architecture to use with Emberjs. To get this data I should

  1. create: model, route, template, adapter - all called attend.
  2. In the attend adapter make request to meetup and model the results making sure they match the whats definied in the attend model. Then push this to a store
  3. In the attend route then return the store as model()
  4. In the attend template then the data can be accessed as |model|
  5. mirage config should return mock data for GET /attend route.

But when I use the above method I end up creating my own API and the route then reads from that - which is not what I want to do. Simply I just want to get the data from meetup and display it.

So now I’m trying the following:

  1. create route & template attend
  2. route model() returns jquery call to meetup for data
  3. mirage config.js watches GET https://.to.meetup.api But I’m getting the error below…

Mirage: Your Ember app tried to GET ‘https://api.meetup.com/My-Cool-Meetup/events?photo-host=public&page=20&sig_id=xxxxxxxxxx&sig=xxxxxxxxx’, but there was no route defined to handle this request. Define a route that matches this path in your mirage/config.js file. Did you forget to add your namespace?

app/routes/attend.js import Ember from ‘ember’;

export default Ember.Route.extend({
    model(){
        return $.getJSON('https://api.meetup.com/My-Cool-Meetup/events?photo-host=public&page=20&sig_id=xxxxxx&sig=xxxxxxxx');
    }
});

mirage/config.js export default function() { this.namespace = ‘/api’;

    this.get('https://api.meetup.com/Dublin-Coder-Forge/events?photo-host=public&page=20&sig_id=183789567&sig=0c247a6dff1ac1cda1f65930c1923a3353074c30', function(){
        return {
            "data": [{}],
        };
    });
};

Now I’m wondering if I’m doing things the ember way at all - by right the data should be modeled, thus an adapter pattern, but I don’t want to create or namespace /api - so adapter might mean something else in ember and complete overkill.

lost down rabbit hole, any help appreciated.

2

argggg… always when I ask then answer pops into my head. I removed the get vars from the this.get() in mirage config.js and is working now.