Hello Jay's Programming World!

자바스크립트에서 데이터를 그룹화하고 전달하는 방법으로 Object를 사용합니다. 타입스크립트에서는 Object Type을 통해 Object를 표현합니다. Object Type에 이름을 지정하기 위해 인터페이스를 사용합니다. interface Person { name: string; age: number; } function greet(person: Person) { return "Hello " + person.name; } 위 코드에서 greet 함수의 매개변수로 person 변수를 받고 있습니다. person 변수의 타입은 Person으로 interface로 선언되어 있는 것을 확인할 수 있습니다. Person은 name이라는 string과 age라는 number 변수를 가진 Object로 선언되어 있..

먼저, create-next-app 명령어를 이용해서 기본 프로젝트를 생성합니다. --typescript 명령어를 이용하여 typescript 프로젝트로 설정했습니다. yarn create next-app --typescript nextjs-typescript-redux 그 다음은 필요한 패키지들을 설치합니다. yarn add redux redux-thunk next-redux-wrapper react-redux @types/react-redux 패키지 설치가 완료되었으면, 프로젝트 루트(root)에 redux라는 이름의 폴더를 생성합니다. 그리고 그 내부에 store.ts, types.ts 파일과 actions, reducers라는 이름의 폴더를 생성합니다. 아래 그림과 같이 생성되면 됩니다. type..

ESLint란? JavaScript 코드에서 발견 된 문제 패턴을 식별하기위한 정적 코드 분석 도구. Prettier란? 코드 포멧터(Code Formatter) Next.js 프로젝트에 ESLint/Prettier 적용하기 (VSCode) 프로젝트 생성 npx create-next-app --typescript 저는 typescript를 사용할 예정이므로 —typescript 옵션을 추가했습니다. ESLint 설치 npm i eslint --save-dev ESLint 설정하기 eslint --init 위 명령어를 터미널에 실행하면 eslint 설정이 시작됩니다. 여러가지 질문들이 나오는데, 저는 아래와 같이 설정했습니다. ❯ eslint --init ✔ How would you like to use ..

변수 타입 지정 let name: string = 'kim'; name = 'lee';// OK name = 100;// Error 가장 기본적인 기능으로는 변수의 타입 지정 기능이 있습니다. 위 예제에서는 name이라는 변수를 문자열(string) 타입으로 지정했습니다. 그렇기 때문에 'lee' 라는 문자열은 name 변수에 할당이 가능하고, 100은 Number 타입이기 때문에 name에 할당할 수 없습니다. 배열(Array) 타입 지정 let array: string[] = ['kim', 'lee']; 배열의 타입도 지정이 가능합니다. 위와 같이 [] 키워드를 사용하면 배열을 의미하고 그 앞에 타입을 붙이면 배열에 들어 올 수 있는 타입을 지정할 수 있습니다. 객체(Object) 타입 지정 let ..