Hi,
I wrote the application like you outline on the course, I want to make it reachable as application deployed on a Web Nginx server, the application have a link at Reat App. To do this I configured an reverse proxy inside Nginx. My problem is the when I call the Node/React app by the link I only see a white page, all works perfectly in the Browser if I call the Node/React app directly.
See below:
`import materializeCSS from 'materialize-css/dist/css/materialize.min.css';
import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import reduxThunk from 'redux-thunk';
import App from './components/App';
const store = createStore(() => [], {}, applyMiddleware(reduxThunk));
ReactDOM.render(
,
document.querySelector('#root'));
`
> Nginix reverse proxy
`location /react {
proxy_pass http://10.30.1.185:5000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}`
In the Browswer console I get the following warning:
> Loading failed for the Githubissues.
Githubissues is a development platform for aggregating issues.
Hi, I wrote the application like you outline on the course, I want to make it reachable as application deployed on a Web Nginx server, the application have a link at Reat App. To do this I configured an reverse proxy inside Nginx. My problem is the when I call the Node/React app by the link I only see a white page, all works perfectly in the Browser if I call the Node/React app directly. See below:
{ "name": "server", "version": "1.0.0", "description": "", "main": "index.js", "engines": { "node": "9.8.0", "npm": "6.0.0" }, "scripts": { "start": "node index.js", "server": "nodemon index.js", "client": "npm run start --prefix client", "dev": "concurrently \"npm run start\" \"npm run client\"" }, "author": "", "license": "ISC", "dependencies": { "express": "^4.16.3", "mongoose": "^5.1.4", "nodemon": "^1.17.5" } }`const express = require("express"); const app = express(); const keys = require('./config/Keys'); const mongoose = require("mongoose"); require('./models/User'); require('./models/Profile'); mongoose.connect(keys.mongoURI); const User = mongoose.model('users');
app.use(express.static('client/build')); const path = require('path'); app.get('*', (req, res) => { res.sendFile(path.resolve(__dirname,'client', 'build', 'index.html')); }); `
`import materializeCSS from 'materialize-css/dist/css/materialize.min.css'; import React from 'react'; import ReactDOM from 'react-dom'; import { Provider } from 'react-redux'; import { createStore, applyMiddleware } from 'redux'; import reduxThunk from 'redux-thunk';
import App from './components/App'; const store = createStore(() => [], {}, applyMiddleware(reduxThunk));
ReactDOM.render(