3.4 Hiding API Keys with Environment Variables (dotenv) and Pushing Code to GitHub 

After years, I still come back to your videos. Doesn't matter which one. I just come back to them. They solve so many issues. When I first discovered you I wasn't working with JS at all. But enjoyed watching your videos. Now I am working with JS. So I am back

I randomly came across this video and I can't go without thank you ! Your explanations are very clear and makes the course material simple to understand. Thank you very much ! I am so happy I fond your channel today :))

It was never boring! Actually, you made this serious topic so fun like magic. Also, I loved the ending credit of the train. Creative idea!!! Thank you so much!!!!

From hiding api keys to adding local source to GitHub ..well summarized things in 10 mins ..great video !

Useful stuff as always. Waiting for the next video!

I just love the way you teach things! Doesn't even let me feel boring for a single sec! 😊🚀

How i didn't know this channel? Awesome tutorial and one of the best teachers that i have ever seen on youtube. Keep up!

This is a great tutorial! Thank you for being quick and to the point, as well as informative and helpful!

What a great series man, I'm grateful everyone can use resources like this. Going from knowing almost 0 JS to deploying my app was very satisfying. One update though: if you get this error like me: "npm ERR! Missing script: "start"", add this to the end of your package.json file, before the finishing curly brace: ,"scripts": { "start": "node index.js" },

Hey, love your videos! they're so straight to the point Thank you for putting this out for free 🙏

Thanks a lot ! That's clear and the objectives are so well explained ! I didn't even know that we could code on ecstasy !

I was searching for a video about env file and felt relief when I saw yours

Thank you so much i have been searching one good video for days. finally got this one. this one is quick, understandable

You're so good at explaining things! Thank you!

As someone who just started learning to code and my first interview being: "The hell you doing your API key is public", this was a godsend video. Very to the point and clear explanation. Subscribed

Watched your video for 5minutes and i have no choose but to hit the Subscribe button very fast. I love your style of teaching,

no words can describe your awesome explanation

I was suffering to understand the environment variable and its benefits this video the best explanation I have ever seen.

Very engaging! thank you for the lesson.

Simple and straight to the point thank you👏🏿

Thank you! This is exactly the video and explanation I needed!

Thank you so much. You saved my day with this explanation

Thank you! Was just looking for this

Thanks for this playlist. Really helped

you're a legend dude this is a life saver

Awesome content and explanation, thanks man!

THank you! I find this fun to learn

The best video about environment variable and how to use them👍👍👍

super helpful - thank you!

Thank you man, I was exactly looking for that

Thanks! It was very clear!

You're a great teacher!!!

THIS SAVED MY LIFE THANK YOU

It works amazingly, thanks a million!

Very nice, thank you, very educational and entertaining! :)

Thank you! this helped me a lot, earned a new sub :D

Great presentation. Thank you very much

So, so useful. Thanks!

U made it so fun to watch ....❤

Super helpful video!

Thanks so much this is helpful.

Amazing video sir!

eagerly waiting for the next video of this series.... I want to know more about the available hosting services for node.

Thank you very much for your explanation 😊

Thanks a lot! This has been a lifesaver

thanx man , this was helpful

So keep working on my project and when I want to deploy hide all my keys and db names thank you 😁

Great explanation

As someone who has done this before on my own projects I can say this is legit. Immediate subscribe.

you are the goat, thanks so much

Muchas gracias bro 😀!

Awesome, thanks

BTW you are amazing teacher!

Simply awesome

You saved me, suscribed!

Spectacular tutorial! Thank you. It's very clear. I wonder if using any browser inspector, can anyone see the API_KEY? Looking inside the code or in the Request to the API message?

So nice thanks for this video

Thanks a lot! I was totally stuck with a bug until I watched your video. So clarifying!

Typing those command line commands made me feel like a real programmer 😎 Thank you for this awesome playlist!

sheefmahn brilliant series of videos. any videos where you interact with a Database-as-a-Service? SQL or not

i love your energy

You helped me

Nice video! I've just recently pushed some API keys to Github. Fortunately they have a service that lets you know when you've screwed up.

incredible video, I spend like 1 year in a College trying to use GitHub as they told me without actually know what I was doing. thank you! Just a question... Can I add to the .env file a private key from firebase?

Thanks dad xx

Thanks 👍

Thanks a lot

Great tutorial, but I do want to mention one thing. Environmental variables help you hide your sensitive information for version control purposes. If you build a public website and have environmental variables showing on client side, a user can open the debugger and hover over those variables and see the values of them. Make sure that you use these variables on back-end (server) side if you don't want anyone to see their values.

I had a question: Can the same effect be accomplished with a config.json and including that in the gitignore?

thank you

@TheCodingTrain Hi there! I am facing problem in order to upload .env file in my github repo. Since the application doesn't fetching information. What to do???Please help me.

you don't need an access token for the logs js file? It seems the website of mapbox requires one

If your file is called index.js, you can just do `node .` or `node index`

can you use .env and gitignore in a vanilla js project?

Bigg thankkk sir

Thanks

could continue this series with PWA. This has been popular with web technology in this modern day.

Nice video!!! How to use this environment variables in the CI(actions)?

I'm getting the api key returned in my terminal, but now my data is not being returned in the browser and getting console error: Uncaught ReferenceError: require is not defined. Help please

if you are working on linux you may experience a problem when running the code, "undefined" gets returned, thats because you need to set the env variable yourself. go to bashrc and do export ENV_VARIABLE=VALUE no spaces around the equal and if the VALUE has spaces add quotes around it

so if someone down loads the repository to try out the web app will they still be able to use is even though they wont have the api key... (for me i didn't want to show the world my database URL and password)

Hi, how about if i am using Docker and dont want to publish my .env file in git. But my application is require env file. Can you pls help how to use .env file in Docker container or K8

but this works just for development on github... if I go in production like a jam stack project? it is not hidden right?

I exactly landed where i wanted to be. I was just looking for this

Hello I am using Angular latest version with nodejs and I am new to it. In Angular we have environment.ts file where we keep API key details. I have used dotenv and generating environment.ts with with node script using dotenv. Now when we build and serve angular application and go to browser and do page view source. Enviornment.ts file is viewable in main.js file with all the details and that I dont want to expose. Any suggestion how to stop exposing this file data in page view source?

Great Great Great

i am first here and very impresed they way you teach , ke

I see that we can do without require by using node -r. Can you explain how to do it?

it only work with node servers but if I try to do it with angular have some several problems

Using dotenv package and store the API_KEY in .env file does not completely hide the API_KEY. It is fine for GitHub because someone visiting this repo they wont be able to see the API_KEY. But if the project is deployed in sever then anyone can see the API_KEY from the browser when they visit this particular website. The best way to hide the API_KEY is store it in the backend and make the API calls from the backend only. Only send the response data to the frontend. And to add more security you can set up CORS for the API_KEY so even if someone gets access to the API_KEY they wont be able to send request as the request will be rejected and only the request from the domains mention in the CORS will be able to make successful request using this API_KEY.

Does anyone know how to find your API key? The text folder I created I accidentally deleted and I had to re-generate new APY keys but I do not know where I may find this text file to update it. Any help will appreciate it!

Sir where I can Find import and export folder maker in android app resource?

can xhr requests be hidden from the console?

Please publish the continued episode fastly sir waiting for it A subscriber from INDIA #Codingtrain

From a “security/ privacy” standpoint, how is this any better than just having a js file with a variable for thr api key in it?

2:00 start 5:30 Create a sample .env Make sure .gitignore has .env listed

:( iwanna follow the CodingTrain git organization but there is no button

awesome : - )

good video

Great Tutorial! Although i have a question and i hope some good soul will answer me. During my Bootcamp, we never got tought or warned to hide our API Keys. So now that i am about to apply for jobs, i have been overwhelmed with the fact that i need to hide my personal API key that i used for my projects (it's a free personal key from my bootcamp). So my question is: What should i do that i already committed and publicly pushed all of my projects and API keys on my github? Thankfully no one has access to it yet but i need to take action before sending applications or post my github to Linkedin. Any advice would be greatly appreciated 🙏🙏