리액트 프로젝트에서 타입스크립트 사용하기

이번에 올리게 될 개발 튜토리얼 시리즈에서는 리액트 프로젝트에서 타입스크립트를 사용하는 방법에 대하여 알아보겠습니다. JavaScript 는 Weakly-typed 된 언어이기 때문에 특정 숫자 변수를 선언 한 다음에 그 안에 다른 타입의 값을 담을 수 있어요. 예를 들자면, 숫자로 선언한 변수에 문자열을 넣을 수도 있고, null을 넣을 수도 있고 배열...

이 포스트에서는 여러분들이 타입스크립트를 리액트 프로젝트에서 사용해보기 전에, 알아두면 유용한 타입스크립트의 기초 핵심을 다뤄보게 됩니다. 추후 리액트를 사용할 것이 아니더라 하더라도, 이 튜토리얼에 나와있는 연습을 진행해보시면 타입스크립트를 통해 어떤 도움을 얻을 수 있는지 갈피를 잡을 수 있게 되어 입문에 도움이 될 거예요. 이 튜토리얼에서는 리액트...

이 튜토리얼에서는 타입스크립트가 적용된 리액트 프로젝트를 만드는 방법을 알아보고, 리액트 컴포넌트를 타입스크립트로 작성하는 방법에 대하여 다뤄보게 됩니다. 프로젝트 생성 우선, 타입스크립트를 사용하는 리액트 프로젝트를 만들어볼까요? 타입스크립트를 사용하는 리액트

이번 섹션에서는 타입스크립트를 사용하는 리액트 컴포넌트에서 `useState` 및 `useReducer` 를 사용하여 컴포넌트의 상태를 관리하는 방법과 `useRef` 를 사용하여 컴포넌트 내부에서 관리하는 변수 및 DOM 을 이용하는 방법에 대해서 알아보겠습니다.

이번 튜토리얼에서는 타입스크립트 환경에서 Context API를 제대로 활용하는 방법에 대해서 다뤄보도록 하겠습니다. Context API를 사용함에 있어서, 코드의 구조를 어떻게 가져갈 지에 대해서는 딱 정해진 방법이 존재하지 않습니다. Context 를 준비하는 과정에서 클래스형 컴포넌트를 사용 할 수도 있고, 함수형 컴포넌트를 사용 할 수도 있죠. 함...

이번에 준비한 튜토리얼에서는 TypeScript 환경에서 Redux를 프로처럼 사용하는 방법을 다뤄보도록 하겠습니다. 왜 제목이 "프로처럼"이냐! 사실은 조금 주관적입니다. 이 튜토리얼에서는 지금까지 제가 다양한 TypeScript/Redux 관련 코드를 읽고, 작성해오면서 그 중에서 제가 맘에 들었던 구조를 소개시켜드리겠습니다. 그런데 프로처럼 사용해...