GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → Hancoson → React Mobx Demo

Hancoson / React Mobx Demo

Licence: mit
🔥 React, Mobx, and React-Router to achieve a Zhihu Daily App.

Programming Languages

javascript
184084 projects - #8 most used programming language

Labels

reactmobxreact-router-v4

Projects that are alternatives of or similar to React Mobx Demo

mobxSpa
企业级SPA项目，完整开发脚手架
Stars: ✭ 96 (+62.71%)
Mutual labels:  mobx, react-router-v4
React Mobx Project
react-mobx-router开发模版
Stars: ✭ 49 (-16.95%)
Mutual labels:  mobx, react-router-v4
react-with-mobx-template
project template-react&&mobx
Stars: ✭ 15 (-74.58%)
Mutual labels:  mobx, react-router-v4
React Mobx Firebase Authentication
🔥Boilerplate Project for Authentication with Firebase in React and MobX
Stars: ✭ 111 (+88.14%)
Mutual labels:  mobx, react-router-v4
Favesound Mobx
🎶 A SoundCloud Client in React + MobX running in production. Live Demo and Source Code to explore React + MobX. Refactored from favesound-redux
Stars: ✭ 532 (+801.69%)
Mutual labels:  mobx, react-router-v4
Simple Todo With React And
📝 a simple react demo to learn flux/reflux/redux
Stars: ✭ 29 (-50.85%)
Mutual labels:  mobx
Mobx React Form
Reactive MobX Form State Management
Stars: ✭ 1,031 (+1647.46%)
Mutual labels:  mobx
React App Example
Electron application example using React and MobX
Stars: ✭ 20 (-66.1%)
Mutual labels:  mobx
M Fe Boilerplates
Lucid & Futuristic Production Boilerplates For Frontend(Web) Apps, React/RN/Vue, with TypeScript(Optional), Webpack 4/Parcel, MobX/Redux 💫 多技术栈前端项目模板
Stars: ✭ 877 (+1386.44%)
Mutual labels:  mobx
Chatinder
Unofficial desktop messaging client for Tinder.
Stars: ✭ 55 (-6.78%)
Mutual labels:  mobx
Mobx Jsonapi Store
JSON API Store for MobX
Stars: ✭ 52 (-11.86%)
Mutual labels:  mobx
Push Starter
React Redux Starter with SSR 🤖
Stars: ✭ 43 (-27.12%)
Mutual labels:  react-router-v4
Mobx Docs Cn
MobX 中文文档
Stars: ✭ 957 (+1522.03%)
Mutual labels:  mobx
Reactspa
combination of react teconology stack
Stars: ✭ 911 (+1444.07%)
Mutual labels:  react-router-v4
React Mobx Ts Antd
A simple empty project build with react、react-router、mobx、antd in typescript.
Stars: ✭ 53 (-10.17%)
Mutual labels:  mobx
Create React App Redux
React Router, Redux, Redux Thunk & Create React App boilerplate
Stars: ✭ 885 (+1400%)
Mutual labels:  react-router-v4
Rntimerexample
📱 React Native + Mobx sample app
Stars: ✭ 40 (-32.2%)
Mutual labels:  mobx
React Node Learn
一个脚手架项目，node+express+react快速搭建大前端项目，实现前后端分离
Stars: ✭ 51 (-13.56%)
Mutual labels:  react-router-v4
Todo app open source
📱 an app to annotate tasks made with Flutter using MobX
Stars: ✭ 40 (-32.2%)
Mutual labels:  mobx
Hellobooks
A Single-Page Library Management App built with nodejs, express and react and redux
Stars: ✭ 37 (-37.29%)
Mutual labels:  react-router-v4
View All Similar Projects ➔

React-Mobx Zhihu Daily

GitHub package version GitHub license Travis Github All Releases

DEMO

Redux come true

中文🇨🇳

If something doesn’t work, please file an issue.

Tech used

  • [x] React v15
  • [x] Mobx v2.5
  • [x] Mobx-react
  • [x] React-router v4
  • [x] mobx-react-router v4
  • [x] antd v2
  • [x] react-scripts
  • [x] create-react-app
  • ……

How to run

  • Install: npm install(yarn)
  • Run: npm start Then open http://localhost:3000 to see the app.
  • Build: npm run build

Tree

├─config
├─src
│  ├─assets
│  │  ├─img
│  │  └─styles
│  ├─compontens
│  ├─config
│  ├─routes
│  ├─store
│  └─utils
└─build

API

This app ues the [ZhiHu Daily API], go to see the API.

Get data

  • Use the Yahoo service cross-domain
YAHOO:'https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20json%20where%20url=%22',
YAHOO_SUFFIX:'%22&format=json'

How to use Mobx（Decorators）

I use the creat-react-app to creat my app.

You can add the transform-decorators-legacy yourself in node_modules/react-scripts/config/babel.dev.js and babel.prod.js,like this:

  • add this code into presets:
require.resolve('babel-preset-stage-1'),
require.resolve('babel-preset-es2015')
  • add this code into plugins first line:
require.resolve('babel-plugin-transform-decorators-legacy'),
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].