iT邦幫忙

鐵人檔案

2023 iThome 鐵人賽
回列表
Modern Web

我轉生成前端貓咪踏入React地獄的那些事 系列

以簡單的入門基礎為主,會分為兩個部分:
第一個部分會簡單介紹React會用到的JavaScript ES6的一些概念
第二個部分會以React官方的Doucument和freecodecamp為基礎來做介紹
希望也能有越來越多人投入React這個圈圈~

參賽天數 25 天 | 共 25 篇文章 | 1 人訂閱 訂閱系列文 RSS系列文
DAY 1

Day 1 參賽動機以及題目選擇和預計大綱

參賽動機 一開始想對於學習前端時間有一些得自己留下些什麼,所以題目本來是要分享一些些網頁鐵三角的一些心得,但後來發現我要在一邊學框架的時間一邊寫鐵人賽,可能會有...

2023-09-15 ‧ 由 HsienLu 分享
DAY 2

Day 2 My VS Code Tour

簡介 首先第一邊當然是介紹我們的生財工具VS Code啦~相信大家都有自己習慣的環境和模式,今天來分享我的VS Code相關的開發設定。 VS Code概述 V...

2023-09-16 ‧ 由 HsienLu 分享
DAY 3

Day 3 查詢陣列的方法-forEach & map

在學習React之前,會需要瞭解一些javascript的基礎概念,常言道"javascript學得好,react沒煩惱",其中陣列的方法倒...

2023-09-17 ‧ 由 HsienLu 分享
DAY 4

Day 4 操作陣列的方法 Part.1-push & pop

今天也是介紹陣列,其實不光是React陣列在程式語言裡面扮演了舉重無輕的地位,也是很常需要被處理的東西,相信大家都有看過類似下面這種圖,今天會針對push,po...

2023-09-18 ‧ 由 HsienLu 分享
DAY 5

Day 5 操作陣列的方法 Part.2-shift & unshift

接著昨天的陣列操作方法,今天會針對shift,unshift做介紹 .shift() shift有移除的意思,這這裡也確實是移除陣列的值,但只有移除首位,裡面...

2023-09-19 ‧ 由 HsienLu 分享
DAY 6

Day 6 其他的陣列方法 slice & splice

前兩天介紹的4個方法:shift,unshift,pop,push都有一個共通點是,都會修改原本的陣列。接下來要介紹的slice與上述的不同,==不會改變原本的...

2023-09-20 ‧ 由 HsienLu 分享
DAY 7

Day 7 搜尋陣列的方法-find,findIndex & filter

今天介紹的三個語法是針對陣列的搜尋功能,有find(),findIndex(),filter() .find() 引用MDN的描述"find() 方法...

2023-09-21 ‧ 由 HsienLu 分享
DAY 8

Day 8 字串陣列互相變化的方法 split & join

今天要來介紹的是字串怎麼變成陣列還有陣列怎麼變成字串,在陣列的方法中已經存在著與字串互相轉換的方法,只是分別是不同的語法,首先是字串轉陣列的方法 .split(...

2023-09-22 ‧ 由 HsienLu 分享
DAY 9

# Day 9 函式與箭頭函式

函式function 在 React 中,會經常使用函數來建立和管理React中的各項元件,而React架構的網頁實際上又是由個元件組成的,所以在進入React...

2023-09-23 ‧ 由 HsienLu 分享
DAY 10

Day 10 物件(Object)

在前端這個花花綠綠的世界,物件是一個傳遞資料很重要的形式,大家熟悉的json檔,裡面大部分都是由各種陣列和物件所構成的,所以身為一個前端框架,怎麼樣處理物件也是...

2023-09-24 ‧ 由 HsienLu 分享