iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
Software Development

.NET Core與React組合開發技 系列

前端三刀流(Angular , React , Vue)
在現今時代已是不可缺少的基本配備
而每套框架都有其深度
都要全全掌握
說實在十分困難也要花很多時間
每套前端框架搭配的後端選擇又都不同
此次就暫時以.net core web api來搭配React
做開發經驗分享

鐵人鍊成 | 共 30 篇文章 | 11 人訂閱 訂閱系列文 RSS系列文
DAY 1

.NET Core與React組合開發技_第01天_前言_專案建立與大致介紹

2022鐵人賽第一天文章,讀者朋友們好來稍微探究一下於asp.net core中搭配React前端框架的開發在這30天成蝶的過程 我想React本身很重ES6和...

2022-09-12 ‧ 由 Samuel 分享
DAY 2

.NET Core與React組合開發技_第02天_調整React範本產生產品列表清單_JSX、元件狀態介紹

在此微調Home.js來做測試 可在Home 元件進行建構子中state初始化state(狀態)就像 ReactJS 組件的資料狀態暫存。state manag...

2022-09-13 ‧ 由 Samuel 分享
DAY 3

.NET Core與React組合開發技_第03天_增加產品詳細頁元件

於~\src\components\ 下新增一個ProductDetails.js 元件 ~\src\components\ProductDetails.js...

2022-09-14 ‧ 由 Samuel 分享
DAY 4

.NET Core與React組合開發技_第04天_React狀態(State)Stateless跟Stateful比較

React 組件具有“狀態”的概念。在產品列表和產品詳細元件中都可看到有所謂的state 採用 javascript 物件形式,該物件會屬於private的並由...

2022-09-15 ‧ 由 Samuel 分享
DAY 5

.NET Core與React組合開發技_第05天_產品清單連結至詳細頁

我們可到~\ClientApp\src\App.js去更改產品詳細頁路由多增加id傳參來作為唯一識別 import React, { Component }...

2022-09-16 ‧ 由 Samuel 分享
DAY 6

.NET Core與React組合開發技_第06天_單一組件內部state_跨組件溝通props

前面有稍微介紹到所謂的狀態State,但 React 還有另一個技巧來獲取數據。如果要在組件之間進行通信,則需要使用 props。 在state是私有內部的狀...

2022-09-17 ‧ 由 Samuel 分享
DAY 7

.NET Core與React組合開發技_第07天_child元件補上key

在此要來修正console報的錯誤Warning: Each child in a list should have a unique "key&qu...

2022-09-18 ‧ 由 Samuel 分享
DAY 8

.NET Core與React組合開發技_第08天_Class元件和Function元件

在React中元件的創建分為透過Class的Component (可使用state跟props) import React, {Component} from...

2022-09-19 ‧ 由 Samuel 分享
DAY 9

.NET Core與React組合開發技_第09天_重構React元件

重構於程式世界代表的是在不變動既有邏輯下去優化改寫程式碼藉此達到覆用性佳或者提升可讀性甚至性能的一段過程 目前Home.js下Produce清單是直接寫在此的在...

2022-09-20 ‧ 由 Samuel 分享
DAY 10

.NET Core與React組合開發技_第10天_後端api endpoint串接

在此我們開始來產生動態後端api針對Controllers 目錄右鍵新增控制器選api ~\Controllers\ProductController.cs...

2022-09-21 ‧ 由 Samuel 分享