React17+React Hook+TS4 最佳实践 仿 Jira 企业级项目

  [复制链接]

2116

主题

2130

帖子

3万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
37384
admin 发表于 2021-4-2 22:02:53
38610 148

React17+React Hook+TS4 最佳实践 仿 Jira 企业级项目

React17+React Hook+TS4 最佳实践 仿 Jira 企业级项目
; ?% |' y0 I/ i
3 |6 k( D9 g2 B* d
React17 + React Hook + TypeScript4 已成为大型React 项目质量保证的代名词
+ {" B/ j; q  |) r' l3 Z; n
更是 2021年优秀 React 开发者必备的技术。本课程将通过完成一个功能强大的任务管理项目,带领大家掌握最佳实践,全方位提升开发效率、开发质量和技术能力。
% R6 o  F' _0 j  h* z( I+ b8 H
解锁 React + TS 高阶用法,突破前端成长瓶颈

, {4 u' Z( `0 Z! \; \0 U
高清无密码,尽在IT直通车论坛!
, x( c/ J* y/ `2 w, I
课程目录5 J5 x; j, m, M5 U/ k( U. `
1-1 课程导学.mp4
4 B, z6 _( }0 a* K2-1 用 Create React App 初始化项目.mp4% `8 x7 y& G( E* }# ^" R9 g
2-2 配置 eslint、 prettier 和 commitlint 规范工程.mp4
3 [4 P0 E+ o- O! X: R0 r2-3 对比常见 Mock 方案 配置 JSON SERVER.mp4
- T6 f$ M0 j: P# \" [7 g* k1 `3-1 用 JSX 列表渲染开发工程列表页面.mp4
0 ?0 ?8 _& E1 }# L$ K3 e3-2 用状态提升分享组件状态,完成工程列表页面.mp41 o+ X! G+ B( b2 N6 \6 l- [/ M" U
3-4 学习自定义Hook - 用useDebounce减少工程搜索请求频率.mp4. h* m. p0 T( ]+ D0 q9 j
4-1 为什么我们需要TS - 真实场景学习 TS 的必要性.mp43 m4 A, g% T( k% y4 T1 i- j% K
4-2 将项目列表页面JS改造成TS,增强类型,减少Bug.mp4
0 Q  D; W, W5 J% {4-3 TS知识梳理、总结与提高.mp42 o* M2 R% h% R) D- L& J" V
4-5 学习泛型,用泛型增强useDebounce类型灵活性.mp40 ?0 p0 h. n% h, U
4-6 作业练习 - 用 Hook + TS + TS泛型实现useArray.mp4
  v5 n  h, R) Q8 S6 f& J& ^5 B4-7 作业解答 - ⽤ Hook + TS + TS泛型实现useArray.mp4) L, ]  x7 z5 k9 _
5-1 用React表单、TS的类型继承和鸭子类型实现登录表单.mp48 P; H; x) \- B" N; t/ a
5-2 连接真实服务端 - 专属开发者⼯具介绍与安装.mp4- d; ?9 `0 T' w6 x4 s
5-3 来自讲师的重要提示:5-2 补充.mp4( p( V8 ^. v7 a: z' e4 Z9 t
5-4 JWT原理与auth-provider实现.mp4
7 o! G& L* K8 p; F5-5 用useContext存储全局用户信息.mp4
4 G( S5 k' V( H: }. Q8 X! E4 {9 G5-6 用useAuth切换登录与非登录状态.mp4
6 x" H5 C: v7 o4 n& R6 s5-7 用fetch抽象通用HTTP请求方法,增强通用性.mp4
! i  V# d0 Q/ O' X' b5-8 用useHttp管理JWT和登录状态,保持登录状态.mp4/ H' ]& E+ S; A7 w+ h1 l+ d
5-9 TS的联合类型、Partial和Omit介绍.mp4& H" l* C  L  \' `' _
5-10 TS的Utility Types-Pick、Exclude、Partial和Omit实现.mp4
/ p1 @# z3 l6 X. g, ^) u4 w$ `+ [6-1 安装与使用 antd 组件库.mp4
" Y8 Q5 t' ]% ~6-2 为什么我们需要CSS-in-JS方案 -通过传统CSS缺陷学习CSS-in-JS必要性.mp40 ]* y6 E6 S& {4 B# n  s
6-4 最受欢迎的CSS-in-JS方案 - Emotion的安装与使用.mp4( B6 n; u; O9 U9 `  N8 n
6-5 用Grid和Flexbox布局优化项目列表页面 .mp4# n: ?$ }  u. v  l8 E
6-6 用CSS-in-JS状态工程创建自定义组件:Row组件实现.mp4+ v, Q. Q1 r- \6 Z* T
6-7 完善项目列表页面样式.mp4+ p3 q+ i/ g+ T
6-8 清除前面课程留下的警告信息.mp4
& I2 |; x4 p$ R6 |7 U9 g7-1 给页面添加Loading和Error状态,增加页面友好性.mp4
6 B( R- e2 ?! ~8 k6 g6 L) X7-2 用高级 Hook-useAsync统一处理Loading和Error状态 .mp4
+ L2 {. O+ D' f8 U; D! t7-3 登录注册页面Loading和Error状态处理,与Event Loop详解.mp4( S/ ^( v! g0 D9 |7 U
7-4 用useAsync获取用户信息.mp4
- r1 I! C3 a+ u1 U" Q" G: I7-5 实现Error Boundaries,捕获边界错误.mp4  U$ U: I# N: O5 z  h7 I) F
8-1 ⽤useRef实现useDocumentTitle - useRef与Hook 闭包详解(上).mp4
* q8 f7 J# u8 N' D. {0 m- [8-2 ⽤useRef实现useDocumentTitle - useRef与Hook 闭包详解(下).mp4& n1 K6 [9 Q0 Z% L5 ]( R
8-3 添加项目列表和项目详情路由.mp4
9 r+ P" p) B2 `2 L) H8-4 添加看板和任务组路由.mp4. b5 e  G7 B! Y5 T4 y6 A9 A, _
8-5 初步实现 useUrlQueryParam 管理 URL 参数状态.mp4
( _; ~6 {( {" W; C8 Z9 S8-6 用useMemo解决依赖循环问题 - Hook的依赖问题详解.mp4
. L, k7 }. W+ d( p  |6 T; h8-7 完成URL状态管理与JS中的 iterator讲解.mp4
  y9 z* C4 D0 c6 d# v, [9-1 实现id-select.tsx解决id类型 难题.mp4
" ?8 O. d$ U) s- ~* N2 s% {  l) _) ?4 s9-2 抽象user-select组件选择用户.mp4+ w8 Q1 E9 X! s/ n; X: y
9-3 用 useEditProject 编辑项目.mp4
/ y; t4 n3 x1 Y7 [' h9-4 编辑后刷新-useState的懒初始化与保存函数状态.mp4
: ?# B% r" j! X' v# Q( q. r- ^7 U) @9-5 完成编辑后刷新功能.mp4, ^) R" S* ^4 G6 v, W) O7 g
10-1 useCallback应用,优化异步请求.mp4
4 X) g& V$ @" z- I, }/ x& q10-2 状态提升,组合组件与控制反转(上).mp4
$ O3 P% D3 H! P4 ^10-3 状态提升,组合组件与控制反转(下).mp4- r1 b9 Z! x5 y1 r6 K8 p6 H/ g* z
10-4 合并组件状态,实现useUndo.mp4
0 k% v" Y, I" k& |; R10-5 用useReducer进行状态管理.mp46 C0 m* z  w/ m/ p/ ~
10-6 redux用法介绍.mp4
% k) u7 M* v2 I5 C# O0 Z3 O10-7 react-redux 与 HoC.mp4; Z& ~& S8 C  K& {6 f, `
10-9 为什么我们需要redux-thunk?.mp48 K. h1 f$ M2 L( n
10-10 配置redux-toolkit.mp4* e& e$ s; `( y2 W1 H
10-11 应用redux-toolkit管理模态框.mp4" |0 }' E% p# l- _
10-12 用redux-thunk管理登录状态.mp4
. y0 d4 V+ y! N, r8 J11-1 用url参数管理项目模态框状态.mp4( F2 U. Q0 I; `5 H
11-2 用 react-query 来处理 -服务端缓存-.mp4( g4 P7 O0 ^% q- F8 }) a
11-3 类型守卫,用useQuery缓存工程列表.mp4
5 g1 Z' H1 M/ I11-4 编辑和添加工程功能(上).mp4" i# n8 j& Y/ _/ P+ j
11-5 编辑和添加工程功能(下).mp4! o1 }  q1 F3 o& o
11-6 抽象乐观更新通用hook.mp4. p; M9 X% W( D2 ?+ c; J# x: m
11-7 修复url多余参数.mp4
7 V  v& B6 c7 p9 z5 Q9 R11-8 跨组件状态管理方案总结.mp40 l+ a0 s- m7 Q9 `1 [
12-1 解决前面的 3 个 Bug.mp4
, |6 [& W$ _" O) }, o. V( D12-2 看板列表开发准备工作.mp4
7 Q2 m0 r- ^7 ~+ n& V12-3 看板列表初步开发.mp4
* @* V; |5 Q  g12-4 添加task, bug 图标.mp4  ]: W, u+ c& W; ?' W7 X/ a) P
12-5 添加任务搜索功能.mp4$ k: U( b7 _1 z9 Y( B
12-6 优化看板样式.mp42 b' I: G& t4 t8 H. G9 ?
12-7 创建看板与任务.mp4
0 p' v% y; y7 T12-8 编辑任务功能.mp4
' I4 l, D% ~7 {% b12-9 看板和任务删除功能.mp4. y0 b4 Q+ h3 Y+ |) k
12-10 拖拽实现(上).mp4  O: Q: c. n$ H5 Q
IT直通车论坛新增8节课 20210411更新
1 B. r) D' K& c- s) T& l* Q12-11 拖拽实现(下) .mp4
& d) o+ I0 \( E+ z8 t: @4 R12-12 拖拽持久化(上) .mp45 M/ O7 U! |8 j" D- ^- k* n
12-13 拖拽持久化.mp4
- v' X  w2 ^7 x3 q7 e12-14 排序乐观更新 .mp4
% M) [  X, Y4 l: h+ _8 Z9 i12-15 任务组页面.mp4
# o* N/ l3 [  Y' |. k12-16 任务组页面(下) .mp4
2 o# p9 g7 D- a9 r  `12-17 完成popover .mp4! N/ ?9 b; G9 h3 y
12-18 开发完成,部署页面 .mp4
* G3 _* t8 a. L. i7 ~2 s) F* R4 g2 M% m# N8 v8 O
代码资料分支9 A+ U+ t7 C7 g( E+ h2 i( l
react-ts-hook-jira-develop.zip
, s. O7 V' U% ]2 v5 n$ |react-ts-hook-jira-master.zip
9 f. y" I! w0 K2 Ireact-ts-hook-jira-preview.zip* v- S/ {- F/ u% W  b
react-ts-hook-jira-redux-toolkit.zip
# @7 X% F& F9 d$ U7 s2 T7 w) j
/ t4 {" S$ `: a, z; z0 K/ u5 |" S0 |视频截图
# e, D7 Q. f( Y& Q
9 J& M. g# Y2 b' ]: ^* M6 b0 J9 o资源存放>百度网盘
7 |; e) B3 N4 ]: W, S; y  }
8 j, C0 V8 c; z3 h9 {下载地址- Z+ j$ S6 Q# G9 X
游客,如果您要查看本帖隐藏内容请回复

- y* K; X: [7 LVIP会员全站免金币- O3 o5 E% @8 L& {
IT直通车已为全国各地程序员提供上千G课程资源$ `% k3 o8 O! |
如您需要购买本站VIP会员,请点击「开通VIP」享受全站资源免金币无限制下载!
, b" h( M8 v, w1 C! K* u. \4 Q6 n. X
失效反馈
/ v: F# S. S0 [9 s: FIT直通车所有资源都存放在自己注册的百度网盘,失效可修复,确保持续可用
5 J1 _0 g$ u4 c. M. C  B4 k如您需要的资源链接提示失效,请尽情反馈给我们,将在收到反馈后尽快修复「点击反馈
+ i$ g" k; }  P! @7 S; s) ~$ M0 W& Q/ {0 x8 S5 m
获得帮助1 o: y& {; K1 Y9 H5 c( s
需要帮助吗?点击网站右侧在线客服,7X12小时在线!
5 |. F. G' S& Q  I+ o! ?5 N% r& X. k4 \$ R8 T, }
- h! u  [4 ^6 O% i, @7 I1 @
回复

使用道具 举报

郭光庆 发表于 2021-4-2 22:05:55 来自手机
祝IT直通车越办越好
回复

使用道具 举报

尹泽汐猩 发表于 2021-4-2 22:29:33
不错 又更新教程了
回复

使用道具 举报

daydreamleo 发表于 2021-4-3 15:52:40
楼主发贴辛苦了,谢谢楼主分享!我觉得IT直通车论坛是注册对了!
回复

使用道具 举报

同感丶 发表于 2021-4-5 14:12:42
楼主辛苦了!
回复

使用道具 举报

clydee 发表于 2021-4-6 15:18:43
一直想要,又没钱,感谢
回复

使用道具 举报

wzyu638116 发表于 2021-4-7 07:30:27
看了几节课程,对我帮助很大
回复

使用道具 举报

乐态思 发表于 2021-4-7 17:30:39
111111111111111
回复

使用道具 举报

制菜参力 发表于 2021-4-8 08:06:28 来自手机
感谢~~~~~~~~~~~~
回复

使用道具 举报

眠眠不觉量 发表于 2021-4-8 11:16:42 来自手机
楼主发贴辛苦了,谢谢楼主分享
回复

使用道具 举报

懒得打字嘛,点击右侧快捷回复 AD:IT直通车VIP会员全站免金币下载
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

遇到问题联系客服

安全保证百分百处理 

如您充值或开通会员后资源无法下载

本站有售后服务,联系客服修复即可

[联系客服]-[会员充值]

更多课程

由于QQ吞消息严重,网站启用邮件对接VIP会员服务,有事请发邮件到 wangkefuwu@outlook.com

关于本站

VIP介绍 加入我们

售后服务

QQ客服 Email邮件

网站声明

IT直通车(www.itztc.com)是一个IT视频教程、软件、书籍资源整合分享平台
站内所有资源均来自于互联网,版权归属原资源作者,如无意侵犯您的版权,请联系我们删除处理。

Archiver|手机版|小黑屋|IT学习网 |网站地图

Powered by Discuz! X3.4  © 2001-2013 IT直通车 ICP证:粤ICP备13026616号 增值电信业务经营许可证:粤B2-20140196

返回顶部 返回列表