coding- w00se

React에서는 컴포넌트(component) 외부에서 상태(state)를 관리하기 위한 방법으로 useReducer가 제공됩니다. useState와 useReducer 모두 상태를 관리하기 위한 Hook으로 어느 것을 사용해도 문제가 없지만 프로젝트 규모가 큰 경우 useReducer를 사용하는 것이 편리할 거 같습니다😊 오늘은 typescript로 useReducer를 사용하는 예제를 정리했습니다. useReducer에 대한 자세한 설명은 아래 공식 문서에서 확인할 수 있습니다. https://reactjs.org/docs/hooks-reference.html#usereducer Hooks API Reference – React A JavaScript library for building user in..

Typescript도 연습하고 React에도 적응하기 위해 기초부터 다시 연습하려 합니다. 연습은 벨로퍼트님의 '벨로퍼트와 함께하는 모던 리액트'로 진행했습니다. 해당 게시글은 React를 Typescript로 연습하면서 타입 선언, 기존 Javascript를 사용했을 때와 다른 점을 위주로 기록했습니다. React에 대한 개념과 자세한 설명은 아래 링크에서 확인 가능합니다😊 https://react.vlpt.us 벨로퍼트와 함께하는 모던 리액트 · GitBook 벨로퍼트와 함께하는 모던 리액트 본 강의자료는 패스트캠퍼스 온라인 강의에서 제공하는 리액트 강의에서 사용되는 강의 문서입니다. 이 튜토리얼은 여러분들이 JavaScript 의 기초를 잘 알고있 react.vlpt.us Props의 각 속성에 타..

Typescript에서의 Function, Obejct, Interface를 정리해 보았습니다. Function Typescript에서는 매개 변수와 반환 값에 타입을 명시할 수 있습니다. 지정한 값과 다른 값이 전달 또는 반환되면 컴파일 에러를 발생시킵니다. function sum(a: number, b: number): number { return a+b; } const res: number = sum(100, 11); console.log(res); // 111 sum(100, "100"); // error Function 관련 유용한 기능으로는 선택 매개 변수가 있습니다. 매개 변수 이름 옆에 ?를 붙이면, 함수 사용 시 해당 매개 변수의 전달을 생략 가능합니다. function greet(nam..

Typescript는 정적 타입 언어로 변수의 타입이 컴파일할 때 결정됩니다. 따라서 타입 오류를 컴파일 타임에 확인할 수 있는 장점이 있습니다. 오늘은 Typescript에서 사용되는 타입에 대해 정리를 해보았습니다. 원시 타입 - string: 문자열 - number: 숫자 - boolean: 논리 * javascript에서는 int와 float에 대응되는 타입이 없으며, 모두 number을 사용한다고 합니다. const str1: string = "hello"; const num1: number = 123; const num2: number = 123.123; const bool1: boolean = true; console.log(str1); console.log(num1); console.log..

프로젝트를 시작하기 전 Typescript를 연습할 필요가 있어 Typescript를 실행할 수 있는 환경에 대해 알아보았습니다. 여러 방법이 존재하겠지만 간단히 연습할 수 있는 방법은 아래 두 가지가 있는 거 같습니다. 1. tsc로 Typescript 파일을 Javascript 파일로 컴파일한 후 실행시키기 https://code.visualstudio.com/docs/typescript/typescript-compiling TypeScript Compiling with Visual Studio Code Learn about TypeScript compiling with Visual Studio Code. code.visualstudio.com 설치 방법은 아래와 같습니다. npm install -D..