Keeping Long JavaScript Strings Readable in Code

02-13-2020

If you’ve ever had a long JavaScript sting that needs to maintain it’s string like format but is too long for your text editor or IDE’s window then this trick will help.

Let’s say for example I need to create an OAuth URL for logging into my favorite provider. The values required to build the URL make the string really long and hard to read and edit. I also want to use Template Literals to pull in values from configuration and environment files. In strings, like URLs, if I were to just hit the enter key to create a new line break in the code, that line break is translated into the string value, no bueno. Instead I can mix Template Literals with string concatenation to achieve the same goal.

Turning this:

Into this: