這一切如何對應到你的應用
現在,把這整幅畫面鋪到一個用氛圍編碼做出來的應用之上,因為你將要構建的每一塊,都住在這支舞的某一側:
- 前端是執行在瀏覽器裡的一切——使用者看到並點選的按鈕、表單和佈局。它就是客戶端。它主要負責傳送請求、顯示響應。
- 後端是執行在伺服器上的你的程式碼——決定如何處理一個請求、與資料庫對話、並組裝出響應的那套邏輯。它就是伺服器。
把整個註冊之旅放進一幅圖裡就是這樣——本章每一個加粗的詞都各就各位:
前端 (瀏覽器 = 客戶端) 後端 (伺服器)
┌────────────────────────┐ ┌────────────────────────┐
│ 使用者點選"註冊" │ POST /signup │ 建立賬戶 │
│ │ ──────────────▶ │ 設定 cookie │
│ │ 經由 HTTPS │ │
│ 顯示歡迎介面 ◀── │ ─────────────── │ ◀── 返回 200 OK │
└────────────────────────┘ └────────────────────────┘
一次真實的互動會把這一切縫在一起。使用者點選“註冊”(前端)。瀏覽器帶著表單資料,向一個像 /api/signup 這樣的 path、通過 傳送一個 POST 請求。你的後端收到它,建立賬戶,設定一個 cookie 讓使用者保持登入,然後送回一個 200。前端看到成功,於是展示一個歡迎頁面。那裡每一個加粗的詞,都是你剛剛學過的東西——而那,就是你將要構建的幾乎一切的整體形狀。
你不必把這一切一次性全都裝在腦子裡。但當後面某一章說“請求打到了伺服器,卻以 500 返回”,或者“設定這個頭部”,又或者“這個路由處理那個 POST”時,你現在就能確切地知道它指的是這支舞的哪一部分。那個心智模型,才是真正的先決條件——而你已經擁有它了。