React4 min read
React Environment Variables
Use environment variables for API keys and config.
Sarah Johnson
December 20, 2025
0.0k0
Store configuration in environment variables.
Create .env File
``` REACT_APP_API_URL=https://api.example.com REACT_APP_API_KEY=your-api-key ```
Using in Code
```javascript const apiUrl = process.env.REACT_APP_API_URL; const apiKey = process.env.REACT_APP_API_KEY;
fetch(`${apiUrl}/users`, { headers: { 'API-Key': apiKey } }); ```
Multiple Environments
```.env.development REACT_APP_API_URL=http://localhost:3001 ```
```.env.production REACT_APP_API_URL=https://api.mysite.com ```
Rules
- Must start with REACT_APP_ - Restart server after changes - Don't commit .env to git - Use .env.example for template
.gitignore
``` .env .env.local ```
Remember
- Never expose secrets in client code - Use for non-sensitive config - Different .env per environment
> Next: Learn testing basics!
#React#Environment#Config#Intermediate