iT邦幫忙

react相關文章
共有 560 則文章
鐵人賽 Modern Web DAY 26

技術 【Day 26】誰說一定要用別人寫好的 hooks - Custom Hooks

從介紹第一個 hooks 開始,我們都是在使用 React 提供的 hooks ,有沒有想過我們也可以實作自己的 hooks 呢? 先來看看我找到的一段對 cu...

鐵人賽 Software Development DAY 15

技術 [Day15] 一次填好麵線跟拉麵的菜單可以嗎? ─ 組合(Composite) <模式篇>

嗨 大家好 我是一路爬坡的阿肥 今天放颱風假比平常開心100倍 因為可以有更多時間寫文章啦! 情境描述 在大肥百貨美食街的麵食區,開著肥肥麵線攤跟壹LAN拉麵...

鐵人賽 Modern Web DAY 16

技術 [DAY16] 組件的傳值之爸爸給你的你才能要

我想說的是 組件傳遞資料並不是只能傳遞數值,函式也可以傳遞 子組件不能直接操作父組件的資料,要通過父組件傳來的函數去變更父組件的資料 上一篇中我們把按摩服務...

鐵人賽 Modern Web DAY 13

技術 [Day 13 - 即時天氣] 建立一個即時天氣 App - 前置準備

感謝 iT 邦幫忙與博碩文化,本系列文章已出版成書「從 Hooks 開始,讓你的網頁 React 起來」,首刷版稅將全額贊助 iT 邦幫忙鐵人賽,歡迎前往購書...

技術 人生第一篇程式的發文文章:為何開始學 React?

挑戰 React 第一篇 學習目的 從去年11月開始轉職當軟體工程師,主要都是在了解後端的知識,像是 mysql / php / laravel框架/ ngin...

鐵人賽 Modern Web DAY 15

技術 [DAY15] 組件的拆分

我想說的是 組件拆分的方法 在前面幾篇中,其實已經寫好了一個基本的按摩服務列表 但是從頭到尾只使用了一個組件 在小型專案中也許可以這麼做,但隨著專案大小 勢...

鐵人賽 Modern Web DAY 25

技術 【Day 25】useCallback - 學會把函式記起來

不知不覺來到第 25 天了,本來預計是要用小專案作結的,沒想到意外的忙碌啊,所以剩下的幾天就決定介紹一些我原本也不熟悉或不常使用的特性,學習的同時也盡量內化並記...

鐵人賽 Software Development DAY 14

技術 [Day14] 我需要一台喵喵翻譯機 ─ 轉接器(Adapter) <實作篇>

嗨 大家好 我是一路爬坡的阿肥 寫著寫著竟然已經撐兩個禮拜了! 果然有參加比賽有差 可以訓練自己擺脫三分鐘熱度的壞習慣 給個定義 我們知道轉接器模式主要的類...

鐵人賽 Modern Web DAY 12

技術 [Day 12] 快速了解各組件的資料狀態 - React DevTools

感謝 iT 邦幫忙與博碩文化,本系列文章已出版成書「從 Hooks 開始,讓你的網頁 React 起來」,首刷版稅將全額贊助 iT 邦幫忙鐵人賽,歡迎前往購書...

鐵人賽 Modern Web DAY 17

技術 Day16 | SPA 的換頁不是你的換頁

前言 今天要和大家介紹的是 SPA, 是一種提升用戶在瀏覽網頁時的技術, 傳統式的網頁在切換頁面時,都會送出一個 Url 給服務器,之後服務器會依它收到的 Ur...

鐵人賽 Software Development DAY 13

技術 [Day13] 我需要一台喵喵翻譯機 ─ 轉接器(Adapter) <模式篇>

嗨 大家好 我是一路爬坡的阿肥 阿肥在寫本篇範例的時候 認真地想 如果真的有人成功發明出喵喵翻譯機的話 應該會造福各地的奴才們 然後成為人生勝利組吧 情境描述...

鐵人賽 Modern Web DAY 24

技術 【Day 24】 useRef

useRef 是一個可以讓我們抓取到 DOM 節點的 hooks。 實作上非常簡單,直接來看範例吧: import React, { useRef } from...

鐵人賽 Modern Web DAY 14

技術 [DAY14] 一個蘿蔔一個坑之 JSX 幾個坑

我想說的是 JSX 註解的寫法和一般的 HTML 不一樣 寫程式不寫註解,就像是大腸麵線沒加香菜 雖然能,但吃就是少一味;還有些人特別討厭加 寫註解還是有些...

鐵人賽 Modern Web DAY 16

技術 Day15 | React-Saga 見一次就愛上的 async flows

前言 在 Redux 中做非同步的請求其實是很麻煩的,這也是一開始讓我卡關的一個痛點,但好在有 StackOverflow 才沒讓這個痛持續很久。 其實一開始我...

鐵人賽 Modern Web DAY 11

技術 [Day 11 - 網速轉換器] 那個...資料可以分享給我嗎 - 將資料傳入組件

感謝 iT 邦幫忙與博碩文化,本系列文章已出版成書「從 Hooks 開始,讓你的網頁 React 起來」,首刷版稅將全額贊助 iT 邦幫忙鐵人賽,歡迎前往購書...

鐵人賽 Modern Web DAY 23

技術 【Day 23】useMemo

昨天 React.memo 比較像是針對 component 做 memorization,今天要介紹的 useMemo 這個 hooks 則是可以對函式實作...

鐵人賽 Software Development DAY 12

技術 [Day12] 前端開發好朋友 ─ Storybook

嗨 大家好 我是一路爬坡的阿肥 今天是Happy Friday! 也是適合寫鐵人賽文章的好日子喔(疑?) Storybook 簡介 今天阿肥要先插個花,介紹一...

鐵人賽 Modern Web DAY 13

技術 [DAY13] Filter 標題的靈感之我真的一滴都不剩了之真想不出

我想說的是 filter 會建立一個經過指定運算判斷後回傳為真的新陣列,就是這麼簡單 關於 filter 在其他地方我好像已經遇到好幾遍,一直沒有有系統地把...

鐵人賽 Modern Web DAY 15

技術 Day14 | Redux 的改變,Logger 看得見

前言 前兩篇學習了 Redux 的操作方法,雖然 Redux 替我們處理資料真的很方便,但是實際上是得經過 Component、Action、Reducer 三...

鐵人賽 Modern Web DAY 10

技術 [Day 10 - 網速換算器] 換算起來吧 - 資料綁定與組件拆分

感謝 iT 邦幫忙與博碩文化,本系列文章已出版成書「從 Hooks 開始,讓你的網頁 React 起來」,首刷版稅將全額贊助 iT 邦幫忙鐵人賽,歡迎前往購書...

鐵人賽 Modern Web DAY 22

技術 【Day 22】React.memo

昨天講到了 class based component 可以透過 shouldComponentUpdate 比較前一次 props 與 前一次 state 來...

鐵人賽 Software Development DAY 11

技術 [Day11] BABY 你就是我唯一 ─ 獨體(Singleton)

嗨 大家好 我是一路爬坡的阿肥 今天的文章對阿肥來說好輕鬆呀~ 接下來每個模式都那麼好懂就好了(不可能) 前言 在社會、法律道德的規範之下,有些個體希望只存在...

鐵人賽 Modern Web DAY 12

技術 [DAY 12] 司機我要下車之刪除清單中的服務之按得太久腰受不了

我想說的是 預期結果:刪除清單中選定的服務 使用 filter 對陣列做篩選,並且重新設定服務列表 在我們的努力下,上一次練習中已經可以為所欲為的增加我們想...

鐵人賽 Modern Web DAY 14

技術 Day13 | React 的快樂小夥伴 - Redux 事件處理篇

前言 在上一篇的資料處理篇中,我們學習到了如何將資料放到 Store 中儲存,並以 useSelector 將資料取出,而本篇會提及如何使用 Reducer 異...

鐵人賽 Modern Web DAY 9

技術 [Day 09 - 網速換算器] 網速傻傻分不清楚 Mbps? Mb/s? 來寫個單位換算器吧

感謝 iT 邦幫忙與博碩文化,本系列文章已出版成書「從 Hooks 開始,讓你的網頁 React 起來」,首刷版稅將全額贊助 iT 邦幫忙鐵人賽,歡迎前往購書...

鐵人賽 Software Development DAY 10

技術 [Day10] 吃壹LAN就是要硬麵加半熟蛋 ─ 建設者(Builder) <實作篇>

嗨 大家好 我是一路爬坡的阿肥 今天是鐵人賽的第 10 天,已經過了 1/3 了! 最近發現寫文章卡最久的不是寫 code 而是在找歌跟想開場白(整個劃錯重點)...

鐵人賽 Modern Web DAY 21

技術 【Day 21】React 渲染機制

我們都知道使用 React 讓我們的應用可以擁有非常好的效能,但背後裡 React 到底幫我們做了哪些努力呢? 今天就來初探一下 React 的渲染機制! 當我...

鐵人賽 Modern Web DAY 11

技術 [DAY 11] 煉金術就是分解構築之大哥哥來寫 JavaScript 之 ES6 真會玩

我想說的是 解構賦值語法是 ES6 的新特性,可以將陣列或物件中的資料取出成獨立變數 這篇來談 煉金術的基礎 不要瞎掰好嗎 來說說「解構」,當初第一次看...

鐵人賽 Modern Web DAY 8

技術 [Day 08 - 計數器] 一個不夠,給我一次來十個 - JSX 中迴圈的使用

感謝 iT 邦幫忙與博碩文化,本系列文章已出版成書「從 Hooks 開始,讓你的網頁 React 起來」,首刷版稅將全額贊助 iT 邦幫忙鐵人賽,歡迎前往購書...

鐵人賽 Modern Web DAY 20

技術 【Day 20】可能不需要redux (2) - contextAPI

昨天介紹了 useReducer 的用法,但是還缺少了 global state 的機制啊?怎麼會說可能可以不需要 redux 了? 今天就來介紹 contex...