https://github.com/supnate/react-geek-time

极客时间《React 从入门到精通》视频课程示例代码。
https://github.com/supnate/react-geek-time

Last synced: 1 day ago
JSON representation

极客时间《React 从入门到精通》视频课程示例代码。

• Host: GitHub
• URL: https://github.com/supnate/react-geek-time
• Owner: supnate
• Created: 2018-05-21T02:35:24.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2022-07-01T07:33:20.000Z (over 2 years ago)
• Last Synced: 2024-12-14T06:06:38.267Z (8 days ago)
• Language: JavaScript
• Homepage: https://codesandbox.io/s/github/supnate/react-geek-time
• Size: 12.6 MB
• Stars: 596
• Watchers: 25
• Forks: 205
• Open Issues: 3
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 极客时间：React 从入门到精通

### 所有课程已经更新完毕，感谢大家支持！🎉🎉🎉

本 Repo 包含了所有课程的演示代码，代码由 codesandbox.io 同步到本 Repo：https://codesandbox.io/s/6n20nrzlxz

通过 codesandbox.io 您可以在线修改演示代码尝试运行结果，无需本地部署。

[课程讲稿下载](https://github.com/supnate/react-geek-time/raw/master/GeekTime-React-Course.pdf)

# Demo 结构

如下图，左侧为所有代码，按课程顺序进行 Demo 的组织。右侧为演示界面，菜单显示了所有可运行的 Demo 链接。点击菜单可以看到运行的结果。

 

# Demo 列表

* 01 chat-app: 简单的 React 组件和交互演示

* 02 comment-box：评论框界面的组件拆分和实现

* 03 clock: JSX 语法演示

* 04 clock: 显示当前时间的组件，演示生命周期方法的调用

* 05 dom-diff：演示 DOM Diff 的算法原理

* 06 adv-tab-selector，withTimer: 高阶组件和函数作为子组件

* 07 locale-sample： 使用 Conext API 实现多语言切换

* 11 pure-reducer：纯 Redux 的使用

* 12 counter：在 React 中使用 Redux

* 13 async-action：Redux 异步 action，中间件的概念

* 14 org-action：如何组织 Redux 的 action 和 reducer

* 16 router-sample：路由不只是页面切换，更是代码组织方式

* 17.1 router-params：路由参数定义

* 17.2 nexted-route：嵌套路由

* 29.1 form-submit： 表单提交

* 29.2 form-submit-antd：使用 antd 的表单组件

* 30 dynamic-form：动态表单

* 31 list-page：列表页的翻页，搜索和缓存

* 33 multiple-request：页面多个请求的处理

* 35 wizard-sample：基于路由实现向导页面

* 36.1 layout1：常用布局的实现

* 36.2 layout2: 常用布局的实现

* 36.3 layout-resize：实现侧边栏可调整宽度

* 37.1 portal-example：使用 React Portals 实现的对话框

* 37.2 antd-dialog：使用 antd 实现对话框

* 40 dnd-sample：在 React 中实现拖放功能

* 43 reselect-sample：使用 reselect 避免重复计算

* 44 suspense：React 的异步渲染

# License

MIT