1. 核心概念
- Network：電腦網路。
- Web：萬維網，建立在 Internet 之上的超文本系統。
- Web 程式：運行於 Web 環境、透過瀏覽器存取的應用程式。
2. 演進歷程
單機程式
程式安裝於單一電腦，資料不共享，擴充性極差。
C/S 架構
- Server：提供服務（檔案、資料庫、運算）。
- Client：請求服務，需安裝專用客戶端（如 QQ、FTP 軟體）。
- 優點：介面豐富、離線運算能力強。缺點：部署維護成本高，每台客戶端皆需安裝更新。
B/S 架構
- Browser 作為通用客戶端，隨作業系統預裝，無需額外安裝。
- Server 集中維護業務邏輯與資料，客戶端零維護。
- 成為現代 Web 應用主流架構。
3. 伺服器端組成
| 服務類型 | 常見軟體 | 功能 |
|---|
| Web Server | Apache, Nginx, IIS | 處理 HTTP 請求、靜態檔案、反向代理 |
| Application Server | PHP-FPM, Tomcat, Node.js | 執行動態腳本、業務邏輯 |
| Database Server | MySQL, PostgreSQL, Redis | 資料持久化、快取 |
可部署於單一機器（集中式）或分散多機（獨立式/叢集）。
4. B/S 請求完整流程（以 PHP 為例）
- 使用者在瀏覽器輸入 URL（如
https://example.com/index.php）。
- 瀏覽器解析域名（DNS）、建立 TCP 連線、發送 HTTP GET 請求。
- Web Server (Apache/Nginx) 接收請求，判斷為 PHP 腳本，轉交 PHP-FPM。
- PHP 解析器編譯腳本，執行邏輯（含資料庫查詢、快取存取）。
- PHP 輸出 HTML/JSON 等回應內容，經 Web Server 回傳給瀏覽器。
- 瀏覽器解析渲染 HTML、執行 JavaScript、呈現畫面。
若請求靜態檔案（HTML/JS/CSS/圖片），Web Server 直接讀取檔案回傳，不經 PHP 解析器。
5. 瀏覽器端運作
- 收集輸入：表單、AJAX、使用者互動。
- 發送請求：HTTP/HTTPS、WebSocket、Fetch API。
- 接收回應：HTML、JSON、XML、二進位資料。
- 解釋執行：HTML 解析建構 DOM、CSS 佈局渲染、JS 引擎執行腳本。
瀏覽器扮演「代理人」角色，負責呈現介面與前後端通訊。
6. HTML 基礎
- 超文本標記語言，非程式語言，用標籤描述文件結構與呈現。
- 基本結構：
<!DOCTYPE html>（版本宣告）、<head>（中繼資料）、<body>（可見內容）。
- 目標：跨平台、跨瀏覽器一致呈現。
