Diary of a React Dev

24th October 2023

Today I learnt that I have been having trouble accessing the code in my .env file because I had not installed dotenv in my react app.

What is dotenv?

Dotenv is a package that is used to load environment variables from the .env file.

Steps Taken to Resolve Issue:

If you haven’t created one already:

1. Create a .env file at the root of your project.
2. Define the variable e.g REACT_APP_BASE_URL=http://localhost:7000.

3. npm install dotenv

4. npm start

The react app should now load the environment variables from the variables in the .env file of the react app.

For node.js:

1. Create a .env file at the root of your project.
2. Define the variable as follows: e.g BACKEND_API_URL=http://localhost:7000
3. npm install dotenv
4. At the beginning of your index file, add the following line: require(‘dotenv’).config();
5. Restart your server to load your changes.

Remember, your links should be (https://) and not (http://) as used above, for security measures .

Read more here.

The links above are examples of urls used in local development environments.

.env