Let's say I'm working on an app on a local dev server, localhost:1234 for example. Once I feel ready, I upload any changes to a GitHub repo and have those changes sync with an online website, for example exampleapp.com.

Since I'm using authentication in my app, I'm going to need to specify my OAuth domain. My app's not published yet, so I'm fine with changing the domain to localhost so that I can test the auth on my local servers. But when I deploy it to exampleapp.com, however, the auth will fail to work because the settings allow only localhost.

So I made a second, almost identical app. It does a pretty good job of saying, "Please don't authenticate with me unless you know EXACTLY what you're doing!" This would allow me to have my prod version set up for exampleapp.com while the local version is set up for localhost.

Both app client IDs and keys are going to be in public code repositories, and the code will look something like this:

const inDev = (location.host === "localhost:1234");
const clientId = inDev ? 12345 : 23456;
const apiKey = inDev ? "thisIsMyApiKey123" : "tryThisInProdSite789";

• Was this the most reasonable decision?
• Was there something else I could have done instead of creating another app?