安装基础软件 - 学习 Web 开发 编辑

本小节将介绍常用 web 开发工具的种类和安装方法。

专业人员使用哪些工具？

• 计算机，虽然显而易见，但是还有些人会通过手机或者公共计算机来阅读这篇文章。严肃的 Web 开发，最好还是使用运行 Windows，Mac，或者 Linux 系统的台式机或笔记本电脑。
• 文本编辑器，用来编写代码。可以是纯文本编辑器（比如 Visual Studio Code、Sublime Text、Atom、Brackets、GNU Emacs 或 VIM）；也可以是混合编辑器（比如 Dreamweaver 或 WebStorm）。Office 文档编辑器并不适用，因为它们依赖的隐藏元素会干扰浏览器渲染机制。
• Web 浏览器，用来测试代码。如今使用最多的浏览器有 Firefox，Chrome，Opera， Safari，Internet Explorer 和 Microsoft Edge。另外，还需测试网站在移动设备和老式浏览器（如 IE 8-10）上的表现。还有 Lynx, 一个基于文本的终端 Web 浏览器，可用于测试视力障碍用户的浏览体验。
• 图像编辑器，像 GIMP、Paint.NET、Photoshop 或者 XD，用来编辑网页中的图形图像。
• 版本控制系统，用来管理服务器上文件，支持项目团队协作，共享代码资源，以及避免编辑冲突。当今最流行的版本控制工具是 Git，同时 GitHub 以及 GitLab 等基于 Git 的代码托管服务网站也非常流行。
• FTP 工具，老式 Web 托管账户用来管理服务器上文件（正在被 Git 迅速取代）。有很多 (S)FTP 工具软件，比如 Cyberduck、Fetch 和 FileZilla。
• 自动化构建工具， 用来自动完成压缩代码和运行测试等重复性任务，比如 Grunt 或 Gulp。
• 模板，库，框架等等，可提高效率的工具。
• 还有很多！

哪些是当务之急？

上面的列表太冗长了，不过幸运的是，初学 Web 开发并不需要面面俱到。本文将列出一个尽可能短的开发工具清单——一款文本编辑器和几款现代 Web 浏览器。

安装文本编辑器

大多系统都会默认配备一款基本的文本编辑器。比如 Windows 的 记事本， macOS 的 TextEdit，Ubuntu 的 gedit，Linux 发行版各不相同。

Web 开发中可以使用比记事本和 TextEdit 更好的工具。 推荐从 Visual Studio Code 开始，免费且提供实时预览和代码提示。

安装现代 Web 浏览器

然后，针对不同操作系统，安装几款用来测试的桌面 Web 浏览器：

• Linux: Firefox、Chrome、Opera、Brave。
• Windows: Firefox、Chrome、Opera、Internet Explorer（Windows 7 及以上版本可以安装 Internet Explorer 11）、Microsoft Edge（Windows 10 的默认浏览器，采用 Chromium 内核）、Brave。
• macOS: Firefox、Chrome、Opera、Safari（macOS 和 iOS 的默认浏览器）、Brave。

要至少准备两款或以上的浏览器用于测试。

Internet Explorer 对一些现代 Web 功能兼容性不佳，运行现代工程可能会失败。

安装本地 Web 服务器

一些示例需要通过 Web 服务器运行才能正常工作。阅读 如何设置本地测试服务器？了解更多。

本章目录

• 安装基础软件
• 设计网站外观
• 处理文件
• HTML 基础
• CSS 基础
• JavaScript 基础
• 发布网站
• Web 工作机制