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 → QxQstar → react-demo

QxQstar / react-demo

Licence: other
一个实际项目(OA系统)中的部分功能。这个demo中引入了数据库，数据库使用了mongodb。安装mongodb才能运行完整的功能

Programming Languages

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

Labels

reactnodejsreact-routerreact-redux

Projects that are alternatives of or similar to react-demo

Redux First History
🎉 Redux First History - Redux history binding support react-router - @reach/router - wouter
Stars: ✭ 163 (+77.17%)
Mutual labels:  react-router, react-redux
Imooc React
慕课网 React 视频课程源代码
Stars: ✭ 203 (+120.65%)
Mutual labels:  react-router, react-redux
Ecommerce Reactjs
Full stack ecommerce online store application
Stars: ✭ 164 (+78.26%)
Mutual labels:  react-router, react-redux
V2 Universal Js Hmr Ssr React Redux
⚡ (V2) Universal JS - Server Side Rendering, Code Splitting and Hot Module Reloading ⚡
Stars: ✭ 147 (+59.78%)
Mutual labels:  react-router, react-redux
ts-react-boilerplate
A very opinionated (React/TypeScript/Redux/etc) frontend boilerplate
Stars: ✭ 43 (-53.26%)
Mutual labels:  react-router, react-redux
Express Webpack React Redux Typescript Boilerplate
🎉 A full-stack boilerplate that using express with webpack, react and typescirpt!
Stars: ✭ 156 (+69.57%)
Mutual labels:  react-router, react-redux
Alldemo
🍑 2020全栈学习Demo大合集 包含最新 hooks TS 等 还有umi+dva,数据可视化等实战项目 (持续更新中)
Stars: ✭ 189 (+105.43%)
Mutual labels:  react-router, react-redux
React Login
A client side implementation of authentication using react.js for my blog on medium. This is the second part of my previous blog on how to implement scalable node.js server.
Stars: ✭ 105 (+14.13%)
Mutual labels:  react-router, react-redux
awesome-web-react
🚀 Awesome Web Based React 🚀 Develop online with React!
Stars: ✭ 31 (-66.3%)
Mutual labels:  react-router, react-redux
spring-boot-react-ecommerce-app
eCommerce application based on the microservices architecture built using Spring Boot and ReactJS.
Stars: ✭ 221 (+140.22%)
Mutual labels:  react-router, react-redux
React Admin
基于antd、redux-observable、redux-thunk、react-router响应式SPA脚手架，后台管理系统demo. 权限管理，用户管理，菜单管理。无限级菜单，下拉树形选择框
Stars: ✭ 141 (+53.26%)
Mutual labels:  react-router, react-redux
cnode-react
a web app for cnode.org with react + react-router + react-redux
Stars: ✭ 23 (-75%)
Mutual labels:  react-router, react-redux
Create React Server
Server & middleware for React + Router + Redux with Server Side Rendering
Stars: ✭ 139 (+51.09%)
Mutual labels:  react-router, react-redux
Slack Patron
Log and view all Slack messages.
Stars: ✭ 157 (+70.65%)
Mutual labels:  react-router, react-redux
Cwg React Starter
Pre-configured and Ready to use React Starter App. To save time in settings things up for new project. Almost everything needed is already configured. Just clone and start developing without wasting time in doing same stuffs for every project. (#codewithghazi)
Stars: ✭ 122 (+32.61%)
Mutual labels:  react-router, react-redux
Todo Redux Saga
Todo app with Create-React-App • React-Redux • Redux-Saga • Firebase • OAuth
Stars: ✭ 184 (+100%)
Mutual labels:  react-router, react-redux
Dva React Worms
dva新手综合教程
Stars: ✭ 70 (-23.91%)
Mutual labels:  react-router, react-redux
React Demo Gather
react demo合集，有自己写的，也有在学习过程中觉得很好的demo收集的，持续更新中
Stars: ✭ 97 (+5.43%)
Mutual labels:  react-router, react-redux
React Sight
Visualization tool for React, with support for Fiber, Router (v4), and Redux
Stars: ✭ 2,716 (+2852.17%)
Mutual labels:  react-router, react-redux
rgxp
Regular Expression Collection (ReactJS, Redux, React Router, Recompose, NodeJS, Express)
Stars: ✭ 62 (-32.61%)
Mutual labels:  react-router, react-redux
View All Similar Projects ➔

安装

进入my-app目录，然后在命令行中输入npm install

运行

在my-app目录下，npm start

注意

由于这个demo接入了数据库mongodb，所有要安装mongodb才能运行完整的功能!!!(员工管理和部门管理中用到了数据库)。安装了mongodb还需要启动 mongodb 还有很多不足的地方会持续改进

技术栈

  • React v15.6.2
  • react-redux
  • redux
  • react-router-dom
  • webpack
  • nodeJs
  • mongodb
  • axios

项目架构

.
├─ exampleImg/                  # 截图
├─ note/                        # 学习笔记
├─ my-app/                      # 源码目录（开发都在这里进行）
│   ├─ config/                  # 服务配置文件
|   |── controller              # 处理网络请求
│   ├─ model/                   # mongoose Model
│   ├─ route/                   # nodeJs 路由配置
│   ├── schema/                 # mongoose Schema
│   ├── scripts/                # 启动服务的文件
│   ├── src/                    # react代码从这里开始
│   │   ├─ components/          # 全局组件
│   │   ├─ css/                 # 全局css样式
|   |   |── global/             # 全局方法
|   |   |── pages/              # 页面
|   |   |     |── att/          # 考勤分组模块
|   |   |     |── attendance/   # 通讯录模块
|   |   |     |── department/   # 部门管理模块
|   |   |     |── holiday/      # 假期管理
|   |   |     |── member/       # 员工管理
|   |   |── router/             # router
|   |   |── store/              # redux
|   |   |── App.css
|   |   |── App.js
|   |   |── index.css
|   |   |── index.js            # 入口

学习笔记

关于react的学习笔记都在note文件夹下面，[如果要看整理之后的笔记可以移步我的博客]: http://www.cnblogs.com/QxQstar/

截图

通讯录 通讯录-公司职员列表截图 假期管理 假期管理-假期类型列表截图 考勤分组 考勤分组-分组列表截图 选择人员 选择人员弹窗 员工管理 员工列表 部门管理 部门管理列表

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