这世间本就没有什么公平,有的,也不过就是些许灵光。剩下的,生来有就有,不过没有也无妨 – 不知名的小孩。

大家好,我是程序员芋仔。今天想和大家分享的是:我的公式化前端自学之路。在如今这个套路盛行,内卷严重的大环境下,一切皆可公式化。而所谓进大厂的捷径,也就在这只言片语中,且听我慢慢道来。

ps: 这篇被连续催更了。

被催更了

浅浅开脱一下:一个月在旅游,一个月在聊天,还有一个月,在交朋友。

当然也谈不上大佬,只能说马马虎虎算是一个还算会两招的聪明人吧。

入门

其实,在现在这个时代,技术入门的门槛或者说靠技术实现自己想要的产品的门槛是非常低的。小某书上经常就能看到,“我,一个产品经理,靠着 ai 上架了自己的人生 app”,“我,一个 ui,靠着 ai,耗时 2 天,上线了自己的第一款小程序”。

这里不得不感叹时代变迁的速度。我还记得我大学那会,没有某程,没有某哪儿,定酒店都还是靠现金,有没有房还得现场问,也没有某德,导航靠路牌,坐车全靠拦。虽然麻烦倒也还算过得去。

反观现在,到处都是信息,随便一搜,都是成百上千的教程,看似可选择的空间大了,实则每个人都还是被困在在自己的茧房中,其实同以前并无二致。

说回前端开发,我入门,全靠 3个 网站:

  1. w3school
  2. w3schools
  3. freecodecamp

其中,w3school 和 w3schools 是一个类型,都是所有知识的平铺罗列,该有的都有,不带任何个人色彩,但是有理论有实践。严格来讲,确实是一个还不错的入门学习网站。

如果比做武林秘籍的话,这两个网站,就像是五岳剑派的剑法,下限不低,但是上限也低,只能说中规中矩。

但是就像武侠小说学武一样,明明大家拿到的秘籍都是一样的,有些人是大师兄,而有些人只能是看门的。这其中的奥秘,在武侠小说中,是悟性。而在现实中,悟性太过悬乎,而且技术本身也没有武术那么难以修炼。所谓技术入门,还远远没有到拼悟性的程度。这个级别的学习,差别,其实无非就是熟练度罢了。

而看了 w3school 之后,你大概率会发现,看了,好像会了,过了一会又忘了。这是正常的,就像张三丰的太极剑,招式而已,并不配占据我们大脑的一片空间。

我这下全忘了,忘得干干净净了

这个阶段,重要的是在于使用。一招一式,不重要,重要的是要将他们融入我们的肌肉记忆,也就是夯实基础。

freecodecamp 就是一个非常好的夯实基础的方法(初学者建议看到 js 就可以了, jquery 可以不看, bootstrap 也可以不看)。做题,而且是自己做题,不是看着答案做题,而是自己思考去做题。这两者的区别是非常大的,所谓失之毫厘,谬以千里。自己思考得到的答案,和看答案之后自己记下来写的,和对着答案 copy 的,这三者的理解,在大脑中的记忆,可以说是天差地别。

而这,也是我最不推荐看着视频做项目的原因。一方面,视频慢,另一个,即便对着视频的代码打一遍,这中间的抉择和思考,也是悟不到的。

除非自己从无到有,这里为什么用 ref, 那里为什么一定要用 context,除非自己真的去实现,去思考,才能知其奥秘。这个非要用互联网黑话来说的话,就是悟性的量化。这个悟性并非那么玄奥,而是可以培养的,是可以量化的。自己思考,思考的越多,做的决策越多,看过的招式越多,悟性自然而然就会提上来。

到了这一步,就算是 html, css, js 三件套齐全了。理论上,现在的你,可以毫不客气的说,市面上的所有网页,你都能实现。

正所谓初生牛犊不怕虎,乱拳打死老师傅。学好 js,走遍天下都不怕。

其实 jq 我都可以不用, js 我就一把梭了

但是,双拳难敌四手,网页不仅仅是开发完就好了,也不是能做完就好了。而是要又快又好维护,性能又要好。这就是所有打工人都讨厌的既要又要,但是老板都喜欢的既要又要。面对所有的既要又要,我们永远都是上有政策,下有对策:折衷。

想要开发快,我们就不要看重过程,而是看重结果。这就是 React 和 vue,他们提供了 jsx 或者模版的写法,帮我们完成了数据修改后,操作 html 和 css 的过程,我们要关注的,就只剩如何处理数据。这也就是所谓的 “声明式语法”。而纯粹使用 js 操作 html, css 的方法,就是”命令式语法”。

那代价是什么呢?就是性能,凭什么数据改了,就有人帮我更新 html 和 css? 这个过程不是消失了,而是被隐藏了。vue 中是 defineProperty or proxy 收集依赖,react 中是 setState 把数据的改变告知框架。

你所谓的轻装出行,不过是有人在背后负重而行罢了。

代价就是负重而行的人,并不能按需助你。往往伴随着一些冗余的工作。这就是代价,vue 中更多的是初始化依赖收集时内存和时间的损耗。react 中更多的则是数据修改后,找到需要更新的组件的损耗。

所以不要说,react,vue 是为了提升页面性能,他们的出现,就是为了提高开发效率 (以便可以用更少的人,开发更多的活)。而代价,就是性能 (可能还包括了一些人的饭碗)。当然, 话不能说的太绝对,也有些场景下是提升了性能,毕竟直接使用 js 去操作 html/css, 是需要担心重绘和回流的。

所以初学者要不要学,必须学。别人都手握屠龙刀,倚天剑了,你功夫再高,也怕菜刀。更何况还是屠龙刀。你无忌哥哥看到屠龙刀都要避让三分。但是想必你心里也清楚,屠龙刀是不是天下无敌,也得看是谁握在手里。而我们大部分人,究其一生也只是普通人,远没有到摘花飞叶,即可匹敌的程度。

怎么学?一定是官网,一定是官网,一定是官网。

如果是以前,react 和 vue 刚出现那会,官方文档一塌糊涂,还是英文直接劝退一堆中国人的时候,那么现在,react 和 vue 的文档,就像是天阶斗技/地阶斗技一样,他们的珍贵就在于他们是带了灵魂印记的:自带一个老师,手把手,一句一句教你基本使用。(萧炎内心 os: 天阶斗技不要钱是吧)。

比如 react 的: 井字棋教学;

井字棋

比如 vue 的:入门十五式;

入门十五式

很多人会说,看不懂。找不到。只能说怪某度了,都是开发了,f 个 q 吧,问 google 或者 ai。

相信我,所有的问题,你在官方文档,都能找到答案。

但是也就像人不能一口吃成一个大胖子一样,你也不可能一次性就 get 到天阶功法的威力。要做的,就是认认真真看一遍,学会基础的用法。应付日常开发足以。

看完了,有点收获,但是好像有些地方看不懂,看不懂就对了,这可是天阶功法,别说你了,一次性完全看懂并且理解到位,无异于天方夜谭。

学会了一招半式,接下来就练,做你想做的任何东西,掘金,云音乐,个人主页,给喜欢的女孩子做个画廊,给舍友做个带饭小程序,给爸妈做个手机教程页面,给学校选课系统框框一顿改,给学校官网优化一下,给自己做个公众号页面,复刻一个自己喜欢的童年游戏,做个自己的旅行日志,给自己做个 ai 助手。别管他三七二十一,就是干,干,干。

什么,不会 nodejs? 那 google 会不会,官网找不找得到?(nodejs 官网不行,看看 nodejs 实战吧,或者 express.js koa.js 官网,配合 ai,搭个服务器绰绰有余)。什么,没有服务器?阿里云 99/年 了解下?纯纯的技术,没有什么是 ai + 官网解决不了的,如果有,换 chatgpt 吧,国产的几个确实还差那么一点点。

等熟练度够了,或者拿不准了,再回过头来看官方文档,相信我,每次看都会有不同的收获。

如果再不济,吃喝拉撒,做个吃了么,拉了么,喝了么的小程序也行。重要的就是提高熟练度。这里隆重向大家介绍一下我最新的项目: 今天你拉了么 小程序。

今天你拉了么

它就是一拍脑门做出来的,就是因为我老婆天天问我她昨天拉了没,但是要说到吹,那我可太会说了:

在中国,每10个人中,就有一个人被便秘困扰,使用 今天你拉了么 小程序,打通医疗系统,就医时直接一键同步粑粑信息。这将是一个千亿级的潜在市场!!!!

甚至 slogan 我都想好了:所有人都关心你挣的多不多,我们只关心你拉的健不健康! 欢迎富哥投资咨询!(ps: 这个项目王多鱼已经投了)

这项目我王多鱼投了

话说回来,至此,其实你已经是一门合格的前端开发工程师了。做做日常的开发,增删改查,完全不在话下。可以算是门派大师兄了,但是想想令狐冲吧,也是大师兄,如果一直在恒山派,那么终其一生最高成就也就是恒山派掌门了。而所谓掌门,也不过就是过眼云烟,沧海一粟罢了。

求职

技术学好了,能找到好工作了吗?

不能,不能,不能

说来也讽刺:代码写的好和找工作,能完成日常工作和拿 offer,几乎没有关系。这看似荒唐,但是又是现实。而在江湖里,每个人都是配角,跟大势做对,等于自断后路。

求职只看:面试结果。

绝大多数人的面试结果只取决于:

  1. 八股文理解和思考
  2. 项目做的好不好,项目做的难不难,面试讲(chui)的好不好
  3. 过往履历怎么样,有没有大厂背景,校招就是有没有实习经历,实习的是不是大厂
  4. 学校怎么样,是不是 双一流,是不是 211,是不是 985,是不是 top3

这里面,没有一条是和日常业务开发是相关的。正所谓面试造火箭,入职打螺丝。好在大家也习以为常,这条没毛病。

那么,其实所谓进大厂的捷径,就是增强这四个方面。

如果你是校招生,那么入门之后,就开始锤炼八股文,注意是锤炼,不是背诵。单靠背诵,是过不了这一关的,必须经得起反问,必须了解八股文背后的道理。如此,才算是真正掌握,这一条,免费的资料也不少,很多公众号都有这样的广告:什么 46k*16 进字节了, 什么 一次面试,让我见识到了基础天花板,什么 阿里内部资料,前端八股文,然后和让你添加某某老师,免费领取资料。

资料领到,剩下的要不要进一步咨询,看个人。当然,我的建议是不如咨询我,我这边的大厂朋友可太多了,还没有中间商赚差价 (^_^)。ps: 我的公众号:芋仔的前端视界,关注我,不迷路。

我的公众号

言归正题:不要排斥八股文的背诵,很多八股文之所以能够成为八股文,都有其独特的历史原因,而这部分原因,其实也是我们下一步进阶的很重要的一部分。每次进步最快的阶段,就是求职阶段,这也是因为八股文的背后,原理的学习,都是求职的必需品。一定要真正理解它,如此才能经得起反问。

毫不夸张的说,我在学生阶段进步最快的时间,就是理解面试八股的时候。

接下来:

找实习找实习找实习

学校一般的,从大一打二就先找小公司实习,以此为跳板,找大公司实习,再以此为跳板,找大厂正式。

学校不错的,直接找大厂实习,找不到的,就先找小公司实习,再以此为跳板,找大厂正式或独角兽 sp。

实习的时候,切记自己的目的,是跳板。意味着你做的事情,一定是可以丰富自己的简历的,也一定是要经得起推敲的。也一定是要发挥主观能动性自己上难度的。可以看看我的一些反面教材反思经验

附上我的例子:我是研一的时候开始学习前端的,入门,做自己喜欢的项目,然后看八股文,学习八股文,理解八股文的背后,面试,找实习,找大厂实习,有了实习和转正 offer 保底,秋招可谓是开挂一般,轻轻松松。

当然,我当时会这么做,也是因为经常向学校的学长学姐请教,不论是学校组织的求职分享,还是线下我去请他们喝茶,终归都能得到指点。学校差的,可以找更好学校的学长学姐或者相关从业人员获得更进一步的建议。

ps:这些资源,其实都比不上一场1对1的和在职大厂员工的沟通。如果有需要,可以联系我 (mxb151,非无偿, 添加务必注明来意),想要和哪个公司的聊,哪个级别的聊,都可以找我哈。除此之外,如果你已经没有时间做这么多的准备,可以找我给你突击一把,这也是我这几个月的一个产出。还有我合作方提供的真实实习和真实项目,也可以找我哈。

那,如果你已经是社招了,没有大厂经验,但是还想要进大厂。这个我确实没有相关经验,毕竟每个人的情况,都是不同的。我所能提供的,就是找人给你做做模拟面试分析分析欠缺和进阶方案(^_^)。

如果说,找实习,找大厂实习,跳板进大厂,是一条捷径。那么找仙人指路,可谓是捷径中的捷径了。只能说,学历没法改,但是其他的,都还有机会。

工作

前端这个技术,已经不像以前,今天一个框架,明天一个打包工具,后天一个 ts,今天一个状态管理,明天再来一个,相反,现在的前端技术,个人认为已经进入了一个底层技术已经固化的阶段。

比如打包工具:webpack, vite, rollup。或者 ruby 造的一些轮子时不时活跃一下

再比如框架:react, vue,几乎已经不存在技术选型

再比如格式化,lint, npm/pnpm 等包工具,再比如组件库,也都基本定型。

大部分公司的基建,都已经成熟的不能再成熟了。大到整个公司,小到一个部门,可能都有自己的一套工程化方案。

作为一个普普通通的业务开发,其实轮子都没得造。

但是,要是真的每天都做业务,那么轮到你的那一天,面评一定是:只会做业务,思考不够,看似 5年,实则是一件事重复了 5年。从而放入池子里,沦为备胎。

那么怎么破局呢?

只能说:一定要开窍早。

工作内容,它一定不能只服务于公司,也要想办法让工作内容服务于自己,成为自己下一次跳槽 (现在的环境,往往是被动跳槽) 的底气:

它可以是业务的复杂度,但是一定要可量化,一定要有自己的思考(虽然很 pua,但是dddd,我不是这个意思),复杂在哪里,怎么解决的,用了什么你独特的方法,降低了这个系统的复杂度,有没有开发 xx 插件,xx 扩展,解决这些问题?有没有看看业内的其他方案?

它也可以是作为项目负责人的经验,怎么推进这个项目的,工作如何划分的,难点有哪些,怎么解决的,性能如何,有没有做一些提效,性能优化的事情?

也可以是开源项目的参与与贡献,业务中碰到了什么问题,开源的框架存在什么问题解决不了,如何自己提 issue 解决问题,最终完善了框架,也解决了自己的问题。

也可以是辅助业务的技术项目 (卷,但是各行各业都卷,这就是大势),对业务的深入理解,辅助业务的技术项目,出发点是什么?痛点在哪里?收益如何量化。

除此之外,经常更新更新简历,出去面试面试,保持对市场的敏感度,保持自己的算法功底,才是真正的护城河。

其他的,向上管理,向下管理,早点抛弃身上的技术人的标签,做个中国人,会比端着技术人不搞人情世故要走的轻松的多。

除了这些,技术上的广度,一般可以通过 公众号以及掘金的碎片化来进行补充。而系统性、针对性的学习,可以通过阅读书籍来学习,往往碎片化的阅读,看完可能还是云里雾里。而书籍则会更系统一点。以下是我看过的一些觉得还可以的书籍:

  1. 《javascript 高级程序设计教程》,js 红宝书,实体书非常厚实,没有系统学习过 js 的,可以按需学习,一口气看完意义不大
  2. 《vue 原理与设计》,想要了解 vue 原理的,强烈推荐阅读。绝对的深入浅出,看完没有收获你找作者
  3. 《react 设计原理》,相比于上一本书介绍 vue 的,会相对粗糙一些,但也是为数不多的介绍源码的书籍了,对 react 源码有了解的一定不要错过。
  4. 《现代 javascript 库开发》,适合对写 npm 包的同学阅读
  5. 《javascript 设计模式和开发实践》,名字接近的有两本,不同作者写的,其中一个偏向于框架出现前的,相对比较老旧,但是也值得一看,相比之下更推荐腾讯团队写的那个,会更贴近现在。

那么对于技术的深度,比如项目中用的是 redux,完全可以看看源码后自己实现彻底掌握,从而在简历上写上精通 redux。比如我写的 《typescript 类型挑战通关手册》,直接简历上就是精通 ts 类型体操。那除此之外,比如 react-router,保留历史栈,增加过场动画,都可以进行深入研究,再比如 babel,精通 babel 原理,插件开发。如此,深度 + 广度 + 丰富的面试经验,想被刷掉都难。

最后

我建了一个前端抱团取暖公式化学习群,也邀请了我的一些大厂朋友们不定期的会在群内进行技术分享,也会有书单,源码解析,实习机会,内推机会等分享。如果失效,也可以添加我个人 wx(mxb151,备注加群) 联系进群。

公式化前端学习群

最后,前一段时间很火的公式化打野,我这边也分享一个公式化项目提问,可以看看有没有戳中你:

  1. 讲讲这个项目,出发点是什么,背景如何,你承担的角色是什么?
  2. 有什么难点,怎么解决的?还有什么其他的方案吗?
  3. 这个项目的收益、产出如何衡量,可以量化吗?
  4. 这个项目如果让你重新做,你会有什么改进的地方?

说到底,找工作也是公式化,进大厂也是公式化。而所谓的捷径也并不意味着不需要付出努力,依旧需要高强度的付出,有公式,只是让你事半功倍,而非躺平拿 offer。

最后,祝愿大家能在公式化的人生中都能活出不一样的精彩!

希望大家都能活出精彩的人生