Sviluppo Web
Guide e progetti su HTML5, React, Angular, Next.js, Vite e sviluppo frontend moderno.
第 15 課：Grid 布局
CSS Grid是二維布局系統，可以同時控制行和列，非常適合建立複雜的網格布局。
Leggi l'articolo →第 17 課：CSS 動畫和過渡
Transitions 讓CSS 屬性的變化變得平滑。
Leggi l'articolo →第 27 課：AJAX 和 Fetch API
範例：examples/lesson-27/example-01-fetch.html
Leggi l'articolo →HTML Canvas with JavaScript - Teaching Materials
A comprehensive curriculum for learning HTML Canvas from beginner to advanced levels.
Leggi l'articolo →Getting Started with Create React App
This project was bootstrapped with Create React App.
Leggi l'articolo →Getting Started with Create React App
This project was bootstrapped with Create React App.
Leggi l'articolo →Lesson 09：表單處理 (Forms)
在受控元件中，表單的值由 React 的 state 控制。每次使用者輸入，都透過 onChange 更新 state，再由 state 驅動 UI。
Leggi l'articolo →Lesson 13：useReducer
useReducer 是 useState 的替代方案，適合管理複雜的狀態邏輯。它借鑑了 Redux 的概念。
Leggi l'articolo →Lesson 14：自訂 Hooks (Custom Hooks)
自訂 Hook 是以 use 開頭的函式，用來封裝和複用有狀態的邏輯。
Leggi l'articolo →Lesson 15：React Router
React Router 是 React 的路由函式庫，讓單頁應用（SPA）可以有多個「頁面」。
Leggi l'articolo →Lesson 18：API 資料串接
使用 GitHub API：https://api.github.com/search/users?q={query} 包含搜尋、載入狀態、錯誤處理 顯示頭像、使用者名稱、個人頁面連結
Leggi l'articolo →Lesson 19：狀態管理 — Redux Toolkit
Redux 是一個可預測的狀態管理工具，適合管理大型應用的全域狀態。
Leggi l'articolo →React + Vite
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Leggi l'articolo →Backend Server Setup
This document explains how to set up and run the backend server for the Angular Comprehensive Demo.
Leggi l'articolo →Code Flow Documentation
This document provides a detailed explanation of how code flows through the Angular Comprehensive Demo application, from startup to user interactions.
Leggi l'articolo →Project Summary
This Angular comprehensive demo project has been successfully created with all requested features implemented. The project demonstrates core Angular concepts with extensive documentation and comments throughout the codeb
Leggi l'articolo →Angular Comprehensive Demo
A comprehensive Angular application that demonstrates core concepts, best practices, and modern Angular development patterns.
Leggi l'articolo →Backend Server for Angular Comprehensive Demo
This is a Node.js/Express backend server that provides REST API endpoints for the Angular Comprehensive Demo application.
Leggi l'articolo →Angular Learning Roadmap
Proficiency with modern JavaScript/TypeScript (ES6+, async/await, modules, generics) Familiarity with npm or yarn workflows and basic CLI usage Understanding of HTML5 semantics and modern CSS (Flexbox, Grid) Comfort with
Leggi l'articolo →Performance Audit Template
Route / Scenario Tested Build Configuration: (ng build --configuration production) Device / Network Profile: (e.g., Lighthouse Mobile, 4x CPU slowdown) Date
Leggi l'articolo →Weeks 1-2: Environment Setup & Component Fundamentals
Install and verify Angular tooling (Node.js, npm/pnpm, Angular CLI, IDE extensions). Understand generated Angular project structure and build workflow. Create standalone components and templates with bindings, inputs, ou
Leggi l'articolo →Weeks 3-4: Directives, Forms, and Dependency Injection
Build custom attribute and structural directives to encapsulate template behavior. Implement template-driven and reactive forms, including validation and form state management. Leverage Angular's dependency injection (DI
Leggi l'articolo →Weeks 5-6: Routing, HTTP, and Observables
Configure Angular Router with feature routes, lazy loading, and route guards. Consume REST APIs with HttpClient, interceptors, and typed responses. Master RxJS operators (switchMap, mergeMap, catchError, shareReplay) for
Leggi l'articolo →Weeks 7-8: CRUD Application, Authentication, and Testing Coverage
Architect a feature-rich CRUD application using modular/standalone design patterns. Implement authentication flows (login, refresh tokens) with guards, interceptors, and directive-based permission control. Build complex
Leggi l'articolo →