avatar-img

前端網頁程式設計入門

24公開內容
8私密內容

本課程將帶你從 HTML、CSS、JavaScript 的基礎開始,學習如何構建現代化、響應式的網頁設計!我們還將介紹 React 與 Redux,讓你學會如何使用這些業界主流的前端函式庫來開發高效能的單頁應用(SPA)。你將了解元件化設計、狀態管理、等核心概念,提升你的開發技能,為進一步深入學習前端開發做好準備!

全部內容
免費與付費
最新發佈優先
付費限定
avatar-avatar
電資鼠
在本章,我們將會實做Todo-List專案,讓你對React開發有更深刻的了解與認識,同時增加 React 的應用經驗。
Thumbnail
avatar-avatar
電資鼠
在本章節,我們將學習如何使用 React useState 來管理 陣列 (Arrays) 和物件 (Objects) 的狀態,這是開發 動態應用 時的重要技術。內涵大量必須知道的應用範例,幫助讀者學習。
Thumbnail
avatar-avatar
電資鼠
React 的 state 是一個元件用於儲存動態資料的機制,當 state 變更時,React 會重新渲染元件。本文說明如何在函式元件和類別元件中使用 state,包含 useState hook 的用法,以及如何處理批次更新以避免 state 更新不一致的問題,並提供三個實例讓大家實際操作上手。
avatar-avatar
電資鼠
在本章節,我們將深入探討 React onClick 事件,這是 React 中最常見的 事件處理機制,允許我們在使用者點擊元素時執行特定的動作。
Thumbnail
avatar-avatar
電資鼠
在本章節,我們將探討 如何在 React JSX 中處理陣列 (Arrays),這是開發動態介面時必須掌握的關鍵技術。透過陣列,我們可以輕鬆地渲染動態清單 (Lists),例如待辦事項列表、產品清單或使用者資訊等。
avatar-avatar
電資鼠
在 React 中,我們可以利用 JavaScript 的條件運算特性,在 JSX 中根據狀態或 props 的不同,渲染不同內容。本章節會帶你快速入門這項知識並實際使用。
avatar-avatar
電資鼠
在本章節,我們將探討 React Props,這是 React 組件間 傳遞數據 的核心機制。Props (Properties) 允許父組件將數據傳遞給子組件,使組件變得更具動態性與重用性。 本章將透過 實際範例,讓你深入理解 React Props 的運作方式。
Thumbnail
avatar-avatar
電資鼠
在 React 中,有三種主要方式可以套用 CSS 來設計和美化應用的外觀。每種方式都有不同的適用場景,本文都有詳細介紹:
Thumbnail
avatar-avatar
電資鼠
React(也稱為React.js或ReactJS)是一個自由及開放原始碼的前端JavaScript工具庫,用於基於UI組件構建使用者介面。本章節會帶你初步建立環境並教導如何做使用。
Thumbnail