All Projects → jpsierens → Webpack React Redux

jpsierens / Webpack React Redux

Licence: mit
A boilerplate for playing around with react, redux and react-router with the help of webpack.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Webpack React Redux

React Boilerplate
This project is deprecated. Please use CRA instead.
Stars: ✭ 88 (-85.62%)
Mutual labels:  webpack, yarn, boilerplate
Js Stack Boilerplate
Final boilerplate code of the JavaScript Stack from Scratch tutorial –
Stars: ✭ 145 (-76.31%)
Mutual labels:  webpack, yarn, boilerplate
React Redux Styled Hot Universal
react boilerplate used best practices and focus on performance
Stars: ✭ 147 (-75.98%)
Mutual labels:  webpack, yarn, boilerplate
Gulp Scss Starter
Frontend development with pleasure. SCSS version
Stars: ✭ 339 (-44.61%)
Mutual labels:  webpack, yarn
Nin
nin is ninjatool
Stars: ✭ 313 (-48.86%)
Mutual labels:  webpack, yarn
Electron React Boilerplate
A Foundation for Scalable Cross-Platform Apps
Stars: ✭ 18,727 (+2959.97%)
Mutual labels:  webpack, boilerplate
Kratos Boilerplate
🔥 A simple boilerplate for creating statics PWA using Webpack, Pug, PostCSS and CSS Modules
Stars: ✭ 308 (-49.67%)
Mutual labels:  webpack, boilerplate
Js Library Boilerplate Basic
Javascript Minimal Starter Boilerplate - Webpack 5 🚀, Babel 7, UMD, Unit Testing
Stars: ✭ 354 (-42.16%)
Mutual labels:  webpack, boilerplate
Chrome Extension React Typescript Boilerplate
🔨 A boilerplate project to quickly build a Chrome extension using TypeScript and React (built using webpack).
Stars: ✭ 347 (-43.3%)
Mutual labels:  webpack, boilerplate
Wxapp Boilerplate
使用 webpack, babel, scss 开发的微信/支付宝小程序项目脚手架
Stars: ✭ 367 (-40.03%)
Mutual labels:  webpack, boilerplate
Preact Starter
Webpack3 boilerplate for building SPA / PWA / offline front-end apps with Preact
Stars: ✭ 384 (-37.25%)
Mutual labels:  webpack, boilerplate
Electron React Webpack Boilerplate
Minimal Electron, React, PostCSS and Webpack boilerplate to help you get started with building your next app.
Stars: ✭ 312 (-49.02%)
Mutual labels:  webpack, boilerplate
Ionic Boilerplate
✨ An Ionic Starter kit featuring Tests, E2E, Karma, Protractor, Jasmine, Istanbul, Gitlab CI, Automatic IPA and APK, TypeScript 2, TsLint, Codelyzer, Typedoc, Yarn, Rollup, and Webpack 2
Stars: ✭ 309 (-49.51%)
Mutual labels:  webpack, boilerplate
React Webpack Boilerplate
Minimalistic ES6+ React boilerplate with Hot Reloading using Webpack 4 and Babel 7
Stars: ✭ 336 (-45.1%)
Mutual labels:  webpack, boilerplate
Graphql Starter
💥 Monorepo template (seed project) pre-configured with GraphQL API, PostgreSQL, React, Relay, and Material UI.
Stars: ✭ 3,377 (+451.8%)
Mutual labels:  yarn, boilerplate
Pwa
An opinionated progressive web app boilerplate
Stars: ✭ 353 (-42.32%)
Mutual labels:  webpack, boilerplate
Js Stack From Scratch
🛠️⚡ Step-by-step tutorial to build a modern JavaScript stack.
Stars: ✭ 18,814 (+2974.18%)
Mutual labels:  webpack, yarn
Webpack Boilerplate
A minimal webpack 5 boilerplate with only Babel, SASS and lodash (optional) on board
Stars: ✭ 404 (-33.99%)
Mutual labels:  webpack, boilerplate
Hyperstack
Hyperstack ALPHA https://hyperstack.org
Stars: ✭ 463 (-24.35%)
Mutual labels:  webpack, yarn
Webpack Cdn Plugin
A webpack plugin that use externals of CDN urls for production and local node_modules for development
Stars: ✭ 306 (-50%)
Mutual labels:  webpack, yarn

webpack-react-redux

A boilerplate for playing around with react, redux and react-router with the help of webpack.

Contains:

  • a working example of a filterable table which you can play around with (look below).
  • ES6 - 7 Support with Babel
  • Redux dev tools to help you keep track of the app's state
  • Routing
  • hot module replacement support so you can change modules or react components without having to reload the browser
  • a webpack production config so you can build the app and make it ready for production
  • Sass support, just import your styles wherever you need them
  • eslint to keep your js readable
  • much more...

Run the app

  1. npm install
  2. npm start

Once running, if you want to hide the redux dev monitor: CTRL+H

Yes, it takes a while to load the first time you open the app.

Is the hot module replacement really working?

Yup! Take a look:

The app updates without the browser having to reload. You don't lose state!

Build the app

npm run build

This will build the app into the "dist" directory in the root of the project. It contains the index.html along with the minified assets, ready for production.

It should look something like the above image.

I don't understand anything!

I went ahead and wrote a detailed series of posts on this project for you. I hope it helps you understand better:

Why doesn't it have async?

To keep it unopinionated. You choose what async library you want. If you want to check out a full example with async in it, check this simple todo-app that uses redux-sagas.

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].