4.測試開發環境及工具是否正常運作

4.1 VS Code的開啟方式

開發者工具畫面
VS Code有多種的開啟方式來配合不同的使用情境：

Github - 遠端程式碼托管倉庫

github 是一個以git為基礎的雲端程式碼托管服務，目前已被微軟收購，並開放個人使用者可以使用全部的功能，只對企業用戶有收費。

Git - 版本管理工具

git 是繼subversion後最多人使用的版本管理工具，並結合雲端服務衍生許多應用來。
git 本身可以只在單機上執行版本管理的工具，建立起server端的托管倉庫後則又可以提供多人合作開發的應用，使用上非常有彈性。

Chrome DevTool - 瀏灠器開發者工具

目前主流的瀏灠器都有提供開發者工具，主要目的在方便網頁開發者可以進行即時的瀏灠和測試。

Visual Studio Code 程式碼編輯整合工具

VS Code為微軟推出的一個免費文字編輯器，因其內建多項對前端開發友善的功能加上內建套件市集，因此在短時間內普及，目前為許多網頁開發者首選的程式碼編輯器。

Xampp 整合型網頁開發套件

xampp為一個整合型的網頁開發環境套件，裏頭已經先行整合了網頁常用的開發環境需要的設定和套件，包含了 **網頁伺服器(Apache)、資料庫(MySQL)、程式語言(PHP)、資料庫管理軟體(PhpMyAdmin)**，因此推薦給剛入門的新手來安裝使用，省去逐個下載安裝設定的麻煩。