A tiny robust boilerplate containing the following technologies
Tech | Description | Learn More |
---|---|---|
React | Fast, composable client-side components. | Pluralsight Course |
Redux | Enforces unidirectional data flows and immutable, hot reloadable store. Supports time-travel debugging. Lean alternative to Facebook's Flux. | Getting Started with Redux, Building React Applications with Idiomatic Redux, Pluralsight Course |
React Router | A complete routing library for React | Pluralsight Course |
React Cookie | Universal cookies for React | Medium Tutorial |
Babel | Compiles ES6 to ES5. Enjoy the new version of JavaScript today. | ES6 REPL, ES6 vs ES5, ES6 Katas, Pluralsight course |
Webpack | Bundles npm packages and our JS into a single file. Includes hot reloading via react-transform-hmr. | Quick Webpack How-to Pluralsight Course |
ESLint | Lint JS. Reports syntax and style issues. Using eslint-plugin-react for additional React specific linting rules. | |
npm Scripts | Glues all this together in a handy automated build. | Pluralsight course, Why not Gulp? |
Tech | Description | Learn More |
---|---|---|
Hapi | A rich framework for building applications and services. | EggheadIO Course |
Hapi Auth Cookie | A Hapijs cookie authentication plugin. | Hapijs Tutorial |
Inert | Static file and directory handlers for hapi.js. | Serving Static Content |
Universal Cookie Express | My own baked in version of this plugin located in Hapi React SSR's server/plugins directory. | Translated from this original code |
Serialize Javascript | Serialize JavaScript to a superset of JSON that includes regular expressions and functions. | Serialize used in Tyler Mcginnis SSR Tutorial |
The starter kit includes a working example app that puts all of the above to use. This utilizes isomorphic javascript rendered from the server. Hapi React SSR attempts to manage data in a more robust way than most examples out on the web. In addition to serializing and storing data on the server I also manage data on the client using redux.
As an extra added bonus I included the minimum account functionality which I feel is required in order to start off ever application. It's super basic but does the trick.
I would like to give some credit to Tyler Mcginnis for two very super helpful tutorials (though I will point out that my example is slightly more up to date in react plugins):
- Server Rendering with React and React Router
- Protected routes and authentication with React Router v4
Last but not least, I would also like to give much needed credit to Cory House for React Slingshot. His project was a critical reference when it came to setting up my redux. My project is not as nearly configured with npm scripts and testability so I would humply invite anyone who wishes to push my project further to go for it!
Hit me up