Giter Club home page Giter Club logo

antd-admin's Introduction

Antd Admin

React Ant Design dva

GitHub issues PRs Welcome MIT js-standard-style

演示地址 http://antd-admin.zuiidea.com

特性

  • 基于reactant-designdvaMock 企业级后台管理系统最佳实践。
  • 基于 Antd UI 设计语言,提供后台管理系统常见使用场景。
  • 基于dva动态加载 Model 和路由,按需加载。
  • 使用roadhog本地调试和构建,其中 Mock 功能实现脱离后端独立开发。
  • 浅度响应式设计。

更新日志

4.3.9

2017-12-27

  • 更新antd3.0.3,以及其它主要库,并解决升级带来的兼容问题。
  • 尽可能的保持`antd`的设计语言。
    

4.3.7

2017-10-30

4.3.5

2017-09-04

4.3.4

2017-09-04

  • 更新roadhog1.2.1,修复闪屏问题。
  • 修复 build css 未压缩#529,classname 未 Hash#477
  • 更新登录成功使用 router 跳转#479

4.3.0

2017-07-30

  • 更新roadhog1.0.0-beta.7,得益于[email protected],编译速度不减。
  • 基于使用 roadhog 的 dll 插件,开发时编译耗时减半。
  • 新增打包时按项目版本号生成文件目录。#449
  • 更新eslint,并适当修改了.eslintrc

More Change Log

开发构建

目录结构

├── /dist/           # 项目输出目录
├── /src/            # 项目源码目录
│ ├── /public/       # 公共文件,编译时copy至dist目录
│ ├── /components/   # UI组件及UI相关方法
│ │ ├── skin.less    # 全局样式
│ │ └── vars.less    # 全局样式变量
│ ├── /routes/       # 路由组件
│ │ └── app.js       # 路由入口
│ ├── /models/       # 数据模型
│ ├── /services/     # 数据接口
│ ├── /themes/       # 项目样式
│ ├── /mock/         # 数据mock
│ ├── /utils/        # 工具函数
│ │ ├── config.js    # 项目常规配置
│ │ ├── menu.js      # 菜单及面包屑配置
│ │ ├── config.js    # 项目常规配置
│ │ ├── request.js   # 异步请求函数
│ │ └── theme.js     # 项目需要在js中使用到样式变量
│ ├── route.js       # 路由配置
│ ├── index.js       # 入口文件
│ └── index.html
├── package.json     # 项目信息
├── .eslintrc        # Eslint配置
└── .roadhogrc.js    # roadhog配置

文件夹命名说明:

  • components:组件(方法)为单位以文件夹保存,文件夹名组件首字母大写(如DataTable),方法首字母小写(如layer),文件夹内主文件与文件夹同名,多文件以index.js导出对象(如./src/components/Layout)。
  • routes:页面为单位以文件夹保存,文件夹名首字母小写(特殊除外,如UIElement),文件夹内主文件以index.js导出,多文件时可建立components文件夹(如./src/routes/dashboard),如果有子路由,依次按照路由层次建立文件夹(如./src/routes/UIElement)。

快速开始

克隆项目文件:

git clone https://github.com/zuiidea/antd-admin.git

进入目录安装依赖:

#开始前请确保没有安装roadhog、webpack到NPM全局目录, 国内用户推荐yarn或者cnpm
npm i 或者 yarn install

开发:

npm run start
打开 http://localhost:8000 #端口在package.json中cross-env后加上 PORT=8000指定

构建: 详情

代码检测:

npm run lint

FAQ

  • 项目打包后如何部署? #269

  • 如何做权限管理? #384

  • 如何使用 mock.js 模拟接口,怎么使用线上接口? #348

  • 如何使用 Iconfont,如何使用本地的 svg 图标? #270

  • 怎么按版本打包,上线时不影响正在访问的用户? #449

  • windows 处理 CRLF?参考

    git config --global core.autocrlf false

参考

用户列表:https://github.com/dvajs/dva/tree/master/examples/user-dashboard

dashboard 设计稿:https://dribbble.com/shots/3108122-Dashboard-Admin (已征得作者同意)

截屏

web

移动

antd-admin's People

Contributors

zuiidea avatar superlbr avatar pmg1989 avatar sorrycc avatar dos1in avatar zhangpenglin avatar catest avatar nazarlitvin avatar iversonwool avatar afc163 avatar dkvirus avatar dong894 avatar hausir avatar jackple avatar p2227 avatar xland avatar maple-ro avatar paranoidjk avatar chenkang084 avatar terminalqo avatar the-wang avatar 0nese7en avatar xx1595140265 avatar darcyaf avatar codeif avatar blackboyhc avatar zlotus avatar quanpower avatar nelsonkuang avatar silentred 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.