Setup create-react-app with Express

Question

Problem - I am not able to get any response from postman when hitting localhost:9000. It should give me a user json back which is in my routes file only for time being. Instead it spits out the following.

<body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
    <script type="text/javascript" src="/static/js/main.ce2f0561.js"></script>
</body>

Setup

Using create-react-app with express to connect.

My folder structure is

--src React app lives in this

--server

-- index.js

-- express.js

-- controllers

-- routes

-- rs_notes.js

rs_routes.js

'use strict';



  module.exports = function(router){
     const notesController = require('../controllers/cs_notes');

    router.route('/', function(req, res, next) {
        // Comment out this line:
        //res.send('respond with a resource');

        // And insert something like this instead:
        res.json([{
            id: 1,
            username: "samsepi0l"
        }, {
            id: 2,
            username: "D0loresH4ze"
        }]);
    });
    };

express.js

 const express = require('express');
const morgan = require('morgan');
const path = require('path');

const app = express();

const router = express.Router();
// Setup logger
app.use(morgan(':remote-addr - :remote-user [:date[clf]] ":method :url HTTP/:http-version" :status :res[content-length] :response-time ms'));

// Serve static assets
app.use(express.static(path.resolve(__dirname, '..', 'build')));
require('./routes/rs_notes')(router);
// Always return the main index.html, so react-router render the route in the client
router.get('*', (req, res) => {
    res.sendFile(path.resolve(__dirname, '..', 'build', 'index.html'));
});

module.exports = app;

index.js

'use strict';

const app = require('./express');

const PORT = process.env.PORT || 9000;

app.listen(PORT, () => {
    console.log(`App listening on port ${PORT}!`);
});

Full project link - https://drive.google.com/file/d/0B35OQMkRo3KcSHlkeXdWVjVjc0U/view?usp=sharing

My questions or doubts are

Am I passing the router in a right way. We used to pass app in this way prior to express 4 ? So not sure if same structure works here.
I am able to load it in browser by hitting localhost:9000 (server is run by node server command as configured) but not in postman.

Answer 1

I was able to fix up this stack by learning the use of Router appropriately and moving some code here and there. But it was still not working for base route ie when I simply do router.get('/', ...). Gives the same error message. So I rather reversed the approach of connecting node and react. I published my efforts on medium for the same reason as two separate posts.

https://medium.com/@kushalvmahajan/i-am-about-to-tell-you-a-story-on-how-to-a-node-express-app-connected-to-react-c2fb973accf2

Setup create-react-app with Express

Question

1 answers

solution1
0 ACCPTED 2017-07-27 17:48:48

Setup create-react-app with Express

Question

1 answers

solution1 0 ACCPTED 2017-07-27 17:48:48

solution1
0 ACCPTED 2017-07-27 17:48:48