React

[React] create-react-app & Typescript 초기 세팅법 완벽 정리

🥩 Typescript & create-react-app 최근 타입스크립트 강의를 들으면서 create-react-app을 설정하는 법이 궁금했다. 왜냐면 React 제일 많이 사용해보았고 포트폴리오도 React로 주 언어로 개발했기 때문이다. 그리고 앞으로 사용하게될 것이기도 하고, 언제까지나 JS계열로 프로젝트를 진행할 수 는 없다! 그리고 업무시 중요한 eslint 와 preiiter 설정도 해보자! 1. create-react-app을 이용해 typescript 버전으로 설치 2. eslint & preitter typescript 버전으로 설치 이 두가지 버전이 세팅에 가장 중요한 부분이다. 하지만 먼저 알아야 하는 사항들 세가지가 있다 1. Typescript를 사용하는 create-react..

[React] React Life Cycle 생명주기

시작하기 전에 리액트 라이프 사이클에 대해 정확하게 알고 있지 않기에 이 포스트를 작성하기로 했다.이 링크를 참고하면 좀 더 자세하게 LifeCyle을 이해할 수 있다. 앞으로 LifeCylcle의 업데이트된 사항을 위 링크에서 확인해 보고 이전과 비교하면 더 좋을 것이다. 1. 리액트에 라이프 사이클 이란 ? 리액트는 컴포넌트 기반의 View를 중심으로 한 라이브러리 언어이다. 그렇다보니 각각의 컴포넌트에는 라이프 사이클 즉, 컴포넌트의 수명 주기가 존재한다. 컴포넌트의 수명은 보통 페이지에서 렌더링 되기 전 준비 과정에서 시작해 페이지에서 사라질때 끝이난다. 위의 이미지는 리액트의 라이프 사이클을 나타낸 화면이다. 이제 이 각각의 메서드들이 어떤 역할을 하는 지 알아보겠다. 2. 라이프사이클의 분류 ..