Universal react router4
Demo app showing how to use react-router v4 for server- and client-side rendering
A Demo app showing how to use react-router v4 for server- and client-side rendering. The project is written primarily in JavaScript, distributed under the MIT License license, first published in 2017. Key topics include: demo, isomorphic, javascript, react, react-router.
universal-react-router4
A Demo app showing how to use react-router v4 for server- and client-side rendering.
Similar to the demo app Ryan Florence shows in his
introductory video for react-router 4, this app fetches data
about Gists from the GitHub API and displays them. The difference is that in this demo, the markup of the page
is initially rendered on the server side, and when the user clicks on one of the links, the Gist data is rendered
on the client side without another request to the server, using the same React components and react-router link
elements that the backend is using (hence “universal”).
How to Run
You should have a current version of Node.js installed. Version 6.9 is recommended.
Install the node modules used by the application:
npm install
Build JavaScript bundles for the server- and client-side code using webpack:
npm run build
Run the application:
npm start
You can then go to localhost:3000 in your favorite browser to see the Gists.
Local Development
To speed up local development when working on the source code, you can start the application in watch mode.
You need to run each of the following commands in a separate terminal.
To automatically rebuild the client JavaScript bundle when client source code changes:
npm run dev:client
To automatically rebuild the server JavaScript bundle when client source code changes:
npm run dev:server
To run the server and automatically restart it when the server bundle changes:
npm run dev:start
License
Published under the MIT License.
Copyright © 2017 mobile.de GmbH
