Talks about that deploymentHe usually creates a config file.

  // ****     config.js       ****

const config = {
    'localhost': {
        authUrl: 'https://labelr-localhost.herokuapp.com/authenticate', // our current setup from router.js
        clientId: 'currentclientid_stringof_chars'
    }
    
    'labelr.surge.sh' : {
        authUrl: 'https://labelr-production.herokuapp.com/authenticate.
        clientId: 'prducitonclientidstring'
    }
}[location.hostname]

export default config

There's no secret stuff in it. Just some simple configurationThen in router.js we can require and use this config

  // ****     router.js       ****
import ...
// ++++ 1. import the config
import config from 'config'

function requiresAuth(handlerName) {
    return function () {
        if(app.me.token) {
            this[handlername].apply(this, arguments)
        } else {
            this.redirectTo('/')
        }
    }
}

export default Router.extend({
    renderPage (page, opts = {layout:true}) { ... }
    
    routes: { 
        '': 'public',
        'repos': requiresAuth('repos'),
        'login': 'login',
        'logout': 'logout',
        'auth/callback?:query': requiresAuth('authCallback'),
        'repo/:owner/:name': 'repoDetail',
        '*fourOhfour': 'fourOhfour'

    },
    public () { ... },
    repos () { ... },

    repoDetail (owner, name) { ... }
    
    login () { ... },

    authCallback (query) { 
        query = qs.parse(query)
        console.log(query);
        xhr({
            // ++++ 2. use the config
            url: config.authUrl + '/' + query.code,
            json: true
        }, (err, req, body) => {
            console.log(body)
            app.me.token = body.token
            this.redirectTo('/respos')
        })

        this.renderPage(<MessagePage title='Fetching your data' />)
        
    },
    
    logout () { ... },
    
    fourOhfour () { ... }
    
})