7個月,4000+人,500+源碼筆記,誠邀你參加源碼共讀~

大家好,我是若川。按照從易到難的順序,前面幾期(比如:validate-npm-package-name、axios工具函數)很多都只需要花2-3小時就能看完,并寫好筆記。

但收獲確實很大。開闊視野、查漏補缺、升職加薪。已經有400+筆記了~有的人因為參加活動學以致用,得到了公司的1000元獎勵。

從8月份到現在3月份了。每周一期,一起讀200行左右的源碼,撰寫輔助文章,截止到現在整整6個月了。

由寫有《學習源碼整體架構系列》20余篇的若川【若川視野公眾號號主】傾力組織,召集了各大廠對于源碼感興趣的同學共同參與,每周一起學200行左右的源碼。目前近3000人參與。

為了能幫助到更多對源碼感興趣、想學會看源碼、提升自己前端技術能力的同學。

這事也不賺錢,但也算是盡全力了,花費了很多時間在上面。當然現在還有很多問題:比如參與度不高,需要持續迭代優化。雖然很難,但目前沒有放棄的想法,堅持做難且正確的事情

掃碼加我微信 ruochuan12 ,發送源碼即可進微信群參與學習。

242fe2d0f848a9515b7dca7b5f92ac32.png

1常見問題

Q: 我工作年限比較短,能參與活動嗎?會比較吃力嗎?
A: 可以。23屆(目前大三)的小姐姐都寫了10次筆記。一般推薦按從易到難的順序學習,相對不難,有問題可以交流討論。

Q: 我目前不會vue、不會vue3、不會react、不會Node.js 可以參與嗎?
A: 可以。跟技術棧不是強相關,主要是原生JS和Node.js。Node.js 基本是每個前端必學,可以邊學邊查。有不懂的隨時在群里提問。重點是學會看源碼,之后進步就會很大。

Q: 我現在比較忙,一時沒時間參與,交筆記有時間限制嗎?
A: 目前沒有限制。

Q: 必須交筆記嗎?
A: 目前不是必須,但我推薦看完了一期,記筆記。寫上當時的收獲、總結和感受。

Q: 活動收費嗎?有懲罰嗎?
A: 目前不收費。目前沒有懲罰,后續可能要求每人進群后半個月內至少提交第一次筆記

本文持續更新。

2從易到難推薦學習順序

為了降低難度,促進大家學習。由10組組長傾力從易到難重新整理學習順序。

基本和技術棧不是強相關,主要是原生JS和Nodejs。

推薦大家按順序循序漸進學習,查漏補缺,夯實基礎提高閱讀源碼的能力,提升前端技術能力。對于不熟悉調試的同學可以看我的這篇文章:新手向:前端程序員必學基本技能——調試JS代碼

  1. 第24期【vue2 utils】: 初學者也能看懂的 Vue2 源碼中那些實用的基礎工具函數

  2. 第19期 【axios/utils】axios 源碼中10多個工具函數

  3. 第23期【vue this】: 為什么 Vue2 this 能夠直接獲取到 data 和 methods ? 源碼揭秘!

  4. 第7期【validate-npm-package-name】: https://www.yuque.com/ruochuan12/notice/p7

  5. 第14期【promisify】: 面試官:請實現一個通用函數把 callback 轉成 promise

  6. 第2期【@vuejs/shared】: 初學者也能看懂的 Vue3 源碼中那些實用的基礎工具函數

  7. 第22期【dotenv】: 面試官:項目中常用的 .env 文件原理是什么?如何實現?

  8. 第16期【only-allow】: 從 vue3 和 vite 源碼中,我學到了一行代碼統一規范團隊包管理器的神器

  9. 第25期【debounce】: https://www.yuque.com/ruochuan12/notice/25

  10. 第21期【await-to-js】: https://www.yuque.com/ruochuan12/notice/p4

  11. 第20期【install-pkg】:Vue團隊核心成員開發的39行小工具 install-pkg 安裝包,值得一學!

  12. 第26期【classnames】: https://www.yuque.com/ruochuan12/notice/p26

  13. 第10期【configstore】: https://www.yuque.com/ruochuan12/notice/p10

  14. 第3期【vue-next-release】: Vue 3.2 發布了,那尤雨溪是怎么發布 Vue.js 的?

  15. 第8期【mitt、tiny-emitter】: 發布訂閱

  16. 第6期【update-notifier】: https://www.yuque.com/ruochuan12/notice/p6

  17. 第13期【open】: 每次啟動項目的服務時,電腦竟然乖乖的幫我打開了瀏覽器,100行源碼揭秘!

  18. 第18期【delay】面試官:請手寫一個帶取消功能的延遲函數,axios 取消功能的原理是什么

  19. 第11期【vue-dev-server】: 尤雨溪幾年前開發的“玩具 vite”,才100多行代碼,卻十分有助于理解 vite 原理

  20. 第9期【create-vue】: Vue 團隊公開快如閃電的全新腳手架工具 create-vue,未來將替代 Vue-CLI,才300余行代碼,學它!

  21. 第12期【@antfu/ni】: 尤雨溪推薦神器 ni ,能替代 npm/yarn/pnpm ?簡單好用!源碼揭秘!

  22. 第1期【vue-devtools】: 據說 99% 的人不知道 vue-devtools 還能直接打開對應組件文件?本文原理揭秘

  23. 第15期【element-new】: 每次新增頁面復制粘貼?100多行源碼的 element-ui 新增組件功能告訴你減少重復工作

  24. 第17期 【js-cookie】https://www.yuque.com/ruochuan12/notice/p17

  25. 第5期【koa-compose】:50行代碼串行Promise,koa洋蔥模型原來是這么實現?

  26. 第4期【co】: https://www.yuque.com/ruochuan12/notice/p4

3流程圖一覽

簡單說就是四步:

  1. 選擇其中一期開始,看任務。

  2. 看輔助文章、看源碼。

  1. 微信群交流討論,寫筆記,寫總結、收獲。

  2. 語雀討論區提交筆記。

9038484d4282c11c9c0486df16868071.png

4讀者評價

簡單選擇了三個筆記中的感想。

評價一

川哥組織的這個活動,給我最大的影響就是我對待源碼的態度發生了轉變。以前源碼給我的感覺是“可遠觀而不可褻玩焉”,但是其實只要你認真讀過一期,源碼就會變成良師益友。你可以坐下來傾聽他的思想,并從中受益良多,甚至可以和他交流,提出自己的想法,直至參與共建讓源碼更好。

評價二

川哥舉辦的源碼調試給我帶來了什么?

  1. 開始嘗試寫筆記
    a. 源碼我都懂,讓我說出來或者寫出來,蒙了

  2. 更注重細節
    a. 以前看源碼就囫圇吞棗的過一遍

  3. 更注重應用場景
    a. 以前:原來這個方法是這樣實現的啊
    b. 現在:看下測試用例,都是怎么使用的,某個判斷是為了解決什么問題
    總之
    是一個老手,那么現在川哥給了你一個交流的平臺,去溫故而知新。
    是一個新手,千里之行始于足下,有群里川哥和大佬們的幫助,勇敢邁出第一步。
    寫筆記真是一個令人頭疼的東西。

評價三

我最近看了幾篇,川哥選的庫都很精妙啊,老手可以梳理體系,新手可以了解現代工程化,進階架構師必經之路啊。
特別是這幾篇 create-vue、koa-compose、co、vue-dev-server,我都是熬夜看的,太起勁了

5點擊閱讀原文查看

公眾號文章無法更新,點擊閱讀原文,本文持續更新

最后再次邀請你進源碼群,一起學習源碼

可以掃碼加我微信?ruochuan12?進群,拉你進群,一起學習共同進步。

11f9ab6d328e9484d1655b43fc8f4d32.png

微信公眾號訂閱號改版,你可能經常看不到我的消息推送。

如果不想錯過我的公眾號推送,可以點擊上方卡片——點擊更多(...)——設為星標,就不容易錯過了。感謝~

f2c991d034f22b9403747aa7099cf54c.png

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/274840.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/274840.shtml
英文地址,請注明出處:http://en.pswp.cn/news/274840.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

火焰和煙霧的訓練圖像數據集_游戲開發者是煙霧和鏡子的大師

火焰和煙霧的訓練圖像數據集Video games are incredible. They transport us to new worlds, allow us to partake in otherwise impossible situations, and empower us in our every day lives. Games can make us feel like a part of something bigger than ourselves, per…

平衡樹SPLAY

一個比線段樹代碼還要又臭又長的數據結構,各式各樣的函數,咱也不知道別人怎么記住的,咱也不敢問 SPLAY的性質 1.某個節點的左子樹全部小于此節點,右子樹全部大于此節點 2.中序遍歷splay輸出的序列是按從小到大的順序 (…

POJ 2696 計算表達式的值

時間限制: 1000ms內存限制:65536kB描述有些語言中表達式的運算符使用字符串表示,例如用mul代表*,用div代表/,用add代表,用sub代表-,用mod代表%。輸入第一行為表達式的個數n。其余n行每行一個表達式,表達式由…

為支持兩個語言版本,我基于谷歌翻譯API寫了一款自動翻譯的 webpack 插件

大家好,我是若川。持續組織了6個月源碼共讀活動,感興趣的可以點此加我微信 ruochuan12 參與,每周大家一起學習200行左右的源碼,共同進步。同時極力推薦訂閱我寫的《學習源碼整體架構系列》 包含20余篇源碼文章。歷史面試系列本文來…

全球 化 化_全球化設計

全球 化 化重點 (Top highlight)Designing for a global audience can feel daunting. Do you localize your product? Or, do you internationalize your product? And what does that even entail?為全球觀眾設計可能會令人生畏。 您是否將產品本地化? 還是您將…

springMVC_數據的處理過程

1、DispatcherServlet&#xff1a;作為前端控制器&#xff0c;負責分發客戶的請求到 Controller 其在web.xml中的配置如下&#xff1a; <servlet><servlet-name>dispatcherServlert</servlet-name><servlet-class>org.springframework.web.servlet.Dis…

面試體驗:Facebook 篇(轉)

http://www.cnblogs.com/cathsfz/archive/2012/11/05/facebook-interview-experience.html 2012-11-05 08:20 by Cat Chen, 23266閱讀, 121評論, 收藏, 編輯 Google、Microsoft 和 Yahoo 都是去年的事情了&#xff0c;接下來說說今年…

JavaScript 新增兩個原始數據類型

大家好&#xff0c;我是若川。持續組織了6個月源碼共讀活動&#xff0c;感興趣的可以點此加我微信 ruochuan12 參與&#xff0c;每周大家一起學習200行左右的源碼&#xff0c;共同進步。同時極力推薦訂閱我寫的《學習源碼整體架構系列》 包含20余篇源碼文章。歷史面試系列JavaS…

axure低保真原型_如何在Google表格中創建低保真原型

axure低保真原型Google Sheets is a spreadsheet, just like Microsoft Excel.Google表格是一個電子表格&#xff0c;就像Microsoft Excel一樣。 Most people associate it with calculating numbers. But Google Sheets is actually great for organizing your ideas, making…

Weblogic EJB 學習筆記(3)精

編輯實體bean的高級課程 1. 怎樣開發主健類 ejb的主健類主要用做持久存儲和ejb容器中的唯一標識符. 通常主健類的字段直接映射到數據庫中的主健字段. 如果主健只是由單個實體bean字段組成.且其數據類型是基本的java類.如string,則bean作者不必開發自定義的主健類. 只需要在配置…

Lerna 運行流程剖析

大家好&#xff0c;我是若川。持續組織了6個月源碼共讀活動&#xff0c;感興趣的可以點此加我微信 ruochuan12 參與&#xff0c;每周大家一起學習200行左右的源碼&#xff0c;共同進步。同時極力推薦訂閱我寫的《學習源碼整體架構系列》 包含20余篇源碼文章。歷史面試系列Lerna…

手動創建線程池 效果會更好_創建更好的,可訪問的焦點效果

手動創建線程池 效果會更好Most browsers has their own default, outline style for the :focus psuedo-class.大多數瀏覽器對于&#xff1a;focus psuedo-class具有其默認的輪廓樣式。 Chrome’s default outline styleChrome瀏覽器的默認輪廓樣式 This outline style is cr…

C++builder enum類型

C/C code #pragmaoption push -b-enumTThreadPriority { tpIdle, tpLowest, tpLower, tpNormal, tpHigher, tpHighest, tpTimeCritical }; //這是字節型的.理論上說這是可能的最小整形.可以是1Byte, 2Bytes, 4Bytes...#pragmaoption pop#pragmaoption push -benumTThreadPriori…

chrome瀏覽器世界之窗瀏覽器的收藏夾在哪?

今天心血來潮&#xff0c;用一個查重軟件刪除重復文件&#xff0c;結果把chrome瀏覽器和世界之窗瀏覽器的收藏夾給刪除了&#xff0c;導致我保存的好多網頁都沒有了&#xff0c;在瀏覽器本身和網上都沒有找到這兩個瀏覽器默認的收藏夾在哪個位置&#xff0c;只好用DiskGenius 把…

Vue3究竟好在哪里 等推薦

話不多說&#xff0c;這一次花了幾小時精心為大家挑選了30余篇好文&#xff0c;供大家閱讀學習&#xff0c;提升自己的技術視野以及擴展自己的知識儲備。本文閱讀技巧&#xff0c;先粗看標題&#xff0c;感興趣可以都關注一波&#xff0c;一起共同進步。前端從進階到入院框架原…

eazy ui 復選框單選_UI備忘單:單選按鈕,復選框和其他選擇器

eazy ui 復選框單選重點 (Top highlight)Pick me! Pick me! No, pick me! In today’s cheat sheet we will be looking at selectors and how they differ. Unlike most of my other cheat sheets, this will focus on two components (radio buttons and checkboxes) side by…

過濾詞

<?xml version"1.0" encoding"GB2312"?>-<wordList> <word>,</word> <word>.</word> <word><</word> <word>></word> <word>?</word> <word>/</word> <…

VS2010 VC Project的default Include設置

http://blog.csdn.net/jeffchen/article/details/5491435 VS2010與以往的版本一個最大的不同是&#xff1a;VC Directory設置的位置和以前的版本不一樣。VS2010之前&#xff0c;VC Directory的設置都是在IDE的Tools->Options中設置的&#xff1b;VS2010改為&#xff0c;分別…

初級中級高級_初級職位,(半)高級職位

初級中級高級As a recent hire at my new job, as expected, a lot of things seemed scary and overwhelming. The scariest part was not the unfamiliarity with certain tasks or certain tools, but in communicating with higher-level coworkers, managers and bosses. …

如何寫好技術文章(看張鑫旭老師的直播總結

大家好&#xff0c;我是若川。持續組織了6個月源碼共讀活動&#xff0c;感興趣的可以點此加我微信 ruochuan12 參與&#xff0c;每周大家一起學習200行左右的源碼&#xff0c;共同進步。同時極力推薦訂閱我寫的《學習源碼整體架構系列》 包含20余篇源碼文章。歷史面試系列本文是…