This is 1/2 of the entire project, please see immutable-redux-server to get the second 1/2.
The perfect framework for your next cross-platform, enterprise web-application using react, redux and immutable-js. There are so many libraries to choose from these days. A few of them come running to the forefront when it comes to developing your next website or application. This project is set up to get your project into motion with the latest and greatest simply by adding to this setup.
What you get:
- react
- redux - State Management
- react-redux -
@connectstate to components. - immutable - Immutable data structures
- redux-immutable - a simplified combineReducers function for immutable data
- react-router - Routing
- babel - ES6/ES7 and jsx syntax
- css-modules - Hashed classNames to prevent className collisions
- postcss - Toolbelt for all your future css needs.
- eslint - Static analysis of your code
- heroku - Automated deployment using
git push heroku - chrome-react-perf - react performance tools via chrome dev-tools
Why you should use immutable data:
When passing immutable props into your component, you will gain substantial improvements to updates when rendering. When working with react-redux, your @connected props will utilize shallowEqual, which during shouldComponentUpdate can utilize === to compare immutable props to determine whether or not the component should update.
Install the dependencies:
npm install
Start the dev-server:
npm start
Then start the server: See instructions at immutable-redux-server
Depending on how you want to go about deploying your web-app, this project is equipped to automatically deploy a web-server to serve static-content of your app on Heroku. However, you can easily build the app and deploy manually wherever you want.
- Follow these instructions to get heroku toolbelt on your machine
- Commit all your code using git
- Deploy your web-app using these instructions
- TODO working on a docker image which can be deployed to heroku with one easy step After that, you can push up all of your changes to heroku and heroku will run all of the necessary scripts added to Procfile in the root of this project
git push heroku master
This will issue a command for webpack to bundle all of your js and css and insert their hashed names into /public/index.html.
npm run build
Linting in atom can be enabled by entering this command into your terminal:
apm install linter linter-eslint
Special thanks to facebook, Evil Martians, and some github heroes @gaearon, @erikras, @leebyron, @acdlite, @christianalfoni, and many more.
This framework is only the beginning. There are hundreds of other resources out there. All you gotta do is look for them. You can start here.
When I mentioned cross-platform, I have tested this project on Windows, Mac, and Linux(Chromebook running Ubuntu). Please let me know if you experience any issues in installation with any of these platforms, or if you're using any other platforms.
The plan for deployment of an application is dependent on the infrastructure. To try and cut down on this, I am attempting to serve this application via containers, see Docker.