Have you ever create an application with React, in this application you use external API’s and you pushed these API keys on GitHub ?
Oh no bad practice now everybody can use your API key.
We will see how we can avoid this and hide your API’s keys on Github, you need .env file.
You don’t need to install env package, this feature is available with email@example.com and higher.
Make a file called .env in your project root
Inside the env file, add your variables and API keys value like this :
REACT_APP_GITHUB_API_KEY=Hello world 12345 REACT_APP_MOOVIE_API=0123456789
You should prefix all your variables name by REACT_APP if not it will be ignored
Now you need to restart your React server with npm start to access these variables
Inside your React application, you can now access these variables in using this syntax :
Now you have zero excuse to push your API key in your React application.