Code Monkey home page Code Monkey logo

chinese_checkers's Introduction

Chinese Checkers **跳棋

女朋友最近对这个跳棋游戏有些上瘾啊,想在某东上面买一副跳棋回来陪她下,可是要几十啊,算了,自己写个吧,又不是很难的东西,2333333333。

好吧,我承认,这简单玩意确实可以不需要 React 等全家桶。

目录

详情可参阅 package.json

  • React 15.3.1
  • Redux
  • React Router
  • Fetch
  • Webpack
  • ES6 + Babel
  • Node.js >=6.4.0
  • Socket.io
  • Sass
# 推荐切换到淘宝 npm 源
npm set registry https://registry.npm.taobao.org/

npm install

请升级到 >= node 6.4 + >= npm 3.10 环境

npm run libs

在这个项目中初始化的时候,您必须先运行一次,以获得打包好的 libs; 原因参照:用DllPlugin来优化webpack打包速度

npm run dev
npm run deploy
npm run server

需要注意的是:在开发调试的过程中,默认不用单独启动该服务。在dev模式下已经用子进程启动此服务了。见 config/app.webpack.config.js 130行。

├─build                      # 打包编译出来的app
├─config                     # 配置文件夹
│  ├─app.config.js           # 整个应用的一些配置,包括 xhr、应用信息等的
│  ├─app.webpack.config.js   # 前端中调试开发、打包的 webpack 配置
│  ├─libs.webpack.config.js  # 前端的 libs 配置
│  └─manifest.json           # 前端 libs 打包的缓存信息
├─dist                       # 前端编译的静态资源文件夹
├─doc                        # 文档、项目设计等
├─client                     # 前端开发文件夹
│  ├─assets
│  │  ├─imgs
│  │  └─scss                 # 自制的 ui 组件库
│  ├─components              # 组件,与页面强相关
│  ├─redux                   # redux
│  │  ├─actions 
│  │  ├─reducers 
│  │  └─store 
│  ├─routers                 # router 的集散地,主要 connet
│  ├─services                # 整个应用的服务,主要跟 xhr 相关的
│  ├─utils                   # 公共的一些方法
│  ├─views                   # 主要页面布局,木偶组件
│  ├─app.js                  # app 启动
│  └─index.html              # 静态页面基页
├─server                     # 服务端开发文件夹
├─test                       # 测试
├─.babelrc                   # Babel 转码配置
├─.eslintrc                  # ESLint 配置
├─.gitignore                 # (配置)需被 Git 忽略的文件(夹)
├─package.json               # 不解释
└─README.md                  # 不解释
  • 本示例项目秉承最佳实践,地实现代码分离/复用
  • 优化目录结构,更好的模块分离
  • 引入服务层统一管理 XHR 请求(Fetch 实现)
  • 引入 路径别名 实现优雅的加载模式
  • 引入 React Hot Reload,支持热替换
  • 使用 Sode.js 粗略实现了一套类 Express (天差地别的,但好歹是自己实现的)
  • 使用 Socket.io 支持在线对战

HTML/CSS 参考

CSS 开发规范

详情可参阅 .eslintrc JavaScript 编码规范

commit ####Type explain

feat | 新功能
fix | 修补bug
docs | 文档(documentation)
style | 格式(不影响代码运行的变动)
refactor | 重构(即不是新增功能,也不是修改bug的代码变动)
test | 增加测试
chore | 构建过程或辅助工具的变动

####Example

git commit -m "<type>(<scope>): <subject>"
# practical examples
git commit -m 'docs: 增加了git msg规范'

###包含功能

  • 重来
  • 悔棋

chinese_checkers's People

Contributors

anchengjian avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

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