React + postCSS + ITCSS + BEM + webpack
Playing with CSS tech
- CSS Grid Layout W3c implementation
- CSS Grid Layouts, 4 methods
- A completed Guide to Grid
- React Responsive Grid
- Lots of components with BEMIT and PostCSS here
- input color polyfill: https://github.com/jonstipe/color-polyfill
- CSS Variables are a bad idea: https://www.aaron-gustafson.com/notebook/css-variables-are-a-bad-idea/
- Shim vs Polyfill: http://www.2ality.com/2011/12/shim-vs-polyfill.html
- Shim, Fallbacks and Polyfills: https://ruthlesslyhelpful.net/2011/05/26/html5-shims-fallbacks-and-polyfills/
- ES6 (with babel)
- PostCSS using BEM + ITCSS = BEMIT methodology.
- Hot Module Replacement (React Hot Loader 3)
- Webpack PostCSS configuration
- Webpack configuration for HMR
- Webpack production configuration
- Webpack stats (bundle optimization helper)
Features NOT INCLUDED (TODOs)
- Node.js and NPM: Download and install. I have version 6.6.0 of Node and 3.10.6 of NPM on Windows PC
- Git: Download and install. I have version 2.7.4 installed on Windows PC
- Get the url of your forked project.
- Click on "Clone or download" and Copy to clipboard the url ending on .git.
- Open your command line and go to your directoy
You don't need to create a specific folder for the project, it will be created by git
- Clone your forked repo on your machine:
$ git clone https://github.com/username/react-webpack-postCSS
Note: That will create a new folder called react-webpack-postCSS with all the files in.
Install Project dependencies
$ cd react-webpack-postCSS $ npm i
Open the project with your Development IDE
I use VS Code https://code.visualstudio.com Open the project using this command:
$ code .
Start development server with Hot Reloading
$ npm run start
Please feel free to add your own improvement
MIT License Copyright (c) 2016 Jose Quinto Zamora