「能說說為什麼學習前端嗎，背景和動機是什麼？」
這個問題是我最近一個月最多被問到的一個問題。
仔細想想，自己已經接觸前端 2 年了，正正好好兩年。兩年前的現在，我還是個大一的學生，和大部分人一樣，年輕有迷茫。看不到未來的路在何方。在此之前，我學了一段時間 Python 網絡爬蟲，做過幾個腳本。一個偶然的機會，認識了 @Paul，通過交流之後，了解到他也是自學的前端。他有一個自己獨立開發的個人空間，那個時候我想著我以後也要自己做一個那樣的站點。那個時候，通過寫博客，認識到了很多人，一起做獨立博客的人。要知道，在當下，自媒體公眾號已佈天蓋地，而真正通過寫獨立博客的人已經很少了。
剛步入一個新領域的時候，多多少少是困難的，尤其是自學。大部分人可能會跟著某個視頻教程學習。而我卻不是，我是通過直接修改別人做的比較優秀的主題來學習的。我承認我大多數在亂改，但是更多也是從中學習到了什麼。那時候我邊學習基礎知識，邊改主題，也就是實踐。想要達到一個預期，也需要通過搜索引擎去認知一些更深入的知識。所以那個時候，我並沒有從基礎開始學，那樣太慢了，也會感覺到很枯燥，而我又是一直都是通過興趣驅動型的。我一直認為只有興趣的驅動，才能學得更快，學的進去。也正是因為這樣，那段時間我過得很快樂，每天都在學習和做自己的項目，那段時間我移植、修改了多個 Typecho 的主題。也是那段時間，我愛上了開源。受 Phodal 的影響，最後也完成 GitHub 百天連擊。（那些黑歷史在 GitHub 仍能找到
那年暑假，我正式開始了前端工程化項目的學習。前端工程化的入口點是比較難找的，從純原生到框架的跳躍。需要接觸到前端一系列工具鏈，以及對整個目錄結構的認識，模塊化的拆分。而那段學習的過程，我是通過 B 站的全棧之巔發布的視頻學習的。這是一位非常優秀的 UP 主，視頻也十分優質，但是關注的人有點少。我向後入門了 Vue 2，以及 Express、NestJS。學習的過程不是一味的照搬照抄，一味的跟著教程去做是沒有什麼收獲的。最重要的是舉一反三。師傅只會帶你入門，修行還是得靠個人。之後，我便開始獨立實踐，開始做一個新的項目。而這就是我的初心，做一個個人空間，我想我是時候可以去完成它了。
獨立開發是一個比較困難的事情，遇到問題不知道應該去問誰。除了通讀官網的文檔，有時還是不能解決問題，多上 Stack Overflow 看看，原來還是有一些 trick 的方法。其次是項目的結構，前期的架構不當，會導致後續維護的火葬場。也是因為這樣，第一代空間沒上線就腹死胎中了。而現在的版本則是學習參考了他人的項目結構上作成的。雖然到了現在還是比較雜亂的，對於後續維護來說不是一件友好的事情。最主要的原因還是最初沒有羅列一個大綱。單元測試在重構過程中十分重要，但是我至今不會編寫用例，找不到一個切入口。
那年下半，我一直都在和 Vue 2 打交道，寫了很長多的練手 demo。就是這樣一個沒有任何實戰經驗的小白，陰差陽錯的進了一家公司實習。對於沒有 React 經驗的我來說，無疑是一種挑戰。但是那是一個非常好的機會，我沒有錯過。這就是我，不管自己行不行，我都去試一試了，需要自己把握機會。我周圍有這樣一些人，也有正在學習前端的人，當你伸出援手，拉他做一些項目，並且願意去帶他，而他卻會回絕並稱自己能力不夠。是啊，既然你能力不夠，為什麼又不去珍惜這些機會呢。換做是我，我一定會接受。畢竟在此之前，我多麼希望也有人說，嘿，一起做項目？
學習一個新的框架需要多久。何為學習，何為學會。如果是會使用一個框架，那麼可能從零到會只需要一天。而我那時學習 React 也就一天。我學會了嗎，不，我只是會用了。學習是個漫長的過程，至今我仍不敢確切的說我學會了 React。React 是一個十分優秀的框架，按官方的說法，它稱不上框架，而只是一個庫 (Library)，相比 Vue 2 來說，他沒有 Router、沒有 Store。所以他的生態也出現了好多同類別的不同的選擇。React JSX 的寫法更加友善，相比之下我慢慢地轉向 React，之後的一年直到現在，我都已 React 為主要技術棧。React JSX 的寫法一直刻在我心裡，我想著哪天 Vue 也能和 React 平起平坐，畢竟它也是我第一個接觸的框架。Vue 3 的到來讓我看到了曙光，這簡直是 React Hooks 的翻版，但是經過多次的使用之後，對於生態上還是有點失落。很多庫從 Vue 2 遷移過來，對 TypeScript 支持度差，JSX 的寫法實在糟心。官方對於 JSX 的寫法也沒有明確說明。（畢竟官方一直推崇的是 Template 寫法，在 Compile 階段靜態優化，讓 Runtime diff 上更加快速。但是我還是喜歡 JSX 的寫法）
對 TypeScript 的了解在那時候也醞釀很久了。一直想找個機會使用它。正巧，接到了一個外包，他的後端字段非常的亂，如果使用 JavaScript 的話，對後端數據的處理上比較難，難在所有的 Type 都是 any（指 JSON parse 之後）。我使用了 JSON2TS 工具把 JSON 的 interface 轉出，這樣就比較好寫了。然後又學習到了 Vue 下的 TS 寫法，以及 Vue Class Components 等等。
之後的故事都在往期文章中可以看到，就先不寫了。可以從這裡開始閱讀：
最後#
可以從往期回憶中了解更多：