project instruction - TonyHey/yiimobile_demo GitHub Wiki

Features

• react
• react-router
• redux
• koa2
• eslint
• webpack
• moment
• babel

Application Structure

|—— client 				        # Application source code
|	|—— assets				# Assets required to render components
|	|—— common				# Global Reusable code
|	|	|—— api				# Ajax request interface
|	|	|—— components			# Global Reusable Presentational Components
|	|	|—— lib			        # Static library
|	|	|—— redux			# Redux state container (use by store, actions, reducers, constans)
|	|	|—— root			# Application root container & redux dev tool
|	|	└── tool			# Global Reusable util code
|	|—— containers				# Application view containers
|	|	|—— home			# Single view container
|	|	|	|—— components           # components that home includes
|	|	| 	|—— less                # Style for home
|	|	|	└── index.js            # home view-controller(containers)
|	|	└── ...				# Other view containers ...
|       |── public                              # Public resources
|       |       |── img                         # imgs
|       |       |── style                       # styles
|	|── index.js				# Bootstrap main application routes with store
|	└── routes.js				# Application routes with require.ensure
|—— dist					# Production code after build
|	|—— client
|	└── server	
|—— server					# Server source code
|	|—— controllers				# Server interface function 
|	|—— lib					# library function
|	|—— middlewares				# Isomorphic middlewares 
|	|—— routers				# Public route loading method
|	|—— config.js				# Public configuration
|	|── index.js				# Bootstrap server
|	|── server.dev.js			# configuration for Development environment
|	└── server.prod.js			# configuration for Production environment
|—— views					# Main HTML page container for app
|	└── tpl
└── webpack					# configuration for webpack
	|── CodeCheckPlugin.js
	|── webpack.dev.config.js
	└── webpack.prod.config.js

Debug

npm run dev   			# enables nodemon for the server, will serves app at localhost:8080,
				# you can change the port in /server/config.js

Learning Resources

• https://github.com/davezuko/react-redux-starter-kit
• https://github.com/enaqx/awesome-react
• https://github.com/kriasoft/react-starter-kit
• https://github.com/chikara-chan/react-isomorphic-boilerplate
• https://dinosaurscode.xyz/nodejs/2016/06/28/nodejs-koa2-tutorial/
• https://www.terlici.com/2015/03/18/fast-react-loading-server-rendering.html

keywords: koa2, react, isomorphism, redux, webpack