我想深入看看 web 前端,最好技术方案能够适配管理后台、前台产品、electron 和 phone 端使用。
基础储备:js 红宝书几年前看过两遍,es6 两年前粗略看过一次。react 最近看了一点点。感觉 react 自由度过大,我并不知道 webpack,redux,router,saga 这些,作为新手,停下功夫来看这些干扰了我的节奏,也不知道为什么要看这些,有些困惑。有啥靠谱一点的文档或者书,能够成体系的介绍的么 ?
我自己写过一些小的 react 功能,但是用 antd pro 做开发的时候,里面的各种概念好像我从来没看过 react 一样。又冒出一大坨的什么 react hooks 之类概念。体验真的差。
8 年经验的专职后端开发经验。
1
zhw2590582 2020-04-24 11:49:49 +08:00
红宝书虽然经典,但太过时了,还不如看 w3cschool 入门,再去 developer.mozilla.org 进阶
|
2
djoiwhud OP @zhw2590582 w3school 里面的内容太烂了。developer.mozilla.org 并没有介绍 react 这类前端框架。
|
3
skypyb 2020-04-24 12:03:22 +08:00 via Android
培训班视频请
|
4
maichael 2020-04-24 12:08:44 +08:00
hooks 你完全可以先不用,你可以当它是个语法糖(虽然心智模型会带来额外的压力),但是不用它完全不影响你写代码。
webpack 可以不用太深入去看,会配置知道个大概就行了,而且现在各种脚手架的完善程度,大多数情况下你都不需要去碰它。 router 本身没什么复杂的,特别是 4 之后,把它理解成组件就行了,redux 本身不复杂,就是个有限状态机。saga 稍微复杂点,但是如果只是用的话就还好。 |
5
abcbuzhiming 2020-04-24 12:19:25 +08:00
@jackrelative 请先搞清楚,你所谓的深入前端到底是要做什么?人家让你去 developer.mozilla.org ,因为那里是 Web 技术的基石,底层的原理,如果深入,这才是正道。结果你说“没有介绍 react 这类框架”?这算什么深入 Web 前端,你是想深入框架吧,深入框架很简单,官网文档,请,英文不熟额外加 google 翻译,请。但是这不是深入 web 前端。请先搞清楚自己要的是啥。
|
6
hyyou2010 2020-04-24 12:24:28 +08:00
个人肤浅理解:成体系的话,就是只看 react+redux+router,其他尽量都抛开。所有的都只看基础部分,然后串接成一个整体即可。
antd pro 做了大量封装,包含上述三者,知道数据流程,会增删模块即可 |
7
hyyou2010 2020-04-24 12:27:25 +08:00
我猜楼主是希望先总体把握 react 这一套体系,以后再到局部和细节
|
8
zhw2590582 2020-04-24 12:51:08 +08:00
你是想绕过 js 基础去深入 react 体系?那不就是不管原理去背 react api 而已吗,那有什么难的。
|
9
djoiwhud OP @hyyou2010 是的。我是想先整体的弄清楚全貌大概什么样的。但是,各种莫名其妙的概念一个接一个。还没有成体系的书介绍,一块一块割裂开的。
|
10
djoiwhud OP @maichael umi 、dva 这两呢。我感觉可能我不应该试图用 antd pro,这玩意的使用曲线真陡峭。看了一天 antd pro 官方的文档,也就是比没有略好一点。antdpro 里面冒出 umi 、dva 、webpack 、redux 、router 、saga 一连串的概念。
|
11
djoiwhud OP @zhw2590582 我本人有 8 年多后端开发经验,对 js 语言的理解应该是充分的。前两年还设计过基于 go+cgo+v7+js 的方案的项目。
|
12
azcvcza 2020-04-24 14:05:00 +08:00 1
react mvvm 视图框架,核心思想 f(state) -> view
react-router 路由,控制组件跳转 redux,非常基础,简单的状态管理仓库 至于你说的 antdPro,umi,dva 是阿里基于 react 封装起来的框架 webpack,类似于 java 和 maven 一样的存在,管理众多工具,前端工具链目前最大头的一个 saga,因为 redux 太过于简单,且不满足异步的事件订阅,发布,更新状态,有人就写了一个支持异步的状态库 hooks 的话,是 react 提出的新特性,满足‘逻辑上’ 而非组件的复用,以往逻辑复用大家要么用 hoc,要么用 renderProps,或者其他。你不想用的话,react 又不是把生命周期编程范式干掉了,照着生命周期编程范式来写最多就是啰嗦,又不会写不出 |
13
jrtzxh020 2020-04-24 15:22:50 +08:00 via iPhone
别用 umi 搞一堆乱七八糟的概念,绕来绕去,真的服了。怎么简单怎么来,别用那些高度抽象和封装的东西。
|
14
raistlin916 2020-04-24 15:28:28 +08:00
react 只看 hooks 相关,把 hooks 吃透就行了,原来的 component class 只是 react 推广时期的权宜之计,后面都不会用到。这方面推进 antd 已经很慢了,Material-UI 老早就把所有例子全部替换成 hooks 了。
hooks 主要是心智模型更靠近函数式编程,不是一般而言调用 api 那么简单。 再学个 rxjs 你就是资深前端开发。 redux 知道怎么回事就行。 |
15
BasIrs 2020-04-24 16:16:52 +08:00
@zhw2590582 如果 8 年后端经验连 js 基础都不会的话那也太....
|
16
hyyou2010 2020-04-24 16:55:39 +08:00 1
@jackrelative
我曾经跟你同样困惑,我的教训就是如前所述,先抛开并不影响大局的东西,防止太多概念术语,先用基本部分串接出整体。 我再大言不惭继续推荐下: 1,看 react 基础部分,抛开高级部分和 hooks 2,看 react-router 基础部分,知道其本质是 if/switch 语句即可 3,看 redux,连异步都不用看,什么 saga 之类。 4,react+router+redux 串出一个小 demo,比如 todolist 5,这个时候你就可以总体把握了,再根据需要扩展细节 我不赞同首先去钻研诸如 js 细节,或者 hooks,或者 antd pro 。这些无助形成整体。 另外我多次推荐这篇文章,有助于理清发展历程,使你有信心先抛开 webpack: https://zhuanlan.zhihu.com/p/38209210 再另外,es6 远比比 js 红宝书更适合,阮一峰那本就很好。 |