개발 공부 시리즈/Redux-ToolKit10 [RTK] Typescript todoList 만들기 - (2) 기본적인 디자인하기 [RTK] Typescript todoList 만들기 - (2) 기본적인 디자인하기 이전 포스팅에 이어서 기본적인 디자인을 진행하겠다. 2022.10.25 - [개발 공부 시리즈/Redux-ToolKit] - [RTK] Typescript todoList 만들기 - (1) 라이브러리는 Meterial UI 를 사용하여 진행하겠다. Meterial UI는 React를 좀 더 직관적이게 보여줄 수 있는 라이브러리이다. 이전 포스팅에서는 addTodo 기능 구현까지 진행하였다. 전체적인 디자인을 구성한 후, 컴포넌트를 분리해야겠다. 1. 디자인 틀 만들기 App.tsx를 다음과 같이 변경한다. //App.tsx import React,{ useState } from 'react'; import { AppDis.. 2022. 10. 26. 01:40 [RTK] Typescript todoList 만들기 - (1) [RTK] Typescript todoList 만들기 Redux-Toolkit과 Typescirpt를 사용한 TodoList를 정리하며, 만들어 보는 시간을 가져보겠다. 1. 프로젝트 설치 typescript 템플릿을 이용하여 다운로드하도록 하겠다. 자신이 원하는 디렉터리로 cmd 창을 열고 다음과 같은 명령어를 입력하면 된다. npx create-react-app rtk-todo-list --template typescript 설치가 완료되면 만들어진 디렉토리로 이동하여 vsCode로 프로젝트를 연다. 자세한 Redux-Toolkit 설치방법은 이 포스팅을 참고하면 된다. 2022.10.03 - [개발 공부 시리즈/Redux-ToolKit] - [React] Redux-Toolkit 초기 설치 [Rea.. 2022. 10. 25. 02:30 [React] Redux-Toolkit TypeScript Quick Start . Redux-Toolkit TypeScript Quick Start https://ko.redux.js.org/tutorials/typescript-quick-start TypeScript Quick Start | Redux - How to set up and use Redux Toolkit and React-Redux with TypeScript ko.redux.js.org 이번 포스팅에서는 Redux-Toolkit TypeScript Quick Start 공식문서를 보며 공부해 보겠다. 리덕스 툴킷에서 타입 스크립트를 간결하게 사용하는 예제를 따라 하면서 구현할 것이다. Redux-Toolkit 설치 방법을 이전 포스팅에서 정리해놓았다. 2022.10.03 - [개발 공부 시리즈/Redux-Tool.. 2022. 10. 20. 15:43 [React] Redux-Toolkit 초기설치 Redux-Toolkit Redux-toolkit은 기존 Redux를 편리하고 간편하게 사용할 수 있는 라이브러리이다. Redux코드를 보다 더 간결하게 작성할 수 있고, Redux 보다 효율적이다. 기존 Redux의 스토어 구성, 많은 패키지 추가 등등의 문제점을 개선하기 위해 나왔다. createStore => configureStore action, reducer => createSlice 등의 사용법이 좀더 개발자 친화적으로 작성할 수 있다. Redux-ToolkIt 설치 방법 1. Redux-Toolkit을 설치하기 위해서는 우선 npm(Node 패키지 관리자)가 설치 되어있어야한다. 사용방법은 아래와 같다. 더보기 https://nodejs.org/ko/ Node.js Node.js® is a.. 2022. 10. 3. 17:38 이전 1 2 다음 728x90
