Using environment variables

[bgschust]

I’m trying to load the environment variable for an API key that I set using the Netlify UI, but it doesn’t seem to catch.

Is the correct syntax going to be process.env.API_key or ${process.env.API_key}? Can it be done without dependencies and without using the terminal?

[perry]

hey there, did you see this guide already?

[Support Guide] Using environment variables on Netlify correctly

Last reviewed: August 2023 The preferred way to use environment variables in Netlify is to set them in our environment - be that in the Environment Variables settings UI (on the site’s “Build & Deploy settings” page), or via netlify.toml. You’ll want to choose the right pattern to meet your needs. Setting variables in our UI may be considered a bit more secure, since only people with access to the Netlify admin UI for your site can see them, rather than “anyone who can clone your repo!”. Thes…

if that doesn’t help, let us know and we can dig in some more.

[bgschust]

Yes, I saw that and followed the links referred to in that post, but I couldn’t get any of those solutions to work.

[luke]

Hi, @bgschust. Where are you trying to access the environment variables? For example:

• in the code that runs during the site build
• in the deployed site javascript
• in a serverless function deployed using Netlify

Knowing where you are trying to access the environment variable will help us to better answer your question.

[bgschust]

I’m attempting to access the environment variable in the deployed site Javascript.

[Scott]

Hey @bgschust,

So, env vars are typically only available at build time, not once deployed:

These variables are made available primarily in the build environment

Ideally, you’ll make use of the key during the build process and parse it at this time. There may be ways to make this available once deployed but it’ll need a bit of thought and engineering!

[bgschust]

I’m just trying to build something that lets me use Airtable (or Baserow or similar) as a back end. If there’s only a little bit of code I need to add to make the app work with a traditional PostgreSQL database or something similar, I’d be glad to try it.

Let’s say I want to deploy this app:
https://github.com/bgschust/microposts_fullstack_vue

Would the build command in the Netlify input box be this?
npm install && npm start && cd client && npm run serve && cd client && npm run build

[luke]

Hi, @bgschust. It looks like you are trying to run a server. If so, the following support guide might be helpful:

[Support Guide] Can I run a web server, HTTP listener, and/or database at Netlify?

Last reviewed by Netlify Support on December 2022 How do I run a server/database at Netlify? We often get questions about how to run a specific backend server or database at Netlify. Examples of these types of questions include: How to I get my node HTTP listener to respond to requests? How do I start Mongo/MySQL/<insert-some-database-here> running on the server? How can I SSH into my website? We are here today to answer these questions - and the answer is: you can’t! What do you m…

It might be possible to adapt the server process to run as a serverless function but you cannot just “run a server” at Netlify. The Jamstack design philosophy doesn’t use a traditional application server.

[bgschust]

Thanks for the reference, it looks thorough and well thought-out, but I was hoping there would be a simple solution to deploy an existing project just to see how much time I’d have to spend on DevOps tasks. It sounds like there will be a lot of steps if I take that route instead of basic API requests. Minimizing server tasks for a web project would be ideal.

Thank you for your assistance.