Heroku env variables working in node js but not React - node.js

I have a full stack app with Node as backend and React as front end.
I have config files for both Node and react and I have variables stored in heroku for access keys. My backend is getting those keys but Front end is giving invalid keys error.
Is there another way of using env variables in react ?
I am using it like this in both Node and React :
apiKey: process.env.API_KEY

I found the solution. In React, only the variables that start with REACT_APP_ are embedded in our app.
So the variable should be named REACT_APP_API_KEY to be used

Related

How to access Google Cloud Run Environment Variables from React App

I have Cloud Run environment variables as defined for my Google Cloud Run React App deployment.
However when I try to access them inside the react app as below, it gets "undefined" values.
export const BASE_FRONTEND_URL = process.env.REACT_APP_BASE_FRONTEND_URL
export const BASE_BACKEND_URL = process.env.REACT_APP_BASE_BACKEND_URL
I understand that the values above are in client browser, and there are no variables exist at that moment.
But how should I get the environment variables from Google Cloud Run dashboard and propagate to the client without relying on ".env" files.
If you want to use those variables (process.env.REACT_APP_BASE_FRONTEND_URL, process.env.REACT_APP_BASE_BACKEND_URL) into your react app then you have to create a .env file, which will contain all environment variables for your react app because the library which provide this named dotenv have default configuration to get all those environment variables from .env file.
So you have to get those env variables from Google cloud and paste them into .env file, then the issue should be solved.

React Authentication using Node Passport

I'm trying to create a simple authentication app using React (from vite) and express. I have my node app, and my react login/signup set, but when I try to login or signup, my react app keeps requesting to itself (localhost:3000) instead of my backend (localhost:5000). I set a "proxy" in my react package.json but it doesn't change anything. I tried to set a variable with my backend link and it worked, but is it a good practice ?

JWT token Error preventing backend api connection Node/Express MongoDB

I am creating a blogging application using Node, Express and Next.js. I have successfully deployed the frontend portion of the application however I am running into an error when trying to connect to the backend server:
Error: secret should be set
Here is a link to my Github with all the code https://github.com/DragonKnightLeo/Blog-API
This is my first fullstack application so I am pretty junior at how all this works.
I just went through the code and tried to see if I can run your code in my local.
Also, saw the error that is coming when you run the code in your logs above. Seems like you do not have a .env file or JWT_SECRET mentioned in your env file.
Try adding env file and use dotenv node module to bootstrap it along the server run.

Using process.env vars in Ember

This may be a dumb question, but how to get access to process.env vars inside of my ember app? I tried to access process.env in one of my controllers, but I received an error that process was not defined.
You generally don't have access to process.env since this is node.js global variable and ember.js generally runs in the browser which will not have process.env
However, you can use process.env during the build process which will produce ember app with the env variables build-in which you can access in another way.
I'm not sure what tooling you are using but here is how it works in Ember CLI Deploy:
http://ember-cli-deploy.com/docs/v1.0.x/using-env-for-secrets/
And here is an example with webpack:
https://webpack.js.org/guides/environment-variables/

Check if API is running within Heroku?

How do I check within my Node / Express app if it is running within Heroku?
My understanding is that .env files don't work in Heroku. So this line will crash the app in Heroku. So, I want to prevent running this within a Heroku environment.
const dotenv = require('dotenv');
dotenv.config();
One way you can do it is to create an environment variable called IS_HEROKU. On Heroku that's done in the app's dashboard, in the Settings tab, under Config Variables. Add IS_HEROKU: true. You can also use the CLI:
heroku config:set IS_HEROKU=true
It's described here.
You will now have access to it with process.env.IS_HEROKU. The value is a string.
I feel is simpler to use environment variables this way compared to using dotenv. If it was my project I would specify all the environment variables this way.

Resources