Sample playground for react project
To start a new project your would like to:
git clone https://github.com/rabotaua/ruact myapp
cd myapp
rm -rf .git
git init
npm install
npm start:timer
The main purpose is to get react-hot-loader work out of the box.
Samples taken from (react-hot-boilerplate)[https://github.com/gaearon/react-hot-boilerplate/tree/next] in conjunction with (react-boilerplate)[https://github.com/mxstbr/react-boilerplate] and (create-react-app)[https://facebook.github.io/react/blog/2016/07/22/create-apps-with-no-configuration.html].
The main difference between this one and bazillion of other starter kits is that:
- we are wanting react hot loader
- we need 1+ apps inside repository
Note: if create react app project will accept latest patches from react hot loader then there is literally no need in this boilerplate.
- Set up "JavaScript language version" to "React JSX" (File \ Settings... \ Languages & Frameworks \ JavaScript)
- Turn off "Unterminated statement" inspection at (File \ Settings... \ Editor \ Inspections \ JavaScrtip \ Code style issues \ Unterminated statement)
- Turn off "Method can be static" inspection at (File \ Settings... \ Editor \ Inspections \ JavaScrtip \ General \ Method can be static)
- Enable eslint at File \ Settings... \ Languages & Frameworks \ JavaScript \ Code Quality Tools \ ESLint
- Download and enalbe react and react-dom libraries from File \ Settins... \ JavaScripts \ Libraries
make rules decisions
Inject and provide sample for redux and router
"env": {
"development": {
"plugins": ["react-hot-loader/babel"]
},
"production": {
"plugins": [
"transform-react-remove-prop-types",
"transform-react-constant-elements",
"transform-react-inline-elements"
]
}
}
"babel-plugin-transform-class-properties": "6.*",
"babel-plugin-transform-react-constant-elements": "6.*",
"babel-plugin-transform-react-inline-elements": "6.*",
"babel-plugin-transform-react-remove-prop-types": "0.*",
npm install -g npm-check-updates
globally installs ncu
command
ncu
will list available updates
ncu -u
will install them
ava is chosen for its concurrency, react and es6 out of the box support
- ava - runner
- react-addons-test-utils - allow write unit tests for react components (as site says toke a look at enzyme)
- enzyme - makes react-addons-test-utils usable by adding jQuery like sugar
- jsdom - render into memory instead of phantomjs or chrome
- nyc - coverage