Handling environments for a client side TypeScript application

Or: Lessons from building a Node+Typescript application for production, Part 3

This is one post that is part of a series of posts about what I learned building and running an application with Node.js and Typescript. The application consists of two separated codebases. One for the frontend and one for the backend. There are more posts about Language features, Tools, DevOps and Reliability.

One thing that is a bit more tricky in the frontend compared to the backend is setting up different configurations for environments. I found multiple approaches to this, but in the end chose the most simple to me.

1) In the frontend application, create a file called environment.js. This file just sets some keys on the global window object. It should be ignored in source control, because it will have to be created with different content for each environment.

2) Include it in your index.html before the main compiled Javascript files

3) In the main application, I created a Settings class like this:

4) Whenever I need the settings in the actual application logic, I just call it like this

Leave a comment