工具和測試
一旦你開始對核心 Web 技術(如 HTML、CSS 和 JavaScript)的程式設計感到舒適,並且開始積累更多經驗,閱讀更多資源,學習更多技巧和竅門,你就會開始遇到各種各樣的工具,從 JavaScript 框架到測試和自動化工具,以及更多其他工具。隨著你的 Web 專案變得越來越大、越來越複雜,你將希望開始利用其中一些工具,制定一個可靠的工具鏈,為你的開發流程賦予超能力。
最重要的是,我們仍然需要將跨瀏覽器支援放在首位,並確保我們的程式碼遵循最佳實踐,使我們的專案能夠在使用者用來瀏覽 Web 的不同瀏覽器和裝置上執行,並且能夠被殘疾人使用。
確定應該使用哪些工具可能是一個困難的過程,因此我們編寫了這套文章來告訴你有哪些型別的工具可用、它們可以為你做什麼以及如何使用當前業界最受歡迎的工具。
注意:我們在本主題中引用了許多工具,並不是因為我們認可它們或認為它們是最好的,而是因為我們知道它們有效並且有良好的行業支援。在大多數情況下,還有其他工具可用,舊的工具會過時,毫無疑問,新的工具也會出現。
先決條件
在嘗試使用此處詳細介紹的許多工具之前,你應該先學習核心 HTML、CSS 和 JavaScript 語言的基礎知識。例如,你需要了解這些語言的基礎知識,然後才能開始除錯複雜 Web 程式碼中的問題、有效地使用 JavaScript 框架或編寫測試並在使用測試執行器針對你的程式碼執行它們。
此外,你應該從本主題中的第一個模組開始,該模組提供了對該一般領域的有用概述。
模組
- 瞭解客戶端 Web 開發工具
-
客戶端工具可能令人生畏,但本系列文章旨在說明一些最常見的客戶端工具型別的用途,解釋你可以連結在一起的工具、如何使用包管理器安裝它們以及如何使用命令列控制它們。最後,我們提供了一個完整的工具鏈示例,向你展示如何提高工作效率。
- 瞭解客戶端 JavaScript 框架
-
JavaScript 框架是現代前端 Web 開發的重要組成部分,為開發人員提供了經過驗證的工具,用於構建可擴充套件的互動式 Web 應用程式。許多現代公司將框架用作其工具的標準部分,因此許多前端開發工作現在都需要框架經驗。本模組為你提供了一些關於客戶端框架如何工作以及它們如何融入你的工具集的基本背景知識,然後繼續介紹涵蓋當今一些最流行框架的教程系列。
- Git 和 GitHub
-
所有開發人員都會使用某種版本控制系統(VCS),這是一種允許他們與其他開發人員協作處理專案而無需擔心彼此覆蓋工作以及在稍後發現問題時回滾到程式碼庫先前版本的工具。最流行的 VCS(至少在 Web 開發人員中)是Git,以及GitHub,這是一個為你的儲存庫提供託管和多個用於處理它們的工具的網站。本模組旨在教你你需要了解的關於它們兩者的知識。
- 跨瀏覽器測試
-
本模組專門介紹跨不同瀏覽器測試 Web 專案的領域。在這裡,我們瞭解如何識別你的目標受眾(例如,你最需要擔心哪些使用者、瀏覽器和裝置?)、如何進行測試、不同型別的程式碼將面臨的主要問題以及如何修復/緩解這些問題、哪些工具最有助於你測試和修復問題,以及如何使用自動化來加速測試。