安裝基本軟體

在 *安裝基本軟體* 中,我們將向您展示進行簡單 Web 開發所需的工具以及如何正確安裝它們。

我現在實際上需要哪些工具?

在本文中,我們將為您提供最基本的內容 - 一個文字編輯器和一些現代 Web 瀏覽器。

安裝文字編輯器

您的計算機上可能已經有一個基本的文字編輯器。Windows 預設包含 記事本,macOS 附帶 TextEdit。Linux 發行版有所不同;Ubuntu 22.04 LTS 版本預設包含 GNOME 文字編輯器

對於 Web 開發,您可能比記事本或 TextEdit 做得更好。我們建議從 Visual Studio Code 開始,它是一個免費的編輯器,提供即時預覽和程式碼提示。

安裝現代 Web 瀏覽器

現在,我們將安裝幾個桌面 Web 瀏覽器來測試我們的程式碼。確保您至少安裝了這兩個瀏覽器,來自兩個不同的家族(因此您不會在使用相同渲染引擎的兩個瀏覽器中進行測試)。

安裝本地 Web 伺服器

一些示例需要由 Web 伺服器執行才能成功工作。您可以在 如何設定本地測試伺服器? 中瞭解如何執行此操作。

專業人士使用哪些工具?

以下看起來像一個可怕的清單,但幸運的是,您可以在不瞭解其中大多數的情況下開始 Web 開發。

  • 一臺計算機。也許對有些人來說這聽起來很明顯,但有些人正在手機或圖書館電腦上閱讀這篇文章。對於嚴肅的 Web 開發,最好投資一臺執行 Windows、macOS 或 Linux 的桌上型電腦或筆記型電腦。
  • 一個文字編輯器,用來編寫程式碼。這可以是文字編輯器(例如 Visual Studio CodeNotepad++Sublime TextGNU EmacsVIM),或混合編輯器(例如 DreamweaverWebStorm)。辦公文件編輯器不適合此用途,因為它們依賴於隱藏元素,這些元素會干擾 Web 瀏覽器使用的渲染引擎。
  • Web 瀏覽器,用來測試程式碼。目前,最常用的瀏覽器是 FirefoxChromeSafariMicrosoft Edge。您還應該測試您的網站在移動裝置以及目標受眾可能仍在使用的任何舊瀏覽器(例如 IE 8-10)上的效能。 Lynx,一個基於文字的終端 Web 瀏覽器,非常適合檢視視障使用者如何體驗您的網站。
  • 一個圖形編輯器,例如 GIMPFigmaPaint.NETPhotoshopSketchXD,用於為您的網頁製作影像或圖形。
  • 一個版本控制系統,用來管理伺服器上的檔案,與團隊合作處理專案,共享程式碼和資產,避免編輯衝突。目前,Git 是最流行的版本控制系統,以及 GitHubGitLab 託管服務。
  • 一個 FTP 程式,用於在舊的 Web 託管帳戶上管理伺服器上的檔案(Git 越來越多地取代 FTP 用於此目的)。有大量的 (S)FTP 程式可用,包括 CyberduckFetchFileZilla
  • 一個自動化系統,例如 WebpackGruntGulp,用於自動執行重複性任務,例如壓縮程式碼和執行測試。
  • 庫、框架等,可以加快編寫常見功能的速度。庫通常是一個現有的 JavaScript 或 CSS 檔案,它提供現成的功能供您在程式碼中使用。框架傾向於更進一步,提供一個完整的系統,其中包含一些自定義語法供您在上面編寫 Web 應用程式。
  • 還有更多工具!