TypeScript

TypeScript

TypeScript 구조적 타이핑에 익숙해지기

자바스크립트는 본질적으로 '덕 타이핑(duck typing)' 기반이다. 덕 타이핑은 객체가 어떤 타입에 부합하는 변수와 메서드를 가지는 경우 객체를 해당 타입에 속하는 것으로 간주하는 것이다. 어떤 함수에 매개변수 값이 요구사항을 만족한다면 타입이 무엇인지 신경쓰지 않는다는 것인데 타입스크립트는 이런 동작을 그대로 모델링한다. 구조적 타이핑을 제대로 이해한다면 오류인 경우와 오류가 아닌 경우의 차이를 알 수 있고, 더욱 견고한 코드를 작성할 수 있다. 어떤 2D 벡터 타입을 다룬다고 가정해보자. interface Vector2D { x: number; y: number; } 벡터의 길이를 계산하는 함수는 다음과 같다. function calculateLength(v: Vector2D) { return ..

TypeScript

TypeScript 설정 이해하기(tsconfig: noImplicitAny, strict NullChecks)

1. TypeScript 설정 이해하기 타입스크립트 컴파일러는 언어의 핵심 요소에 영향을 미치는 몇 가지 설정을 포함하고 있다. 다음의 코드가 오류 없이 타입 체커를 통과할 수 있을까? function add(a, b) { return a + b; } add(10, null); 이 질문에는 ts 설정이 어떻게 되어있는지 알아야 정확히 답할 수 있다. 타입스크립트 컴파일러에는 100 가까이 되는(또는 그 이상의) 설정 옵션이 존재하며 이 설정은 커맨드 라인과 tsconfig.json 설정 파일을 통해 사용할 수 있다. $ tsc --noImplicitAny program.ts 커맨드라인에서 사용하기 { "compilerOptions": { "noImplicitAny": true } } tsconfig.js..

Next.js

Next.js 기초 개념 정리

이번 POC를 진행하면서 새롭게 다루게 된 Next.js 프레임워크를 공부한 내용을 정리해보고자 한다. 혼자 공부하고 확인할 용도로 작성한 것이라서 가독성이 좀 떨어질 수 있다...😐 Pre-rendering pages 폴더 안에 기재된 파일 이름 대로(또는 index.ts를 포함한 디렉토리 이름 대로) 자동으로 routing 기능이 적용됨. 예) src/pages/about.ts localhost:3000/about 에서 해당 파일내의 컴포넌트를 출력해줌. 컴포넌트의 이름은 상관이 없다. Home이든 Potato든 ... 컴포넌트는 default로 export 되어야 한다. 만약에 user가 존재하지 않는 url로 요청한다면 next.js가 자체적으로 404 페이지를 보여줌. (CRA는 404페이지 따..

2pandi
'TypeScript' 태그의 글 목록