經歷漫長的日子，終於到了第三十天我們先短暫的回顧一下功能的部分 Review 在功能的部分我們看了專案三個功能分別是部落格、課程和結帳由於時間有限加上專案功能繁...
目前我們掌握了 React 渲染的機制，也就是渲染會經過的三個階段，也了解到在 re-rendering 的過程中發生了什麼事情。還沒完，今天要來學習「排隊任務...
TypeScript 在寫 JavaScript 的時候，你會直接使用變數，不管是 const, let, var，因為沒有定義他的 type，所以可以是任何東...
今天要來學習在設計元件時有哪些要點，以及如何避免寫出「不乾淨」的元件。 純淨的元件 製作元件時的大重點：保持元件的純淨 (Keeping Components...
現在是把元件從專案中獨立出來了，但還只能從專案上去看到元件所呈現的結果，為了之後開發元件方便，來給元件庫加上 storybook 吧。 可以直接將剛剛建好的...
這篇文章的主要內容 簡單介紹一下 react 是什麼。 什麼是 React ? React 是由 Meta 團隊維護的開源 JavaScript Librar...
display: block object-fit: cover 還有 <figcaption /> 這些就是被選來製造好看 img 的必要（？）成...
在前幾篇文章中，我們探討了模組化設計如何增強應用的靈活性與可維護性，同時介紹了如何優化元件重繪和狀態管理。使用 console.log 來檢查元件的重繪情況，是...
連載動機 藉由 30 天筆記，將學習 React 相關的知識整理起來，以便日後回頭參照。 主要參考來源為官方網站，並搭配各路大神的文章整理成筆記。 預計內容如下...
React 官方文件目前已結束第三章，進入最後一個章節的學習前，最後幾天的鐵人賽以實作的練習來複習所學習過的內容吧。今天要來練習輸入授權碼的表單製作。要讓使用者...
tags: ItIron2023 react 前言 我們前兩天將重點放在React.memo使用上的一些情境與錯誤，接著我們將繼續探討其他造成不必要重複渲染的情...
今天要來介紹 client component 的用法，其實 client component 就是過去 next 12 常用的 component，功能上大同...
時雨
‧
2023-09-21
終於進到我們最後的部分，「checkout」接下來我們會來看在這個專案中結帳的流程是怎麼進行的 我們以們前幾天的課程為例首先我們看到，如果課程為「0元」的情況分...
這篇文章的主要內容 簡單介紹 lazy 跟 Suspense 的用途跟用法 lazy lazy 是 react 裡面提供的一個 api 可以讓我們透過非同步的...
tags: ItIron2023 react 前言 昨天我們看了一個誤用useEffect的例子，了解到其實有些東西你不需要靠useEffect也能達成，今天我...
昨天我們看完了文章總覽頁今天我們進到文章內頁 程式碼如下： import { Icon } from '@chakra-ui/icons' // ~中間略~...
今天，我們將實作健身房管理系統中一個非常關鍵的功能——會員管理。我們會構建會員列表頁面和會員詳情頁面，並且學習如何使用 TanStack Table 和 Rea...
昨天我們談到了為什麼要學習React,今天我們就開始動手學習，作為一個有Vue開發經驗的開發者，我們會特別注意React和Vue的異同。 開發環境設置 首先,讓...
SSR Next 的 SSR（Server-Side Rendering）的概念是在每個使用者請求時動態產生頁面內容，而不是提前產生靜態 HTML 頁面，這樣頁...
tags: ItIron2023 react 前言 我們昨天做了一個簡單的pagination題目，大致上了解一般實務是如何處理這類的情況，包含loading...
在只使用原生 hr 元件的條件限制下，盡量還原出 MUI Divider 能做到的效果。 成品 展示 原始碼 開發思路 顏色 透過 props.o...
在 React 開發中，隨著應用程式變得愈加複雜，狀態管理也變得更加困難。今天將介紹三種常見的狀態管理工具：Redux、MobX 和 Zustand，以協助開發...
Memo解方 今天我們接續前面的問題，大家是否有找到解答了呢？ 如果沒有的話，我會在下面提供兩種做法： 第一種，在 memo 裡面用 callback 告訴...
Dynamic Routes 我們今天接續的做每個角色自己的頁面，來理解 Dynamic Routes 的實作層面。這部分我們可以先借一下 Next 官方的範例...
為什麼想參加這次的鐵人賽？ 回頭看自己從接觸React到現在，其實也才半年在這短短半年中，從一個只會用jQuery幹出前端畫面的工程師到現在可以用React進行...
__locale(帶入語系) CN ,EN option.Language = __locale; var chart = HQChart.Chart.JS...
承上篇，核心的 Tabs 其實已經建立好了，當內容不能呈現出來就不算真正的完成！因此本篇來看看要如何顯示對應的資料。 開始！ 簡短回顧一下我們的 state...
tags: ItIron2023 react 前言 我們昨天看了一個不必要re-render造成的效能問題並利用React.memo來解決，到這邊一切相安無事，...
有了服務項目後，顧客已經可以開始預約，進入這個網站的重頭戲。上一篇文章中，眼尖的朋友們一定會發現，對比原先的 Flow Chart 後，好像少了「顧客預約當下沒...
在完成兒童任務管理平台的核心功能後，我又在 AI 的協作下，快速打造了「每週報告」：彙整任務完成率、活動紀錄與獎勵兌換等等；接著，我又想到的一個適合的常見功能&...
HLTVProxy
yuu
Yin
Jasper
evan_hsu
查理狐狐
carolcheng
Emi
windate3411
Moscle.dev
LucianoLee
Charlie
Annie
平凡工程師
iThome鐵人賽
看影片追技術