[基礎課程] Angular v13.2 服務與路由 - 依賴注入與 SPA 導航

本篇教學以 Angular v13.2 為範例,深入探討服務(Services)與路由(Routing)的核心概念和實作技巧。學習如何透過依賴注入建立可重用的服務,以及如何使用 Angular Router 實現單頁應用程式的導航功能。

本篇教學以 Angular v13.2 為範例,深入探討服務(Services)與路由(Routing)的核心概念和實作技巧。學習如何透過依賴注入建立可重用的服務,以及如何使用 Angular Router 實現單頁應用程式的導航功能。

Angular 是由 Google 主導開發的現代化前端框架,採用 TypeScript 作為主要開發語言。本篇教學以 Angular v13.2 為範例,將介紹 Angular 的基本概念、環境設定,以及元件化開發的核心觀念,適合初學者入門學習。

本篇開始深入探討一些 React 細節高級操作觀念上的的認知學習單元,根據參考官方手冊逐步學習。同時會略過一些對於未來性將捨棄的原有功能。

Hook 是 React 自版本 16.8 開始推廣出來的新功能,主要是用於不需要 class 就能輕鬆使用 state 的方式。出現的動機主要是避免開發人員對於 class 的 this 定義容易混淆,且將使用邏輯更容易直接上手。

本篇續接初階篇之後的實作思考練習,透過步驟一步步從原型視覺稿到實體呈現。本篇根據官方手冊逐步跟隨完成動作並根據自己的邏輯思考完成。

React 是由 Facebook 所主導開發的 JavaScript 框架,與 AngularJS 相同都是採用元件 Component-based 來進行觀念導向設計,不像 VueJS 採用 MVVM(Model 資料管理、View 畫面顯示、ViewModal 溝通橋梁)觀念去區分細節,而是整個融合在 Component 整個零件內。

本篇介紹 Sass 這套預處理器,他能將大型專案上編寫 CSS 不易維護的問題進行改善。使用 Sass 的 Script 語言來進行 CSS 開發,再透過編譯 complier 後轉為瀏覽器可閱讀的 CSS。

本系列主要重點想介紹CSS設計上你該有更好的處理方式來設計,包含你應該熟悉CSS所提供的原生變數、可預處理的Script編譯語言、可預後處理的擴展工具輔助。本第一篇將先會先介紹 CSS3 提供的變數與應用方式來說明。