How to deploy react's app, which use API-server?

Question

I have frontend-app, written using React, which use api-server https://koalerplate-xxxxxxx.now.sh".

//package.json

{
     ...
      "dependencies": {
        "bulma": "^0.7.1",
        "react": "^16.4.1",
        "react-dom": "^16.4.1",
        "react-redux": "^5.0.7",
        "react-scripts": "1.1.4",
        "redux": "^4.0.0",
        "redux-saga": "^0.16.0"
      },
      "scripts": {
        "start": "react-scripts start",
      },
      "proxy": "https://koalerplate-xxxxxxx.now.sh"
    }

"npm start", then in browser opening "localhost:3000" and all working correctly. How can I deploy this app ? How I must apply "proxy": "https://koalerplate-xxxxxxx.now.sh" ? I tried use webpack for build, got index.html + bundle.js, and upload this 2 files to static server, but not working.. and in file bundle.js I can't find this proxy "koalerplate-xxxxxxx.now.sh"

based on your start script, is this app using create-react-app? — erichardson30
– erichardson30, Commented Jun 27, 2018 at 14:03

erichardson30 · Accepted Answer · 2018-06-28 15:08:19Z

1

Create-react-app allows you to use environment variables. You can find more info defined here : https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-custom-environment-variables

When you run npm run build it generates static html/css/js files and does not use the package.json any longer so the proxy will not apply. You need to define an environment variable like the documentation shows and when you do a build, it will apply the value of the environment variable to your application.

answered Jun 28, 2018 at 15:08

erichardson30

5,0548 gold badges29 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

yoursweater · Accepted Answer · 2018-06-27 17:07:23Z

0

You're going to use npm run build to create a static file, and then you can host that using any static file server you want (for example, Node/Express). However, things get more complicated if you're using React-Router.

Here's the link to the complete guide on this subject: Deployment Instructions

It's very thorough and should answer all your questions.

answered Jun 27, 2018 at 17:07

yoursweater

2,0773 gold badges27 silver badges43 bronze badges

Collectives™ on Stack Overflow

How to deploy react's app, which use API-server?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related