Umgebungsvariablen in Reactjs zu verwenden ist relativ einfach, es erfordert jedoch ein paar Schritte.
1. Erstellen Sie eine .env-Datei im Projekt-Stammverzeichnis. Dies wird als Ort zum Speichern von Schlüsseln und Passwörtern dienen, die Sie nicht in Ihrem Code einbetten und auf GitHub veröffentlichen möchten.
2. Beginnen Sie den Namen jeder Variablen mit REACT_APP_. React wird diese Variablen automatisch importieren und in Ihrem Code verfügbar machen. Weitere Informationen finden Sie in der Dokumentation von Create React App. Beispiel: ``` REACT_APP_SECRET_KEY=YOUR_SECRET_KEY ```
3. Jetzt können Sie in Ihrem Code auf diese Variablen zugreifen, indem Sie process.env vor den Variablennamen schreiben. Beispiel:
```
const secretKey = process.env.REACT_APP_SECRET_KEY;
```
4. Verwenden Sie die Variable in Ihrem Code wie erforderlich. Stellen Sie sicher, dass Sie die .env-Datei zu Ihrer .gitignore-Datei hinzufügen, damit sie nicht versehentlich an das Repository übertragen wird.
Hinweis: Jedes Mal, wenn Sie eine neue Umgebungsvariable hinzufügen oder eine existierende ändern, müssen Sie die Entwicklungsumgebung neu starten (`npm start` oder `yarn start` erneut ausführen), damit die Änderungen wirksam werden.
Dieses Verfahren stellt sicher, dass Ihre geheimen Schlüssel und Passwörter niemals öffentlich zugänglich sind und sich leicht ändern lassen, ohne den Code zu ändern.