All Projects → pierreavizou → universal-routed-flux-demo

pierreavizou / universal-routed-flux-demo

Licence: MIT License
The code in this repo is intended for people who want to get started building universal flux applications, with modern and exciting technologies such as Reactjs, React Router and es6.

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects

Projects that are alternatives of or similar to universal-routed-flux-demo

react-workshops
Online react workshops
Stars: ✭ 36 (+16.13%)
Mutual labels:  flux, flux-architecture
molecule
⚛️ –  – ⚛️ Boilerplate for cross platform web/native react apps with electron.
Stars: ✭ 95 (+206.45%)
Mutual labels:  react-router, immutablejs
next-react-boilerplate
🔥 NextJS with additional tech feature like react-boilerplate. Demo >>
Stars: ✭ 20 (-35.48%)
Mutual labels:  immutable, immutablejs
fluxiny
~1K implementation of flux architecture
Stars: ✭ 77 (+148.39%)
Mutual labels:  flux, flux-architecture
mini-swift
Minimal Flux architecture written in Swift.
Stars: ✭ 40 (+29.03%)
Mutual labels:  flux, flux-architecture
AndroidFluxPractice
Android Flux Practice
Stars: ✭ 51 (+64.52%)
Mutual labels:  flux, flux-architecture
react-redux-immutable-webpack-ssr-starter
React + React-Router 4 + Redux + ImmutableJS + Bootstrap + webpack 3 with with Server side rendering, Hot Reload and redux-devtools STARTER
Stars: ✭ 21 (-32.26%)
Mutual labels:  immutable, immutablejs
nanoflux-fusion
Redux-like extension for Nanoflux
Stars: ✭ 15 (-51.61%)
Mutual labels:  flux, flux-architecture
Vuex-Alt
An alternative approach to Vuex helpers for accessing state, getters and actions that doesn't rely on string constants.
Stars: ✭ 15 (-51.61%)
Mutual labels:  flux, flux-architecture
ballade
For unidirectional data flow.
Stars: ✭ 44 (+41.94%)
Mutual labels:  flux, immutablejs
redux-reducer-async
Create redux reducers for async behaviors of multiple actions.
Stars: ✭ 14 (-54.84%)
Mutual labels:  flux, flux-architecture
react-flux-gulp-starter
A universal boilerplate for building React/Flux apps using Gulp and ES6.
Stars: ✭ 46 (+48.39%)
Mutual labels:  flux, react-router
fluxy
Fluxy is a Flux architecture implementation written in Kotlin.
Stars: ✭ 25 (-19.35%)
Mutual labels:  flux, flux-architecture
react-antd
基于react + redux + immutable + less + ES6/7 + webpack2.0 + fetch + react-router + antd实现的SPA后台管理系统模板
Stars: ✭ 320 (+932.26%)
Mutual labels:  immutable, react-router
extendable-immutable
Wrapper classes around Immutable.js that turn it inheritable
Stars: ✭ 58 (+87.1%)
Mutual labels:  immutable, immutablejs
relite
a redux-like library for managing state with simpler api
Stars: ✭ 60 (+93.55%)
Mutual labels:  flux, immutable
Firedux
🔥 🐣 Firebase + Redux for ReactJS
Stars: ✭ 148 (+377.42%)
Mutual labels:  flux, flux-architecture
Smitty
Tiny flux implementation built on mitt
Stars: ✭ 210 (+577.42%)
Mutual labels:  flux, flux-architecture
json-immutable
Immutable.JS structure-aware JSON serializer/deserializer
Stars: ✭ 23 (-25.81%)
Mutual labels:  immutable, immutablejs
iflux2
Reactive state container (based on immutable) for React or ReactNative, inspired by mapreduce.
Stars: ✭ 50 (+61.29%)
Mutual labels:  flux, immutablejs

Universal Flux example with React and React-Router

UPDATE 2 : On the immutable branch you will find the app's TodoStore and LogStore implemented with Facebook's Immutable library. The implementation is inspired by this one.

UPDATE : On the flux-utils branch you will find the flux architecture implemented with Flux's bundled flux/utils.

The code in this repo is intended for people who want to get started building universal flux applications, with modern and exciting technologies such as React, React Router and es6.

It consists of an example Todo Application built with flux and inspired by the Facebook Flux tutorial.

The app has been rewritten to be fully universal (or isomorphic), use es6, React Router, have a log component and provide asynchronous server communication.

It combines the following notions in a full-featured example:

  • es6
  • Using React Router with server-side rendering
  • Flux architecture for universal applications
  • Multi-store application
  • Asynchronous server communication with visual feedback

Visual feedback

Purpose

This example app is here in the hope that it will help people getting started building great apps that use these recent technologies.

After struggling to find guides and tutorials that combined everything I wanted to build an app, I decided to write and share an example of my own.

Run the app

The first thing you should do is clone the repo. Then, cdinto the project folder and run npm install. This will download all the dependencies.

Finally, all you have to do is run node entrypoint.js or npm start.

Notes

This app purposely uses no flux framework. The main reason is that frameworks usually hide many stuff from the user, which prevents from understanding properly how things work.

Plus, the Flux architecture is reasonably clean, simple and elegant by itself, so using a framework is often not necessary, especially in example code.

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