Code Monkey home page Code Monkey logo

react-template-easily's Introduction

react-template-easily

描述:

react-template-easily 是一套以react技术搭建的项目模板,适用于移动端H5, webapphybirdApp开发。其中包含常用20+常用组件,精细计算的rem,以及诸多项目的实践。

URL:

https://github.com/jinjiaxing/react-template-easily

技术栈

  • react:16
  • react-dom:16
  • react-router-dom:4
  • redux:3.7.2
  • redux-thunk:2.2
  • react-redux:5.0.6
  • sass
  • postcss
  • webpack:3.8.1
  • iscroll:5
  • ...

目录结构和文件说明

client 客户端主目录,PS:为将来SSR时加入server做准备,所以叫做client
	--actions redux全部action放入其中
		--commonAction.jsx 通用的action放入其中
		--pageHomeAction.jsx 首页Demo的Action
		
	--common 公用util文件夹
		--constant 常量
			--CommonActionName.jsx action全部名称
			--Constant.jsx 常量变量集合
			--StatisticConstant.jsx 自定义其他常亮
		--img 公共图片
		--style 公共css文件
		--utils 公共util类
			--Common.jsx 所有公用方法以及rem计算均在此文件中
			
	--component 全部react组件
		--common 公共组件自定义了一些常用组件
			--组件持续更新中
		--business 放入自身业务组件(没建立者文件夹,大家可自行建立)
		
	--pages 存放全部页面组件
		--PageHome demo首页组件
			--img 存放每个页面的图片
			--_pageHome.scss 每个页面独立的样式文件
			--PageHome.jsx 组件jsx文件
			
	--reducers 全部reducers放入此文件夹
		--commonReducer.jsx 通用reducer
		--mainReducer.jsx 用于连接各reducer
		--pageHomereduces.jsx demo主页的reducer
		
	--service http请求类库
		--Service.jsx	用于ajax/jsonp请求的方法均在此处,应用了promise
		
	--sotre
		--sotre.jsx 
		
	--app.jsx 相当于页面的父容器组件进行一些通用处理
	
	--index.html html文件
	
	--router.jsx 入口文件,也是路由文件

开始使用

git clone https://github.com/jinjiaxing/react-template-easily.git
npm install
npm run dev
浏览器访问:0.0.0.0:8080

发布

npm run release 或 sh ./build.sh

开发人员

react-template-easily's People

Contributors

jinjiaxing avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.