chenbin92 / React Redux Webpack Starter
Learning react
Stars: ✭ 189
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to React Redux Webpack Starter
Express Webpack React Redux Typescript Boilerplate
🎉 A full-stack boilerplate that using express with webpack, react and typescirpt!
Stars: ✭ 156 (-17.46%)
Mutual labels: webpack, eslint, babel
React Redux Universal Boilerplate
An Universal ReactJS/Redux Boilerplate
Stars: ✭ 165 (-12.7%)
Mutual labels: webpack, eslint, babel
React Starter
A basic template that consists of the essential elements that are required to start building a React (v16.3) application using Webpack (v4)
Stars: ✭ 108 (-42.86%)
Mutual labels: webpack, eslint, babel
Project Webcube
Continuously updated JS infrastructure for modern web dev
Stars: ✭ 141 (-25.4%)
Mutual labels: webpack, eslint, babel
Threejs Es6 Webpack Starter
Three.js ES6 starter project with a sane webpack configuration
Stars: ✭ 85 (-55.03%)
Mutual labels: webpack, eslint, babel
Static Site Boilerplate
A better workflow for building modern static websites.
Stars: ✭ 1,633 (+764.02%)
Mutual labels: webpack, eslint, babel
Budgeting
Budgeting - React + Redux + Webpack (tree shaking) Sample App
Stars: ✭ 971 (+413.76%)
Mutual labels: webpack, eslint, babel
Book
《现代化前端工程师权威指南》https://guoyongfeng.github.io/book/
Stars: ✭ 141 (-25.4%)
Mutual labels: webpack, eslint, babel
React Pages Boilerplate
Deliver react + react-router application to gh-pages
Stars: ✭ 134 (-29.1%)
Mutual labels: webpack, eslint, babel
Vue Web Extension
🛠️ A Vue CLI 3+ preset (previously a Vue CLI 2 boilerplate) for quickly starting a web extension with Vue, Babel, ESLint and more!
Stars: ✭ 1,147 (+506.88%)
Mutual labels: webpack, eslint, babel
Js Stack Boilerplate
Final boilerplate code of the JavaScript Stack from Scratch tutorial –
Stars: ✭ 145 (-23.28%)
Mutual labels: webpack, eslint, babel
Starter React Flux
Generate your React PWA project with TypeScript or JavaScript
Stars: ✭ 65 (-65.61%)
Mutual labels: webpack, eslint, babel
Lecture Frontend Dev Env
"[인프런] 프론트엔드 개발환경의 이해와 실습" 강의 실습 자료입니다.
Stars: ✭ 108 (-42.86%)
Mutual labels: webpack, eslint, babel
Astexplorer.app
https://astexplorer.net with ES Modules support and Hot Reloading
Stars: ✭ 65 (-65.61%)
Mutual labels: webpack, eslint, babel
React Redux Auth0 Kit
Minimal starter boilerplate project with CRA, React, Redux, React Router and Auth0 authentication
Stars: ✭ 115 (-39.15%)
Mutual labels: webpack, eslint, babel
Express React Boilerplate
🚀🚀🚀 This is a tool that helps programmers create Express & React projects easily base on react-cool-starter.
Stars: ✭ 32 (-83.07%)
Mutual labels: webpack, eslint, babel
Vue Spa Project
vue.js + vuex + vue-router + fetch + element-ui + es6 + webpack + mock 纯前端SPA项目开发实践
Stars: ✭ 118 (-37.57%)
Mutual labels: webpack, eslint, babel
Iceberg
Front-End Boilerplate built with React + Babel + Webpack + SASS
Stars: ✭ 144 (-23.81%)
Mutual labels: webpack, eslint, babel
React-babel-webpack-es6 Starter Project
A boilerplate using React, webpack and hot module reloading, and ES6 + JSX via Babel.You could use it as a base to build your own web app.
Features
The provided boilerplate enables client-side ES6 via the following technologies:
- webpack and webpack-dev-server as a client-side module builder and module loader.
- npm as a package manager and task runner
- Babel 6 as a transpiler from ES6 to ES5.
- React and JSX as a virtual Dom JavaScript library for rendering user interfaces (views).
- ESLint as a reporter for syntax and style issues. eslint-plugin-react for additional React specific linting rules.
- Sass as a compiler of CSS styles with variables, mixins, and more.
- Inline base64 URLs for images and fonts if their size is less than specified limit of file-loader
- Image compression processing of image-webpack-loader
- Watch
index.html
for changes of html-webpack-plugin
Getting Started
Installation
you should clone the repo and install the dependencies.
$ git clone https://github.com/chenbin92/react-redux-webpack-starter.git app-name
$ cd app-name
$ npm install //or cnpm install
Development
In the development mode. launch the boilerplate app:
// run the dev server http://localhost:8080
$ npm start
you should see a new browser tap opening and a title of "Hello React” in http://localhost:8080/, page hot reloads automatically when there are changes
When you run npm start:
- The sass-loader compiles Sass into CSS
- Webpack bundles the compiled CSS、JS into
bundle.js
Production
In the production mode, you can:
// run the prod server http://localhost:9090
$ npm run start: prod
// build the static files.
$ npm run build
npm run build
. This will prepare and build the project for production use. It does the following:
- Minifies all JS and CSS
- Inline base64 URLs for images and fonts if their size is less than specified limit
- Sets NODE_ENV to production so that React is built in production mode
- Places the resulting built project files into
/build
directory
All configuration tasks
-
npm start
: start the development model of server -
npm run start:prod
: start the production model of server -
npm run build
: compile code in production mode -
npm run lint
: lint with ESlint and Airbnb's style sheet. -
npm run lint:watch
: eslint watching -
npm run remove:build
: remove the dist directory -
npm run clean:build
: clean the dist directory
TODO
- [ ] add test
Others
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].