DEV Community

Ayako yk
Ayako yk

Posted on

2

Solution to Problems that Beginners Encounter ~React/Deploy~

I've been learning React only for three weeks, but I've had so many problems. I'll share one of them I encountered while I was deploying my project. It was not the same way I usually do since this time I was using API.

The project was to create a weather app using OpenWeatherMap, push the code to GitHub and deploy it to Netlify.
I hid the API key in a ".env" file with a variable name, just like this: VARIABLE_NAME_FOR_API = abcde12345

Here is what I needed to do:


Netlify


(1) Set Environment Variables
Deploys > Deploy settings > Environment
> Environment variables > Edit variables

 Key => VARIABLE_NAME_FOR_API
 value => abcde12345
Enter fullscreen mode Exit fullscreen mode

(2) Set Build Command
Deploys > Deploy settings > Continuous Deployment
> Build settings > Build command

Build command => CI= yarn run build

* You can change 'yarn' to 'npm' if you're using npm
* Make sure it is capital i, and there's no space
  between "CI" and "=". I typed "CI = yarn run build" 
  and failed so many times.
Enter fullscreen mode Exit fullscreen mode

I hope this will help those who have the same problem.

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

Top comments (0)

nextjs tutorial video

📺 Youtube Tutorial Series

So you built a Next.js app, but you need a clear view of the entire operation flow to be able to identify performance bottlenecks before you launch. But how do you get started? Get the essentials on tracing for Next.js from @nikolovlazar in this video series 👀

Watch the Youtube series

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay