Vue. Js and React. Js, Vue. Js + UIKit to implement V2EX clone. We recently implemented a clone of RubyChina with React.js + redux + Bootstrap, and both projects support responsive layouts. I have to say it is an effective way to learn new knowledge. Both of these projects are suitable for those learning vue.js and react.js.

Vue.js + V2EX project

Code address: github.com/liuzhenange…

Demo: v2ex.liuzhen.me

Some introduction and learning materials about this project can be viewed here.

This article is about react.js.

React.js + RubyChina project

Code address: github.com/liuzhenange…

Demo: ruby-china.liuzhen.me

Project introduction

React-rubychina is a react-dom/react-redux/redux-router/redux/ES6 / redux-thunk/RubyChina clone.

React, REdux, ES6, and CSS frameworks use bootstrap. The back end utilizes ruby-China’s open API. Responsive layout is supported. Some functions are still being improved.

Development environment setup

Create-react-app install create-react-app my-app install create-react-app my-app install create-react-app my-app install create-react-app my-app Then NPM start is ready to run. Details about create-react-app can be found here.

Core Technology Framework
  • react
  • react-dom
  • react-router
  • redux
  • redux-thunk
  • react-md-editor
  • isomorphic-fetch
  • react-paginate
  • react-redux
  • marked
  • es6-promise
  • classnames

Study References

In the process of learning React, the react. js document does not do as well as Vue. According to do not necessarily right, also not convenient inquiry, after stepping on a lot of pits to share.

Good React Chinese document (the document query, but a lot of content writing too simple is not clear, and the content is not complete) : hulufei. Gitbooks. IO/React – tutor…

The React official documents in English: facebook. Making. IO/React/docs /…

React 英 文 版 : reactjs.cn/react/docs/…

Geek schools offer the React of Chinese document: wiki.jikexueyuan.com/project/rea…

Another fax documents in Chinese (this is full, but I don’t search) : www.phperz.com/article/15/…

React-guide.github. IO /react-route…

RubyChina API: ruby-china.org/api

ReacChina community (there are a lot of resources): react-china.org/

ES6 documentation: es6.ruanyifeng.com/#docs/intro

Story introduced: www.alloyteam.com/2015/09/rea…