TypeScript : 투두리스트 만들기 (5단계 - React Query + Axios )

TypeScript : 투두리스트 만들기 (5단계 - React Query + Axios )

TypeScript : 투두리스트 만들기 (4단계 - Thunk + Axios ) TypeScript : 투두리스트 만들기 (3단계 - Json-server) TypeScript : 투두리스트 만들기 (2단계 - Redux Toolkit) TypeScript : 투두리스트 만들기 (1단계 - React Props) Lv1 React를 이용한 TodoList를 만듭니다. Todo를 Create, zerotonine2da.tistory.com Lv5 Lv4의 과제에서 Redux를 react-query로 리팩토링 합니다. Keyword query 1. React-Query 설치 yarn add react-query 2. index.tsx import ReactDOM from 'react-dom/client';..

  • format_list_bulleted TIL :: Today I Learned
  • · 2023. 12. 17.
  • textsms
TypeScript : 투두리스트 만들기 (4단계 - Thunk + Axios )

TypeScript : 투두리스트 만들기 (4단계 - Thunk + Axios )

TypeScript : 투두리스트 만들기 (3단계 - Json-server) TypeScript : 투두리스트 만들기 (2단계 - Redux Toolkit) TypeScript : 투두리스트 만들기 (1단계 - React Props) Lv1 React를 이용한 TodoList를 만듭니다. Todo를 Create, Delete, Update(완료/취소) 가 가능해야 합니다. 이 zerotonine2da.tistory.com Lv4 Lv4의 과제에서 데이터베이스의 비동기 처리 로직을 추가합니다. Lv3의 코드에서, createAsyncThunk를 추가하여 json-server 상태 관리 로직을 다루도록 합니다. Keyword Thunk 1. redux -thunk 설치 yarn add redux-thunk ..

  • format_list_bulleted TIL :: Today I Learned
  • · 2023. 12. 17.
  • textsms
TypeScript : 투두리스트 만들기 (3단계 - Json-server)

TypeScript : 투두리스트 만들기 (3단계 - Json-server)

TypeScript : 투두리스트 만들기 (2단계 - Redux Toolkit) TypeScript : 투두리스트 만들기 (1단계 - React Props) Lv1 React를 이용한 TodoList를 만듭니다. Todo를 Create, Delete, Update(완료/취소) 가 가능해야 합니다. 이때, useState와 Props만을 사용합니다. Keyword props drillin zerotonine2da.tistory.com Lv3 Lv3의 과제에서 json-server를 추가합니다. Todo를 Create, Delete, Update(완료/취소), Read(From Json-server)가 가능해야 합니다. Lv2의 코드를 고쳐서 만듭니다. Keyword DB 1. json-server 설치 y..

  • format_list_bulleted TIL :: Today I Learned
  • · 2023. 12. 16.
  • textsms
TypeScript : 투두리스트 만들기 (2단계 - Redux Toolkit)

TypeScript : 투두리스트 만들기 (2단계 - Redux Toolkit)

TypeScript : 투두리스트 만들기 (1단계 - React Props) Lv1 React를 이용한 TodoList를 만듭니다. Todo를 Create, Delete, Update(완료/취소) 가 가능해야 합니다. 이때, useState와 Props만을 사용합니다. Keyword props drilling, state 끌어올리기 1. 프로젝트 생성 : npx create-re zerotonine2da.tistory.com Lv2 React + redux-toolkit를 이용한 TodoList를 만듭니다. Todo를 Create, Delete, Update(완료/취소)가 가능해야 합니다. Lv1의 코드를 고쳐서 만듭니다. Keyword 전역 상태 관리, redux 1. props drilling과 us..

  • format_list_bulleted TIL :: Today I Learned
  • · 2023. 12. 15.
  • textsms

React : 리덕스로 todolist만들기

0. export default 와 export 차이점 (1) export default 1) 하나의 모듈에서 단 하나의 default 2) import 할때, {중괄호}없이 직접 지정 가능 3) 주요 또는 가장 중요한 기능이나 컴포넌트 보낼때 사용 * export default Home * import Home from './pages' (2) export 1) 하나의 모듈에서 여러개의 named export 가능 2) import할때 {중괄호}에 명시해야함 3) 여러 기능이나 컴포넌트를 하나의 모듈에서 보낼때 사용 * export const myFunction = ()=>{} * import {myFunction} from './pages' 1. 리덕스 설정 (3가지) (1) [Redux - Conf..

  • format_list_bulleted React
  • · 2023. 11. 25.
  • textsms

#09 리액트 입문 : 1차로 만들었던 todolist 리팩토링

1. 처음으로 만들었던 투두리스트 [2023.11.06] 리팩토링 ! https://zerotonine2da.tistory.com/64 #08 리액트 입문 :: todolist 만들기 (리액트 컴포넌트 분리) TIL 리액트로 투두리스트를 구현하면서, JSX문법 사용과 랜더링에 대해 배울 수 있었다. 리랜더링이 끝나는 시점에 대해 알 수 있었고, useState를 사용하여 리액트에게 변경값을 알려주는 개념을 zerotonine2da.tistory.com 2. 개선 내용 1. 태그의 onSubmit 사용 2. id값 = uuid 사용 3. Working과 Done부분을 하나의 컴포넌트 로 만들기 --중복 줄이기 - 기존에는 Contents라는 컴포넌트 안에 (Working + Done부분을 2개의 DIV태그..

  • format_list_bulleted TIL :: Today I Learned
  • · 2023. 11. 8.
  • textsms