注意:本文點擊文末閱讀原文可查看文中所有鏈接。
我正在參加掘金年度人氣作者投票活動,大家有空可以加微信群幫忙投票,感謝大家!
想起今天還沒發文,就開放下微信群二維碼,大家掃碼進群讀源碼和幫忙投票吧。群里不定期發些紅包。
如果群滿了就掃碼加我微信ruochuan12,回復源碼拉你進群。
為了能幫助到更多對源碼感興趣、想學會看源碼、提升自己前端技術能力的同學。
1提交筆記
【喜大普奔】筆記可以自己提交到語雀討論區啦\~[2]
所有筆記存放在語雀討論區[3]。
現在已經有200多份了。
2常見問題
Q: 我工作年限比較短,能參與活動嗎?會比較吃力嗎?
A: 可以。23屆(目前大三)的小姐姐都寫了7次筆記。一般推薦先讀Vue3工具函數,相對不難,有問題可以交流討論。
Q: 我目前不會vue、不會vue3、不會react、不會Node.js 可以參與嗎?
A: 可以。跟技術棧不是強相關,主要是原生JS和Node.js。Node.js 基本是每個前端必學,可以邊學邊查。有不懂的隨時在群里提問。
Q: 我現在比較忙,一時沒時間參與,交筆記有時間限制嗎?
A: 目前沒有限制。
Q: 必須交筆記嗎?
A: 目前不是必須,但我推薦看完了一期,記筆記。寫上當時的收獲、總結和感受。
Q: 活動收費嗎?有懲罰嗎?
A: 目前不收費。目前沒有懲罰,后續可能要求每人進群后半個月內至少提交第一次筆記。
3從易到難推薦學習順序
為了降低難度,促進大家學習。由10組組長傾力從易到難重新整理學習順序。**推薦大家按順序循序漸進學習,查漏補缺,夯實基礎。**提高閱讀源碼的能力,提升前端技術能力。不知道怎么調試的看這篇文章:新手向:前端程序員必學基本技能——調試JS代碼[4]
第7期【validate-npm-package-name】: https://www.yuque.com/ruochuan12/notice/p7[5]
第19期 【axios/utils】axios 源碼中10多個工具函數[6]
第2期【@vuejs/shared】: 初學者也能看懂的 Vue3 源碼中那些實用的基礎工具函數[7]
第14期【promisify】: 從22行有趣的源碼庫中,我學到了 callback promisify 化的 Node.js 源碼實現[8]
第16期【only-allow】: 從 vue3 和 vite 源碼中,我學到了一行代碼統一規范團隊包管理器的神器[9]
第20期【install-pkg】:Vue團隊核心成員開發的39行小工具 install-pkg 安裝包,值得一學![10]
第3期【vue-next-release】: Vue 3.2 發布了,那尤雨溪是怎么發布 Vue.js 的?[11]
第6期【update-notifier】: https://www.yuque.com/ruochuan12/notice/p6[12]
第8期【mitt、tiny-emitter】: 發布訂閱[13]
第10期【configstore】: https://www.yuque.com/ruochuan12/notice/p10[14]
第13期【open】: 每次啟動項目的服務時,電腦竟然乖乖的幫我打開了瀏覽器,100行源碼揭秘![15]
第18期【delay】面試官:請手寫一個帶取消功能的延遲函數,axios 取消功能的原理是什么[16]
第11期【vue-dev-server】: 尤雨溪幾年前開發的“玩具 vite”,才100多行代碼,卻十分有助于理解 vite 原理[17]
第9期【create-vue】: Vue 團隊公開快如閃電的全新腳手架工具 create-vue,未來將替代 Vue-CLI,才300余行代碼,學它![18]
第12期【@antfu/ni】: 尤雨溪推薦神器 ni ,能替代 npm/yarn/pnpm ?簡單好用!源碼揭秘![19]
第1期【vue-devtools】: 據說 99\% 的人不知道 vue-devtools 還能直接打開對應組件文件?本文原理揭秘[20]
第15期【element-new】: 每次新增頁面復制粘貼?100多行源碼的 element-ui 新增組件功能告訴你減少重復工作[21]
第17期 【js-cookie】https://www.yuque.com/ruochuan12/notice/p17[22]
第5期【koa-compose】:50行代碼串行Promise,koa洋蔥模型原來是這么實現?[23]
第4期【co】: https://www.yuque.com/ruochuan12/notice/p4[24]
4流程圖一覽
簡單說就是四步:
按照順序選擇其中一期開始,看任務。
看輔助文章、看源碼。
微信群交流討論,寫筆記,寫總結、收獲。
語雀討論區提交筆記。

5讀者評價
簡單選擇了三個筆記中的感想。
評價一
川哥組織的這個活動,給我最大的影響就是我對待源碼的態度發生了轉變。以前源碼給我的感覺是“可遠觀而不可褻玩焉”,但是其實只要你認真讀過一期,源碼就會變成良師益友。你可以坐下來傾聽他的思想,并從中受益良多,甚至可以和他交流,提出自己的想法,直至參與共建讓源碼更好。
評價二
川哥舉辦的源碼調試給我帶來了什么?
開始嘗試寫筆記
a. 源碼我都懂,讓我說出來或者寫出來,蒙了。更注重細節
a. 以前看源碼就囫圇吞棗的過一遍
更注重應用場景
a. 以前:原來這個方法是這樣實現的啊
b. 現在:看下測試用例,都是怎么使用的,某個判斷是為了解決什么問題
總之
是一個老手,那么現在川哥給了你一個交流討論的機會,去溫故而知新。
是一個新手,千里之行始于足下,有群里川哥和大佬們的幫助,勇敢邁出第一步。
寫筆記真是一個令人頭疼的東西。
評價三
我最近看了幾篇,川哥選的庫都很精妙啊,老手可以梳理體系,新手可以了解現代工程化,進階架構師必經之路啊。
特別是這幾篇 create-vue、koa-compose、co、vue-dev-server,我都是熬夜看的,太起勁了。
本文持續更新。點擊閱讀原文查看鏈接。
參考資料有省略
[1]
具體投票方式點此查看。: https://www.yuque.com/ruochuan12/notice/juejin
[2]【喜大普奔】筆記可以自己提交到語雀討論區啦~: https://www.yuque.com/ruochuan12/topics/2
[3]語雀討論區: https://yuque.com/ruochuan12/topics
[4]新手向:前端程序員必學基本技能——調試JS代碼: https://juejin.cn/post/7030584939020042254