How do I store/access a normal API key that's used only in a javascript file?

I’m used to using Environment Variables to deploy to Heroku but those are called like ‘$HEROKU_API_KEY’ in the circleci config file itself.

I’m currently adding firebase to my react application and need to hide the API tokens stored in a firebase.js file.

My question is, how do I implement this so that circleci can store those keys and what syntax will my js file need to call it? is it possible to inject entire config files at build time?

Hi @OperationFman!

What you could do is encode your firebase.js as a string using Base64 encoding and keep that as an environment variable within CircleCI. Then you can keep your firebase.js file in your .gitignore, and only recreate that file as part of your npm build or run script.

Here’s a handy guide on how you could achieve this with base64 program in bash: Bash base64 encode and decode – Linux Hint

Having said all that however, do keep in mind that every client side application will eventually have to reveal its API keys once that code touches the user - there isn’t a definite way around it. Best practice would be to protect any critical resource (in your Firebase database for example) with a login - so unauthenticated users cannot access these resources.

Hope this helps!