타입스크립트로 리액트 Hooks 사용하기 (useState, useReducer, useRef)목차 프로젝트 생성 useState 및 이벤트 관리 카운터 만들기 인풋 상태 관리하기 useRef 작성 변수 값 관리하기 DOM 관리하기 useReducer 카운터를 useReducer 로 다시 구현하기 ReducerSample 구현하기 정리
리액트 컴포넌트 타입스크립트로 작성하기목차 프로젝트 생성 Arrow vs Function 새로운 컴포넌트 만들기 interface vs type React.FC 의 장단점 props에 기본적으로 children 이 있어 사용하기 편하다 컴포넌트의 defaultProps, propTypes, contextTypes 를 설정 할 때 자동완성이 될 수 있다는
타입스크립트 기초 연습하기 (타입 별명, 제네릭)목차 Type Alias 사용하기 Generics 함수에서 Generics 사용하기 interface 에서 Generics 사용하기 Type Alias 에서 Generics 사용하기 클래스에서 Generics 사용하기 Type Alias 사용하기 type은 특정 타입에 별칭을 붙이는 용도로 사
타입스크립트 기초 연습하기 (셋팅, 기본 타입, 함수타입, 인터페이스)목차 셋팅 tsconfing.json 타입스크립트 파일 만들기 및 컴파일 src/practice.ts npx tsc 기본 타입 부울 (Boolean) 숫자형 (Number) 문자열 (String) 배열 (Array) 튜플 (Tuple) 열거 (Enum) Any Void Null
React에서 TypeScript 사용하기목차 JavaScript의 단점 JS 편집기의 자동완성의 불편함 함수 파라미터 타입 체킹을 안해줌 리덕스를 사용할 때 불편함 리액트 컴포넌트 쓸 떄 어떤 props를 넣어야하는지 에디터에서 알 방법이 없다. TypeScript를 써야 하는 이유 JavaScript의 단점 JS 편집기의 자동완성의 불편
WebStorm 설정하기목차 첫 설치 단축키 셋팅 Prettier 셋팅 테마셋팅 버벅거림 셋팅 웹스톰 처음으로 초기화하기 첫 설치 Material Theme 만 설치 ( 그리고 cmd + , - Plugins 에서 Material Theme 비활성화, 테마 자체는 Da
자연스럽게 Node Version 바꾸기 🍃 (feat. nvm)목차 개요 Step 1. nvm 설치 사전준비 Step 2. nvm 설치 Step 3. nvm 설치 확인 환경변수 설정 추가하기 환경변수 설정 적용하기 Step 4. nvm을 이용하여 Node.js 설치
React Hooks + Mobx + TS - 슈퍼마켓 구현하기 -목차 시작 데코레이터 설정 X 프로젝트 초기화 및 폴더 구조 App & Store 수정 src/App.tsx src/useStore.ts Store 추가 src/counter.ts src/coun
React Hooks + Mobx 예제 - 슈퍼마켓 구현하기 -목차 소개 시작 데코레이터 설정 X 프로젝트 초기화 및 폴더 구조 카운터 만들기 new: src/stores/counter.js new: src/useStore.js edit: src/App.js new:
리액트에서 Mobx 예제 - 카운터 -목차 카운터 만들기 Class Component’s Mobx 1 Class Component’s Mobx 2 : @데코레이터를 이용 함수형태(Hooks)를 이용한 Mobx 문제점 Mobx 스토어 분리시키기 Class Componen