Hello all, I am having an issue accessing my environment variables. They are showing up as undefined in next js on the client side. I set the variables in the dashboard, but when I try to access them in my component, I get undefined. process.env.API_URL // undefined
Hello there!
To access environment variables on the client-side in a Next.js app, you need to prefix them with NEXT_PUBLIC_. For example, rename your API_URL variable to NEXT_PUBLIC_API_URL in the Cloudflare dashboard. Then, you can access it in your component using process.env.NEXT_PUBLIC_API_URL. Remember that only variables with the NEXT_PUBLIC_ prefix will be embedded into the client-side JavaScript bundle by Next.js.
What if I want to access a secret? Would that have to be done server side?
use this GitHub - t3-oss/t3-env
I cannot access the server-side environment variables.