Shopify app with reactjs and nodejs without nextjs?

Question

I am developing a shopify app so the reactjs handles the UI part and node-express handles the shopify auth things.

The tutorials in shopify site are

My concern is how to test the app without reactjs server side rendering with nextjs?

As we know node and react runs one seperate ports, so how can we handle the authentication flow with shopify?

How I am trying to work is

User enters app -> Node authenticates with shopify -> if auth success -> show react app.

Update : I am using ant design so ssr of ant design will be helpful.

Anyone please help me out with a solution.

CaptainZero CaptainZero · Accepted Answer · 2019-09-05T05:53:10

After some research I got a simple solution and I am adding the links that give me solution.

React App is running in port 3000
Node server running in port 3001
Setup proxy in client package.json to localhost:3001
```
{
    proxy: "localhost:3001"
}
```
Install http-proxy-middleware

$ npm install http-proxy-middleware --save $ # or $ yarn add http-proxy-middleware
Next, create src/setupProxy.js and place the following contents in it:

const proxy = require('http-proxy-middleware');

module.exports = function(app) {
  app.use(proxy('/api', { target: 'http://localhost:3001/' }));
};`

6. That's all.

If using ngrok to make your localhost public, you may get Invalid Host Header error. Here is the solution.

ngrok http 8080 -host-header="localhost:8080"
ngrok http --host-header=rewrite 8080

This 2 link gave me the solution.