Issues getting ember frontend to communicate with separate rails api

I'm trying to use a Javascript framework for the first time. I'm already familiar with Rails and a bit of research suggested ember.js was the way to go. I found this tutorial for setting up and using ember-cli with a rails api. I'd never really written an api before but that I got through that part of the tutorial with no issue. It's the second part,getting the ember frontend to communicate with the api that I'm having trouble with.

My folder structure

-tenista
  -api
  -frontend

Frontend

The ember adapter is set up in app/adapters/application.js like so:

import DS from 'ember-data';

export default DS.ActiveModelAdapter.extend({
  namespace: 'api/v1',
  host: 'http://localhost:3000'
});

I then configured app/router.js

import Ember from 'ember';
import config from './config/environment';

var Router = Ember.Router.extend({
  location: config.locationType
});

Router.map(function() {
  this.resource('players', function(){
    this.resource('player', { path: '/:player_id' });
  });
});

export default Router;

My rails api has two controllers/models: tournaments and players. For the moment I'm just trying to get at least something working so I chose to work on the players model. I generated a corresponding model for ember (app/models/players.js)

import DS from 'ember-data';

export default DS.Model.extend({
  firstName: DS.attr('string'),
  lastName: DS.attr('string'),
  dateOfBirth: DS.attr('date'),
  plays: DS.attr('string'),
  country: DS.attr('string'),
  rank: DS.attr('integer'),
  turnedPro: DS.attr('integer'),
  affiliation: DS.attr('string'),
  height: DS.attr('string'),
  weight: DS.attr('string'),
  createdAt: DS.attr('date'),
  updatedAt: DS.attr('date'),

  tournaments: DS.hasMany('tournament')
});

I then generated a route for the players (app/routes/players/index.js):

import Ember from 'ember';

export default Ember.Route.extend({
  model: function() {
    this.store.find('player');
  },
});

I then edited app/templates/players/index.hbs to read:

<ul>
  <li> , </li>
  <li>No players found</li>
</ul>

All of this work was done according to tutorial I mentioned above. Said tutorial was updated in April this year so I figured it's pretty recent. According to the guide I should now see some players showing up. I don't. Instead what I see is stuff that was written in app/templates/application.hbs I don't seen anything from app/templates/players/index.hbs at all.

I did a bit of searching and came across some other tutorials that also modified their rails backend to respond to json so:

Backend

routes.rb

Rails.application.routes.draw do

  root 'home#index'

  resources :players
  resources :tournaments

end

And in players_controller.rb I have:

class PlayersController < ApplicationController
  respond_to :json

  def show
    render json: Player.all
  end

end

I'm using grape and the grape-active-model-serializers gems. And I also have all the attributes exposed in player_serializer.rb like so:

class PlayerSerializer < ActiveModel::Serializer
  attributes :id, :created_at, :updated_at, :first_name, :last_name, :date_of_birth,
  :plays, :country, :affiliation, :turned_pro, :rank, :height, :weight

  has_many :tournaments, serializer: TournamentSerializer
end

I'm apologise for the massive code dumb but, like I said, I'm very new to this and I have little idea about where the problem might be coming from. Any help with this matter would be much appreciated.