前幾篇文章中，我們探討了一些 TypeScript 的基本用法。從這一篇開始，我們將探索如何在 React 中使用 TypeScript。 首先，打開終端機，建...
前言 此篇接續上篇：A6 React 和 Vue 實作表格元件：排序、搜尋與分頁功能詳解 靜態資料 columns const columns = [...
用途 在前端開發中，表格元件（Table）通常是用來展示大量資料的最佳方式。特別是當資料需要被排序、搜尋或分頁顯示時，構建一個高效且可擴展的表格元件變得尤為重要...
歡迎來到我們React學習之旅的第五天！今天,我們來聊聊React的一個核心特性: Hooks。 什麼是useEffect? useEffect是React提供...
在前面的章節中，我們介紹了如何直接指定類型，這種方式在實務中非常常見。但是，當我們有多個相似功能的函式或物件時，重複定義類型並不是最理想的解決方案。 或許你會想...
歡迎來到我們React學習之旅的第四天。今天，我們將使用Vite重新建立我們的專案。 為什麼選擇Vite? 在之前的文章中,我們使用了Create React...
前面幾日，我們認識再React中常用的JS語法內容後，接下來準備來學習React，再開始之前，要先來學習如何建立環境！ React 環境建置: 使用 crea...
鯨魚
‧
2024-09-18
取得 HTML 元素的 props 在建立共用元件時，有時候會需要繼承到 HTML 元素的 props，這時候就需要針對原本的 props 做修改或擴充。但一個...
什麼是 Discriminated Unions 先看範例: type Shape = | { kind: "circle"; radi...
type 合併用法 首先，我們以餐廳與顧客為例，定義一個簡單的例子： type Restaurant = { menu: string[] addres...
大家好！歡迎來到React學習之旅的第三天。今天，我們將建立我們的React專案，並使用shadcn/ui來構建一個簡單美觀的UI界面。 建立專案 首先,讓我們...
React Native 的架構演進 在 React Native 的早期版本中，資料在JavaScript和原生層之間的通訊是透過Bridge來進行。但由於需...
在昨天只有介紹了 extends，還有其他好用的關鍵字。 typeof typeof 關鍵字可以用來取得一個變數或表達式的型別。 const user = {...
Custom Types 根據上一篇的程式碼，雖然我們達成了指定函式型別的目的，但你會發現它在閱讀性上並不是很好： function calculate(a:...
昨天我們談到了為什麼要學習React,今天我們就開始動手學習，作為一個有Vue開發經驗的開發者，我們會特別注意React和Vue的異同。 開發環境設置 首先,讓...
什麼是 React Native？ RN是由Meta推出的一個開源框架，讓開發者可以透過React來構建跨平台的移動應用程式。來達到一次編寫，處處運行的需求。利...
為什麼要錄影 在互動性高的應用程式中，讓使用者可以自由紀錄畫面，是必備的元素之一。這不僅提供了用戶便捷的錄影功能，也讓開發者可以輕鬆製作展示影片。無論是創建教學...
前幾天，我們從Playground的佈局下手，已經保證一個自適應的窗口來容納canvas，並獲得游標的位置，現在，讓我們延續昨天的基礎，設計更靈活的菜單收納方法...
在上一篇文章中，我們實作了一個簡單的用戶資料管理系統，並展示了如何結合 Rust 與 React 進行全端開發。然而，對於一個完整的應用來說，通常需要有登入頁面...
在前一篇文章當中我們展示了如何使用 Rust 當中的 Rocket 以及 mongoDB 套件，建立了一個簡單的使用者資料管理方面的 RESTful API，但...
當我們在網路上使用應用程式時，像是購物網站、社交平台或是線上工具，背後其實有很多程式碼在幫忙處理畫面顯示和計算邏輯。其中，React 是一個非常受歡迎的工具，它...
當參數為值 TypeScript 可以為函式的參數指定型別： function add(a: number, b: number) { const sum...
什麼是泛型? 首先先看一個簡單的例子 function identity<T>(arg: T): Type { return arg; } co...
回來做元件！ 今天接著介紹如何利用模板動態生成DOM，並比較 React 和 Vue 的不同實作方式。 Functional component vs Com...
前言 這個系列主要分享我在開發過程中所學到的一些技術和方法。同時，許多技術知識點其實是我之前接觸過的，但大多只是略懂皮毛，並沒有深入理解。藉由這次鐵人賽的契機，...
大家好!歡迎來到「React 學得動嗎」系列文章的第一天。我是七年工作經驗的開發者,主要專注於後端開發,而在前端方面則主要使用Vue。今天,我想和大家分享為什麼...
在當今的開發環境中，桌面應用程式的開發方式有了巨大的改變，從原生的桌面應用開發到跨平台技術的應用開發，隨著 Modern Web 技術的迅速發展，我們現在已經可...
Ci
‧
2024-09-15
作為一名使用React的開發者，這次決定挑戰在30天內從零開始學習React Native這個跨平台開發，並且完整記錄整個學習過程。 React Native作...
Union 聯集 上一篇我們提到「 TypeScript 會對於基本型別自動進行推測 」，但在有些情況下，變數有可能不只一種型別，例如使用者密碼，若我們沒有限定...
React是奠基於JavaScript的前端框架，因此在開始學習之前，必須要有一些JavaScript的基礎認識，否則在學習上容易卡關。因此，今天我們來認識一下...
鯨魚
‧
2024-09-16
Jamie
jerrythepotato
Moscle.dev
Jaren
Felix阿甫
Maso的萬事屋
iThome鐵人賽
看影片追技術