在主控台建構部署儀表板
這門免費課程共有 10 章。你將從空白頁面開始建構 Acme Deploys，直到部署具備路由、資料與測試的應用程式。閱讀時，每章都會在 DevTools 中即時執行。
進度0/10
- 01開始使用建立應用程式、渲染第一個頁面並回應按鍵。5 分鐘
- 02使用 Box 配置版面使用 Flexbox，以儲存格為單位建立儀表板外框：頂端列、側邊欄與卡片。7 分鐘
- 03文字與樣式以色彩、文字屬性與主題 Token 設定部署卡片的樣式。6 分鐘
- 04輸入與按鍵對應使用鍵盤瀏覽部署，並加入 ? 說明覆蓋層。8 分鐘
- 05路由將應用程式分成多個路由，共用版面配置，並支援連結、快速鍵與歷史記錄。8 分鐘
- 06資料與路由處理常式從 app/api 提供部署資料，在頁面中擷取並以 POST 新增。8 分鐘
- 07Table、List 與圖表以可排序的 Table 和不會使版面配置位移的圖表，取代手寫的資料列。7 分鐘
- 08測試在畫面外渲染、模擬按鍵，並以文字斷言影格。6 分鐘
- 09在終端機中執行使用 text run，在終端機中全螢幕執行同一個儀表板。5 分鐘
- 10發布建置、設定中繼資料並部署 Acme Deploys。4 分鐘
- ▼證書取得印有你姓名、在主控台渲染的證書。
課程在你的主控台執行
按 ⌘⌥JCtrl+Shift+J⌘⌥KCtrl+Shift+K⌘⌥C 開啟主控台（先啟用開發者功能），點擊下方，再用方向鍵選擇章節。
▼ learn
開啟主控台
⌘⌥J
CtrlShiftJ
⌘⌥K
CtrlShiftK
⌘⌥C
應用程式在 DevTools 中渲染。先在 Safari「設定」→「進階」中開啟「顯示網頁開發者功能」。 接著點擊這裡並按 ↓。
在電腦上開啟
此應用程式在 DevTools 主控台中渲染，需要桌面版瀏覽器。