新手入門

課程目標

完成一個完整的網站

角色關係

flowchart LR
    A[前端]<-->B[後端]<-->C[維運]

主要負責 UI 呈現與 API 串接，最容易被看到

主要負責商務邏輯，不太容易被看到

主要負責背後的服務穩定，一般使用者看不到

狹義來說，前端的範圍侷限在 HTML, CSS, JavaScript 這三個技術基礎內

廣義來說，只要是可以將東西在網頁上呈現出來給使用者看的，都可以稱為前端

前端只有兩種人: 會寫程式的;不會寫程式的

最終，大家都要朝著一條龍的路上走去...

sequenceDiagram
    Browser->>Server: Request (輸入網址按下 enter)
    Server->>Browser: Response (畫面顯示)

flowchart TD
    A[首頁]
    A-->B[關於我們]
    A-->C[商品介紹]
    A-->D[聯絡我們]
    A-->E[成功案例]
    C-->C1[商品列表]
    C1-->C2[商品詳細]

簡易型 Web Server，模擬正式環境

方便識別檔案型態 icon 的主題

Chrome 提供的開發者工具，開發人員必備！

會『除錯』比會『開發』來得重要!