개발 공부 시리즈24 [RTK] Typescript todoList 만들기 (5) - eslint, prettier 적용해보기- 1 ※ 해당글은 약간의 시행착오가 있어 모든 포스팅이 완료 된 후 따라해주세요. [RTK] Typescript todoList 환경에 eslint, prettier 적용하기 - 1 내가 만드는 TodoList 앱 RTK + Typescript 환경에 ESLint와 Prettier를 적용해 보겠다. ESLint? ESLint ESLint는 ECMAScript/JavaScript 코드에서 발견된 패턴을 식별하고 보고하는 정적 코드 분석 도구이다. 코드의 일관성을 높여주고 버그를 방지하는 것이 주목적이다. 쉽게 말하면 코드의 규칙을 적용하여, 문제를 사전에 방지할 수 있도록 하는 툴이다. 규칙을 커스텀할 수 도 있다. https://eslint.org/ Find and fix problems in your Jav.. 2022. 11. 1. 02:08 [RTK] Typescript todoList 만들기 - (4) 컴포넌트 분리하기 이전 포스팅 글 - 2022.10.25 - [개발 공부 시리즈/Redux-ToolKit] - [RTK] Typescript todoList 만들기 - (1) - 2022.10.26 - [개발 공부 시리즈/Redux-ToolKit] - [RTK] Typescript todoList 만들기 - (2) 기본적인 디자인하기 - 2022.10.27 - [개발 공부 시리즈/Redux-ToolKit] - [RTK] Typescript todoList 만들기 - (3) 삭제 기능 만들기 [RTK] Typescript todoList 만들기 - (4) 컴포넌트 분리하기 이번 포스팅에서는 RTK TODO APP의 컴포넌트 분리를 해보겠다. 컴포넌트 분리 기준은 개발자마다 각각 달라서 자신이 편한 대로 쓰는 게 가장 좋기는.. 2022. 10. 28. 02:00 [RTK] Typescript todoList 만들기 - (3) 삭제 기능 만들기 [RTK] Typescript todoList 만들기 - (3) 삭제 기능 만들기 이전 포스팅에서는 추가 기능, material UI를 사용하여 디자인 등을 만들었다. 간단한 TodoListApp에 여러가지 설정 및 기능 등을 적용하면서 계속 구현해 볼 계획이다. 이전 포스팅 - 2022.10.25 - [개발 공부 시리즈/Redux-ToolKit] - [RTK] Typescript todoList 만들기 - (1) - 2022.10.26 - [개발 공부 시리즈/Redux-ToolKit] - [RTK] Typescript todoList 만들기 - (2) 기본적인 디자인하기 이번 포스팅은 삭제 기능을 구현하도록 한다. 현재 TodoList는 카드 형태로 구현이 되어있다. 휴지통 버튼을 누르면 삭제가 되도록.. 2022. 10. 27. 01:50 [인프런 강의] zerocho Slack 클론 코딩 (9) - 커스텀 훅 만들기 이전 포스팅은 회원가입 페이지 만들기에 대해 포스팅하였다. 2022.10.24 - [개발 공부 시리즈/Slack클론코딩] - [인프런 강의] zerocho Slack 클론 코딩 (8) - 회원가입 페이지 만들기 이번 포스팅에서는 커스텀 훅을 만들어보겠다. ※ 이 포스팅은 zerocho님의 slack 클론 코딩 강좌를 따라 하면서 정리해놓은 포스팅입니다. 1. 중복 코드 제거하기 alecture/pages/SignUp/index.tsx const SignUp = () => { const [email, setEmail] = useState(''); const [nickname, setNickName] = useState(''); const [password, setPassword] = useState('').. 2022. 10. 26. 13:33 [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 이전 1 2 3 4 다음 728x90
