spa-vs-universal
spa-vs-universal copied to clipboard
Real-world example implementation of a blog using a SPA and a universal architecture. Demonstrates server-side rendering combined with code-splitting.
Evaluation
Platform recommendations
The setup has been verified to run correctly with:
- macOS Sierra 10.12.6
- Node.js v8.1.3
- NPM v5.0.3
- Chrome Browser 60.0.3112.90
Please note: Only NPM 5 will install the exact same dependencies as specified in the package-lock.json. Older NPM versions might install different versions than the verified test setup.
SPA implementation
Installation
- Inside the
spafolder, executenpm installto install all dependencies - Run
npm start - Open http://localhost:3000
- Use "jhnns" and "password" as login credentials
Universal implementation
Installation
- Inside the
universalfolder, executenpm installto install all dependencies - Run
npm start - Open http://localhost:3000
- Use "jhnns" and "password" as login credentials
Note on folder structure
appcontains all the code that is going to be processed by the bundler.app/clientrepresents the client app entry.app/serverrepresents the server app entry.app/componentscontains components, views and states. They have been coalesced by features. The folder name "components" refers here to its original meaning "self-contained part of a larger entity".app/routescontains route handlers.serveris the server entry.server/apiroughly equals the server data layer.