###
React Starter DevKit
A small boilerplate for lightning-fast prototyping 🚀 🌔
Featuring:
- NPM
- Webpack
- React
- Scss (-> PostCss)
- Bootstrap (don't like bootstrap? Try the alternatives)
- Babel
- Standard.js
Extras:
- React-HMR
- React-router & History
- Font-awesome
Getting Started
Check 🔮 Gitano-CLI for an even faster setup. 🚀
Install
1. Clone the react-starter project.
git clone https://github.com/juanmnl/react-starter.git
2. Change the folder (react-starter) name with your project name.
mv react-starter/ [yourProjectName]/
cd [yourProjectName]/
FROM YOUR PROJECT (ROOT) FOLDER
3. Remove the template .git file and add a fresh one.
rm -rf .git previews && git init
From this point this is your own project.
You can commit and push from 0 to your own repo.
Follow the instructions when creating a new repo or check How to create a repo.
4. Install dependencies
npm install
5. Run dev server http://localhost:8080/webpack-dev-server/
npm start
6. Check js style
npm run check-js
7. Build project
npm run build
–––– That's all folks! 😄 ––––
–––– Start building awesome things! 🚀 ––––
Alternative installs
No Css Framework
git clone -b no-css-framework https://github.com/juanmnl/react-starter.git
Bulma flexbox-based Css Framework
git clone -b bulma https://github.com/juanmnl/react-starter.git
Webpack Config File - Quick Tips
You can add an array of files to the entry (files that are not required anywhere else) :
entry: [ "./otherFile", "./app/app.js"]
If you need some kind of preloading like jshint, you can add a .jshintrc to your root folder (for configuration), the jshint-loader to package.json and 'preloaders' into the modules:
preloaders: [
{
test: /\.js/,
exclude: /node_modules/,
loader: "jshint-loader"
}
]
Webpack resolves every .js file but if you want to use different extensions, you can set this after the modules:
resolve: {
extensions: ['', '.js', '.es6', '.ejs', .. ]
}