在2017年，我曾經在建立任何前端專案上掙扎。
我會跟隨教程，充滿信心，但在試著獨立建構某些東西時卻遇上障礙。
快轉到今天：我是一名來自 Palantir 的資深前端工程師。
在這篇文章中，我分享7個最佳建議給那些想要進步的初級前端開發者。
建議1：建立堅實的基礎
如果沒有對HTML、CSS和JavaScript的穩固理解，你永遠無法成為一名資深前端開發者。
每一種前端技術都是建立在這些基礎之上的。
沒有這些基礎，理解框架和函式庫解決的問題會變得更加困難，以及有效地除錯。
建立這些基礎並不像聽起來那麼難。以下是一些入門資源：
-
MDN課程: 網路基礎的堅實基礎
-
FrontendMasters免費訓練營: 一個很好的起點，並附有實作練習
-
JavaScript Info: 建立強大JavaScript技能的必要資源，以便學習像React這樣的函式庫
建議2：大量練習
你可以看所有的教程並購買世界上所有的編程書籍，但在開始進行實際專案之前，你不會掌握技能。
建立專案有幾個好處：
-
經過困難的過程後，你能更好地記住事物
-
在真實世界情境中測試你的技能
-
開始看到常見的模式和解決方案
-
通過實際解決問題來確認你的理解
我推薦以下資源來進行練習：
-
Frontend Mentor: 不同階段的專案練習
-
Frontend Practice: 從真實公司重建真實網站
-
Frontend Projects: 不同階段的專案練習
-
JavaScript Mastery: 透過專案為基礎的方式掌握網頁開發的YouTube頻道
建議3：獲得代碼審查
寫出“可運行”的代碼是很容易的。
但，編寫可維護的代碼才是真正的挑戰。
所以，儘快尋求代碼審查（即讓別人檢視你的代碼並指出錯誤）。
以下是根據你的情況獲得代碼審查的方法：
-
情況1：你有隊友
保持你的代碼簡潔，然後請求審查。避免大型的拉取請求，這可能會讓審查者感到不知所措。
-
情況2：你沒有隊友
自我審查代碼有時會出乎意料地有效。將代碼放置幾週後，帶著新鮮的眼光回來查看。
-
情況3：你失業了
在Reddit或類似的社群中請求反饋，或隨時聯絡我進行免費審查。
💡 回覆這封電子郵件以獲得免費代碼審查。
建議4：閱讀和審查他人的代碼
審查他人的代碼是我改善自己技能的最佳方法之一。
當你審查別人的代碼時，你會：
-
學到新的技巧和提示
-
認識到一些模式可能會難以閱讀
-
培養對閱讀你代碼的人的同理心
作為初級開發者進行代碼審查會奇怪嗎？
一點也不奇怪！
即使作為初學者，你也可以問自己：“這段代碼清晰嗎？”如果不夠清晰，作者可能需要添加註釋或簡化。
如何找到代碼來審查：
-
情況1：你受僱
在可能的情況下進行代碼審查。如果正式的審查不是你團隊的組成部分，無論如何也可以查看代碼並做心理筆記。
-
情況2：你失業了
Reddit和GitHub都是找到代碼進行審查的好地方。
💡 查看這些大型、商用級React應用的範例。
建議5：了解最佳實踐
永遠不要停止學習。
理解最佳實踐能幫助你編寫更容易維護和擴展的代碼。
以下是我最推薦的資料：
-
網站：
-
CSS: Josh Comeau（CSS與React）、Ahmad Shadeed（CSS）、Kevin Powell（CSS）
-
React: Epic React
-
TypeScript: Total TypeScript
-
設計模式: Refactoring Guru、Patterns.dev
-
-
書籍：
-
編程： The Pragmatic Programmer、Clean Code（在這裡檢閱JS版本→ Clean Code JavaScript）
-
React： Advanced React
-
TypeScript： Effective TypeScript、Programming TypeScript
-
建議6：在多樣化之前精通1-2種工具
不要一周從React跳到Vue，然後再到Node.js。
這種路徑會導致失敗和缺乏精通。
如果沒有深入的知識，你將面臨被AI工具取代的風險。
以下是我的建議：
-
選擇一個焦點（前端或後端）
-
選擇一個框架（React、Vue、Svelte等）
-
堅持下去，直到你能有信心地建立專案
只有在此之後，再開始探索其他工具。
建議7：指導初級開發者
指導初級開發者可以將你的技能提升到更高的水平。
事實上，指導幫助我：
-
通過解釋來鞏固我的理解
-
增強自信，因為我意識到我知道的比我想像的多
如何找到初級前端開發者進行指導
尋找那些在六個月前和你一樣的人並幫助他們。
Reddit社群，例如r/FreeCodeCamp、r/learnjavascript和r/learnreact都是很好的起點。
總結
成為一名優秀的前端開發者並不需要天賦或數十年的練習。
你需要做的都是：
-
建立堅實的基礎
-
練習所學
-
隨時獲得代碼審查
-
閱讀和審查他人的代碼
-
持續學習最佳實踐
-
首先精通1-2種技術，再進行多樣化
-
指導那些比你初級的人
就是這樣。
如果你需要任何建議，DM我在X。
💡 本週建議
https://x.com/_ndeyefatoudiop/status/1853829900945256627
🐞 在這段代碼中找出問題
https://x.com/_ndeyefatoudiop/status/1853407616484995321
結束了🎉。
留下評論📩分享你最喜歡的建議（或新增一個）。
別忘了點個“💖🦄🔥”。
如果你正在學習React，下載我的101個React技巧和竅門書籍作為免費資源。
如果你喜歡這樣的文章，訂閱我的免費電子報，FrontendJoy。
如果你想要每日建議，可以在X/Twitter找到我。
原文出處：https://dev.to/_ndeyefatoudiop/how-to-level-up-your-frontend-skills-53j4
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式