iT邦幫忙

react相關文章
共有 373 則文章

技術 了解 React state 與簡單實作

挑戰 React 第十二篇 什麼是 React state? 我們上篇有提到,可使用 props 渲染我們要的資訊,但props是唯讀的,那萬一我要在 comp...

技術 了解 React Props 與簡單實作

挑戰 React 第十一篇 什麼是 props 大家還記得我們前幾篇說過 React Component嗎? Component 可為function Comp...

技術 淺談 React Class Component 與小小實作

挑戰 React 第十篇 什麼是 Class Component? 與上篇提到的 function Component 的前三點敘述流程幾乎一樣,只是把 fu...

技術 了解 React function Component 與實作

挑戰 React 第九篇 什麼是 Function Component? 上篇文章我們了解Component的概念就是UI的其中一個部分,也可以重複利用。 而以...

技術 什麼是 React Component?

挑戰 React 第八篇 目錄 什麼是組件? 如何用組件達成程式碼重複使用? 兩種組件種類 學習心得 什麼是組件? Component,中文...

技術 介紹 create-react-app 建立出來的資料夾結構 (下)- 原來只有一個html檔案

挑戰 React 第七篇 上篇了解了package.json,此篇會介紹剩下來的檔案與資料夾。 資料夾結構介紹 檔案 用語法糖 create-react-ap...

技術 介紹 create-react-app 建立出來的資料夾結構 (上)- package.json 作用是什麼?

挑戰 React 第六篇 前情提要:若還沒有嘗試用 create-react-app,建議先去看安裝React 第三篇文章。 資料夾結構介紹 若第一次寫Reac...

技術 照著React官方網站學習JSX

挑戰 React 第五篇 實作範例 在了解什麼是jsx前,我們先來看實作範例,以下有兩個index.html檔案的程式碼,差異在於有沒有編譯成瀏覽器看得懂得ja...

技術 看官方文檔安裝 React之選擇方式竟然這麼多 (下) - 學習高手安裝自己要的東西

挑戰 React 第四篇 講完透過CDN連結的方式載入React的函式庫與Create React App快速安裝,此篇會寫最後一點高手才用的安裝方式 =&gt...

技術 看官方文檔安裝 React之選擇方式竟然這麼多 (中):快速建立React專案的語法糖?

挑戰 React 第三篇 上一篇講完透過CDN連結的方式載入React的函式庫,此篇會寫第二點 Create React App。 安裝方式 CDN 連結 (...

鐵人賽 Modern Web DAY 30

技術 [Day 30 - 臺灣好天氣] 發布上 Github Pages 不夠,還要變成手機 App!還有那些重要但故意先不告訴你的內容

昨天我們已經把「即時天氣 App」發佈到 Github Pages 上了並且正名為「臺灣好天氣」。 但是這類型的天氣 App 如果可以安裝到手機上的話有多好呢?...

鐵人賽 Modern Web DAY 30

技術 Day 30 - MySQL Trigger MD5加密 & 同步Fetch API

上一章 Day 29 - React Tree Graph 樹狀結構圖 在這隱私權高漲的年代, 所有個資與重要資訊都必須加密 之前有寫過一篇用Java做MD5加...

鐵人賽 Modern Web DAY 29

技術 Day 29 - React Tree Graph 樹狀結構圖

上一章 Day 28 - React And BootStrap 卡片式資訊 Card 樹狀結構圖是許多網站都會用到的東西 大部分是資料夾結構, 抽屜式結構.....

鐵人賽 Software Development DAY 30

技術 [Day30] 總而言之 融會貫通最重要

嗨 大家好 我是一路爬坡的阿肥 雖然是第一次參加 有很多不足的地方 但是謝謝有訂閱這個系列文章的你們 讓阿肥有繼續寫下去的動力 之後還有機會的話 就繼續再來看我...

鐵人賽 Modern Web DAY 28

技術 [Day 28 - 即時天氣] 保存與更新使用者設定的地區資訊 - localStorage 與 useEffect 的搭配使用

useEffect, localStorage 昨天完成了讓使用者設定地區的表單頁面後,今天就讓我們來實作設定地區這個功能。最終的目標是當使用者按下儲存後,根據...

鐵人賽 Software Development DAY 29

技術 [Day29] 操作大量資料的好幫手 ─ 迭代器(Iterator) <實作篇>

嗨 大家好 我是一路爬坡的阿肥 昨天晚上搭立榮的飛機回來 真心覺得座位大 還有飲料可以喝 而且只要40幾分就到了 已經回不去坐船省錢的堅持啦 顧客的資訊 先建...

鐵人賽 Modern Web DAY 30

技術 [DAY30] 被 React react 的後端工程師 - 後記

一開始會這麼定題目,其實是起源于我對前端的挑食,因為我不喜歡調畫面 左邊一點右邊一點這種事情我真的不喜歡做 所以取翻譯中 過敏 的意思來形容我的 React 學...

鐵人賽 Modern Web DAY 28

技術 Day 28 - React And BootStrap 卡片式資訊 Card

Day 27 - React And BootStrap 動態橫幅廣告 Carousel 上一章做了橫幅廣告 現在加入卡片式資訊, 我們一樣使用Reactstr...

鐵人賽 Modern Web DAY 27

技術 [Day 27 - 即時天氣] React 中的表單處理(Controlled vs Uncontrolled)以及 useRef 的使用

keywords: useRef, controlled components, uncontrolled components, form 昨天已經建立好了天...

鐵人賽 Modern Web DAY 27

技術 Day 27 - React And BootStrap 動態橫幅廣告 Carousel

上一章 Day 26 - React Router And Link 在做前端頁面時, 許多人都使用Bootstrap 簡單易用, 大大的加快了開發速度 而它也...

鐵人賽 Software Development DAY 28

技術 [Day28] 操作大量資料的好幫手 ─ 迭代器(Iterator) <模式篇>

嗨 大家好 我是一路爬坡的阿肥 今天要介紹最後一個模式了 真的是...太開心啦! 今天是澎湖遊最後一天,還是一樣跟大家分享個照片~ 最想念的應該是漂亮的海水跟夕...

鐵人賽 Modern Web DAY 29

技術 [DAY29] 多 DOM 的動畫之我等了這篇 29 天之我完全不介意

我想說的是: 其實基礎的多個 DOM 的動畫,跟一個差不多 多個的就是專業的部分,我不清楚 上一篇中已經可以控制一個 DOM 元素的動畫效果 而想控制多個動...

鐵人賽 Modern Web DAY 26

技術 [Day 26 - 即時天氣] 切換顯示不同頁面 - 子層組件修改父層組件資料狀態的方式

今天設計師又氣噗噗的打電話來,跟我說這幾天她回家參加朋友婚禮,想說來看一下天氣資訊,沒想到即時天氣 App 的地點卻仍停留在「台北」,竟然找不到切換地點的地方,...

鐵人賽 Software Development DAY 27

技術 [Day27] 為厲害的怪獻上會心一擊 ─ 策略(Strategy) <實作篇>

嗨 大家好 我是一路爬坡的阿肥 今天是澎湖遊 Day3,先來分享個照片吧~ 南海跳島之旅+海洋牧場get開牡蠣技能 晚上參加大人們的喝喝大會 充實的一天~...

鐵人賽 Modern Web DAY 28

技術 [DAY28] React 動畫動得非常厲害

我想說的是: 動畫好酷炫耶,以前完全沒用過就跑來寫後端 react-transition-group 真的很厲害 看完之後...我還是不會想寫前端耶 用 t...

鐵人賽 Modern Web DAY 26

技術 Day 26 - React Router And Link

上一章 Day 25 - React Fetch 向後端API請求資料(2) React 導頁與控制使用 react-router-dom 安裝的話只要按CTR...

鐵人賽 Modern Web DAY 25

技術 [Day 25 - 即時天氣] 自己的鉤子自己做 - 建立 Custom Hook

keywords: Custom Hook 不知道這幾天在修改即時天氣 App 時,特別針對 WeatherApp.js 這支檔案,你有沒有覺得內容好像多到找個...

鐵人賽 Modern Web DAY 27

技術 [DAY27] 如果你快樂就拍拍手之在 react 使用動畫效果之基於 CSS

我想說的是: 其實使用起來也是很簡單,但是對於 react 本身的操作要夠熟悉 最近買了薩爾達織夢島,有點太投入 整個早上都在玩,本來早上就該發文的 這一篇...

鐵人賽 Modern Web DAY 30

技術 Day30 | Component 後, TypeScript 的定位在哪?

前言 這三十天內,我們學習了 React 及 TypeScript 的基本用法,最後一天想和大家聊聊,筆者是怎麼在專案中使用 TypeScript 的,或許有些...