iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 1 留言 278 瀏覽

鐵人賽 Modern Web DAY 12

30天React練功坊-攻克常見實務/面試問題系列第 12 篇

技術 30天React練功坊-攻克常見實務/面試問題 Day12: Sometimes useState just not good enough

tags: ItIron2023 react 前言昨天我們看了一個常見的race-condition問題並給出了三種主流的解決方案，今天我們放輕鬆一點，看一個...

windate3411 ‧ 2023-09-27

0 Like 0 留言 198 瀏覽

鐵人賽 Modern Web DAY 26

組裝前端開發工具箱，從 NX 入手系列第 26 篇

技術 Astro 集成 React 元件

Astro 的特點之一，就是可以使用各家框架的元件，像是 React, Vue, Svelte 等，能夠將不同來源的元件拼合到一頁上，在 Monorepo 的架...

Jasper ‧ 2023-09-27 ‧團隊我在鐵人賽烙賽、也在外木山裸泳◑ω◐

0 Like 0 留言 202 瀏覽

鐵人賽 Modern Web DAY 12

TypeScript 啟動！系列第 12 篇

技術 [Day 12] TypeScript 初見 React.js

在上一回先透過最簡單的 html 與 TypeScript 結合實作一個小場景，接下來我們將會把 React.js 給加入進來，首先簡單介紹一下 React.j...

叮叮 ‧ 2023-09-27

0 Like 0 留言 313 瀏覽

鐵人賽 Modern Web DAY 21

從Vue學React！不只要會用，還要真的懂～系列第 21 篇

技術【Day 21】管理邏輯複雜的狀態 - useReducer

我們在最一開始的時候，就已經看過最基本用來管理state的hook－useState了，今天再來看看另一個也是用在管理state的hook，就是useReduc...

文科少女 ‧ 2023-09-27 ‧團隊曼陀號計畫V

0 Like 0 留言 289 瀏覽

鐵人賽 Modern Web DAY 13

react 學習記錄系列第 13 篇

技術 [Day13]我的 react 學習記錄 - react forwardRef & useImperativeHandle

這篇文章的主要內容簡單介紹 react forwardRef 跟 useImperativeHandle forwardRef 上一篇介紹的 useRef...

evan_hsu ‧ 2023-09-27

0 Like 0 留言 328 瀏覽

鐵人賽 Modern Web DAY 27

React 走出新手村系列第 27 篇

技術 React 走出新手村 — React Server Components

緣起官方介紹影片連結，我也是做這個主題才知道，原來這個概念已經存在那麼久了，那我們快速講解他的成因吧！影片整理目的Dan Abramov 說出了我們前端開...

LucianoLee ‧ 2023-09-27

0 Like 0 留言 307 瀏覽

鐵人賽 Modern Web DAY 12

30 days of React 系列第 12 篇

技術 Day 12 - 在React 處理事件（下）

接著來學習在React當中處理事件，主要會提到React當中的事件傳遞機制，內容如下： React當中的事件傳遞停止事件傳遞 React當中的捕獲預防預設...

yuu ‧ 2023-09-27 ‧團隊好想工作室 v7.0

0 Like 0 留言 363 瀏覽

鐵人賽 Modern Web DAY 11

30天React練功坊-攻克常見實務/面試問題系列第 11 篇

技術 30天React練功坊-攻克常見實務/面試問題 Day11: Race condition with useEffect

tags: ItIron2023 react 前言我們昨天看了一個看似useEffect在搞事的問題，雖然說不能與它完全無關，但實際上他確實挺無辜的，真要怪的...

windate3411 ‧ 2023-09-26

0 Like 0 留言 169 瀏覽

鐵人賽 Modern Web DAY 20

從Vue學React！不只要會用，還要真的懂～系列第 20 篇

技術【Day 20】用ref讓Uncontrolled元件變可控

昨天已經了解Uncontrolled Component和Controlled Component的差異及概念是什麼，也知道如果是自己客製化的元件，是可以依照情...

文科少女 ‧ 2023-09-26 ‧團隊曼陀號計畫V

0 Like 0 留言 290 瀏覽

鐵人賽 Modern Web DAY 26

React 走出新手村系列第 26 篇

技術 React 走出新手村 — Next SSR

SSR Next 的 SSR（Server-Side Rendering）的概念是在每個使用者請求時動態產生頁面內容，而不是提前產生靜態 HTML 頁面，這樣頁...

LucianoLee ‧ 2023-09-26

0 Like 0 留言 230 瀏覽

鐵人賽 Modern Web DAY 12

react 學習記錄系列第 12 篇

技術 [Day12]我的 react 學習記錄 - useRef

這篇文章的主要內容簡單介紹 useRef hook 的使用方法 useRef useRef 是 react 裡面除了 useState 以外另外一個用來儲存...

evan_hsu ‧ 2023-09-26

0 Like 0 留言 331 瀏覽

鐵人賽 Modern Web DAY 11

30 days of React 系列第 11 篇

技術 Day 11 - 在React處理事件（上）

今天要學習如何在React中處理事件，以下是今天會提到的內容：如何設定事件處理器如何在事件處理器當中讀取props屬性資料將事件處理器作為props 傳...

yuu ‧ 2023-09-26 ‧團隊好想工作室 v7.0

1 Like 0 留言 222 瀏覽

鐵人賽 SideProject30 DAY 10

用 React 和 Firebase 打造一個完整 side project 吧！系列第 10 篇

技術 Day10：使用 Wireframe 線稿拼接網站的功能與畫面(四)

有了服務項目後，顧客已經可以開始預約，進入這個網站的重頭戲。上一篇文章中，眼尖的朋友們一定會發現，對比原先的 Flow Chart 後，好像少了「顧客預約當下沒...

Annie ‧ 2023-09-25

0 Like 0 留言 219 瀏覽

鐵人賽 Modern Web DAY 10

設計系統 - Design System 系列第 10 篇

技術 [Day 10] Design System - React Slots (插槽) - 實作

本系列文章會在筆者的部落格繼續連載！Design System 101 感謝大家的閱讀！本文同步上傳到筆者的個人部落格，裡面透過 Sandpack 直接...

Jing.tech ‧ 2023-09-25

0 Like 0 留言 284 瀏覽

鐵人賽 Modern Web DAY 10

30天React練功坊-攻克常見實務/面試問題系列第 10 篇

技術 30天React練功坊-攻克常見實務/面試問題 Day10: useEffect got called twice with empty dependency array

tags: ItIron2023 react 前言我們昨天看了一個useEffect在沒有處理好dependency array時發生的問題，今天讓我們再看一...

windate3411 ‧ 2023-09-25

0 Like 0 留言 223 瀏覽

鐵人賽 Modern Web DAY 19

從Vue學React！不只要會用，還要真的懂～系列第 19 篇

技術【Day 19】認識Controlled & Uncontrolled Component

在進入到明天的主題之前，先來認識兩個詞彙．分別是Controlled Component和UnControlled Component。這個部分不會複雜，但是與...

文科少女 ‧ 2023-09-25 ‧團隊曼陀號計畫V

0 Like 0 留言 268 瀏覽

鐵人賽 Modern Web DAY 25

React 走出新手村系列第 25 篇

技術 React 走出新手村 — Next ISR

ISR概念 ISR（Incremental Static Regeneration）是 Next.js 在（SSG）的基礎上做出的改進方法，讓頁面在構成之後根據...

LucianoLee ‧ 2023-09-25

0 Like 0 留言 268 瀏覽

鐵人賽 Modern Web DAY 11

react 學習記錄系列第 11 篇

技術 [Day11]我的 react 學習記錄 - useEffect

這篇文章的主要內容簡單介紹 useEffect useEffect useEffect 是 react 裡面常常使用到到 hook 但是在使用上有很多需要注...

evan_hsu ‧ 2023-09-25

0 Like 0 留言 157 瀏覽

鐵人賽 Modern Web DAY 10

30 days of React 系列第 10 篇

技術 Day 10 - 保持元件純淨

今天要來學習在設計元件時有哪些要點，以及如何避免寫出「不乾淨」的元件。純淨的元件製作元件時的大重點：保持元件的純淨 (Keeping Components...

yuu ‧ 2023-09-25 ‧團隊好想工作室 v7.0

0 Like 0 留言 9556 瀏覽

徵才招聘/全職/兼職平台前端開發工程師(遠程)

職位描述: 負責平台級線上遊戲網站 iGaming 應用產品的架構設計和開發工作; 參與前端前沿技術、理念的跟進、預研和落地; 參與前端技術架構、規範、研發流...

groot ‧ 2023-09-25

1 Like 0 留言 211 瀏覽

鐵人賽 SideProject30 DAY 9

用 React 和 Firebase 打造一個完整 side project 吧！系列第 9 篇

技術 Day09：使用 Wireframe 線稿拼接網站的功能與畫面(三)

上一篇我們已經完成了兩種主角色的註冊與登入畫面，也有將 Flow Chart 中所提到的店家角色稍微提及(如果忘記規則的話，可以回頭看下列文章)。本篇將重點放在...

Annie ‧ 2023-09-24

0 Like 0 留言 211 瀏覽

鐵人賽 Modern Web DAY 9

Nextjs 13: 建構專屬於你的 SSR 網站！系列第 9 篇

技術 [next 13] - data fetch

今天要接著介紹網頁開發很重要的一環， data fetch。很多時候我們開發功能時，往往需要從外部拿取資料，要如何拿取資料就是很重要的問題。這一篇會來介紹如何在...

時雨 ‧ 2023-09-24

0 Like 0 留言 267 瀏覽

鐵人賽 Modern Web DAY 9

30天React練功坊-攻克常見實務/面試問題系列第 9 篇

技術 30天React練功坊-攻克常見實務/面試問題 Day9: Data fetch with useEffect not work as expected

tags: ItIron2023 react 前言我們昨天看了在渲染陣列時用index作為key的一些隱憂，今天我們輕鬆一點，來看一個相對簡單的問題，但即便是...

windate3411 ‧ 2023-09-24

0 Like 0 留言 416 瀏覽

鐵人賽 Modern Web DAY 9

設計系統 - Design System 系列第 9 篇

技術 [Day 9] Design System - React Slots (插槽)

本文同步上傳到筆者的個人部落格，裡面透過 Sandpack 直接編輯程式碼! 什麼是 Slots ? Slots, 也可以稱為插槽, 就是一個預設的區塊 (...

Jing.tech ‧ 2023-09-24

0 Like 0 留言 333 瀏覽

鐵人賽 Modern Web DAY 24

React 走出新手村系列第 24 篇

技術 React 走出新手村 — Next SSG

關於渲染的構想 pre-rendering 一直是 Next.js 的核心思想，他們將其分為兩種實作方法，一個是 Rendering，也就是一般的渲染概念，另一...

LucianoLee ‧ 2023-09-24

1 Like 0 留言 264 瀏覽

鐵人賽 Modern Web DAY 10

react 學習記錄系列第 10 篇

技術 [Day10]我的 react 學習記錄 - react 如何運作跟 key 是什麼

這篇文章的主要內容簡單說說 react 是如何運作跟 key 是什麼 react 如何運作可以大略把 react 做的事情拆分成三個步驟，react 官方...

evan_hsu ‧ 2023-09-24

0 Like 0 留言 192 瀏覽

鐵人賽 Modern Web DAY 9

30 days of React 系列第 9 篇

技術 Day 9 - key

昨天我們在製作電影卡片元件，雖然畫面看起來沒問題但編輯器跳出了🚨 這個是什麼意思呢？在React中當我們使用到array item時，應該給每一個array i...

yuu ‧ 2023-09-24 ‧團隊好想工作室 v7.0

0 Like 0 留言 207 瀏覽

鐵人賽 Modern Web DAY 18

從Vue學React！不只要會用，還要真的懂～系列第 18 篇

技術【Day 18】優化頁面效能的另一個方向－lazy & Suspense

前面我們連續看了兩個對避免畫面重新渲染有幫助的hook，今天緊接著再來看另一個也有助於優化效能，並提升使用者體驗的方式。之前看的幾個hooks，主要都是透過避免...

文科少女 ‧ 2023-09-24 ‧團隊曼陀號計畫V

2 Like 0 留言 245 瀏覽

鐵人賽 SideProject30 DAY 8

用 React 和 Firebase 打造一個完整 side project 吧！系列第 8 篇

技術 Day08：使用 Wireframe 線稿拼接網站的功能與畫面(二)

有了主畫面後，我習慣先從主功能將 Wireframe 線稿依照原先的 Flow Chart 畫出來，細節功能會陸續繪製(有先想到的會以 Todo 標示)，並於後...

Annie ‧ 2023-09-23

0 Like 0 留言 245 瀏覽

鐵人賽 Modern Web DAY 8

Nextjs 13: 建構專屬於你的 SSR 網站！系列第 8 篇

技術 [next 13] - components render 機制

前面做了關於 client component 以及 server component 的基本介紹，這一篇來介紹一下他們背後的 render 機制。新的 re...

時雨 ‧ 2023-09-23

技術 30天React練功坊-攻克常見實務/面試問題 Day12: Sometimes useState just not good enough

技術 Astro 集成 React 元件

技術 [Day 12] TypeScript 初見 React.js

技術 【Day 21】管理邏輯複雜的狀態 - useReducer

技術 [Day13]我的 react 學習記錄 - react forwardRef & useImperativeHandle

技術 React 走出新手村 — React Server Components

技術 Day 12 - 在React 處理事件（下）

技術 30天React練功坊-攻克常見實務/面試問題 Day11: Race condition with useEffect

技術 【Day 20】用ref讓Uncontrolled元件變可控

技術 React 走出新手村 — Next SSR

技術 [Day12]我的 react 學習記錄 - useRef

技術 Day 11 - 在React處理事件（上）

技術 Day10：使用 Wireframe 線稿拼接網站的功能與畫面(四)

技術 [Day 10] Design System - React Slots (插槽) - 實作

技術 30天React練功坊-攻克常見實務/面試問題 Day10: useEffect got called twice with empty dependency array

技術 【Day 19】認識Controlled & Uncontrolled Component

技術 React 走出新手村 — Next ISR

技術 [Day11]我的 react 學習記錄 - useEffect

技術 Day 10 - 保持元件純淨

徵才 招聘/全職/兼職平台前端開發工程師(遠程)

技術 Day09：使用 Wireframe 線稿拼接網站的功能與畫面(三)

技術 [next 13] - data fetch

技術 30天React練功坊-攻克常見實務/面試問題 Day9: Data fetch with useEffect not work as expected

技術 [Day 9] Design System - React Slots (插槽)

技術 React 走出新手村 — Next SSG

技術 [Day10]我的 react 學習記錄 - react 如何運作跟 key 是什麼

技術 Day 9 - key

技術 【Day 18】優化頁面效能的另一個方向－lazy & Suspense

技術 Day08：使用 Wireframe 線稿拼接網站的功能與畫面(二)

技術 [next 13] - components render 機制

標記使用者

技術【Day 21】管理邏輯複雜的狀態 - useReducer

技術【Day 20】用ref讓Uncontrolled元件變可控

技術【Day 19】認識Controlled & Uncontrolled Component

徵才招聘/全職/兼職平台前端開發工程師(遠程)

技術【Day 18】優化頁面效能的另一個方向－lazy & Suspense