Language/TypeScript 7

TypeScript Image Import

Image Import 타입스크립트에서 이미지를 import하려고 하는데 에러가 발생한다. 그래서 구글링을 해봤더니 타입이 정의되어 있지 않아서 그렇다고 한다. //index.d.ts declare module "*.png"; 그래서 index.d.ts 파일을 만들어 모든 png파일의 타입을 정해주었다. 그런데도 안되네? 다시 찾아보니 index.d.ts 파일은 index.ts 파일이 생성했다고 TypeScript가 추측해서 무시된다고 한다. // tsconfig.json "typeRoots": ["src/types"] // src/types/images.d.ts declare module "*.png"; 그래서 tsconfig.json에서 typeRoots 옵션을 통해 경로를 정해주고 src/types..

Language/TypeScript 2023.08.26

TypeScript Absolute Import (with. CRA)

TypeScript Absolute Import Create-React-App(CRA)로 만든 TypeScript 프로젝트에서 절대경로로 import하는 방법 우선 절대경로로 import를 하려고 하는 이유는 딱 하나였다. 보기 지저분한 것. 그래서 import 경로를 "@"를 포함한 경로로 깔끔하게 되었으면 했다. 바로 구글링 하는 방법은 간단했다. tsconfig.json tsconfig.json 파일에서 아래의 코드를 넣어주면 된다. { "compilerOptions": { "baseUrl": ".", "paths": { "src/*": [ "src/*" ] } } } 이렇게 하면 절대경로로 src를 루트로 시작할 수 있게 된다. -완- 여기서 좀 고급져 보일려면 "@"를 추가할 수 있는데 CRA로..

Language/TypeScript 2023.08.26

TypeScript 기본 개념 공부 #5

2023.04.08 - [Language/TypeScript] - TypeScript 기본 개념 공부 #4 TypeScript 기본 개념 공부 #4 2023.04.06 - [Language/TypeScript] - TypeScript 기본 개념 공부 #3 TypeScript 기본 개념 공부 #3 2023.04.06 - [Language/TypeScript] - TypeScript 기본 개념 공부 #2 TypeScript 기본 개념 공부 #2 Call Signatures 2023.04.04 - [Language/Typ hu-bris.tistory.com Interface 인터페이스는 타입과 비슷하지만 다른 부분이 있다. type User = { name: string, age: number, gender:..

Language/TypeScript 2023.04.12

TypeScript 기본 개념 공부 #4

2023.04.06 - [Language/TypeScript] - TypeScript 기본 개념 공부 #3 TypeScript 기본 개념 공부 #3 2023.04.06 - [Language/TypeScript] - TypeScript 기본 개념 공부 #2 TypeScript 기본 개념 공부 #2 Call Signatures 2023.04.04 - [Language/TypeScript] - TypeScript 기본 개념 공부 #1 TypeScript 기본 개념 공부 #1 공부 이유 타입스크 hu-bris.tistory.com Classes 자바스크립트는 객체지향 언어로 Class를 사용할 수 있다. 타입스크립트는 Java나 C#처럼 private method, public property, abstract..

Language/TypeScript 2023.04.08

TypeScript 기본 개념 공부 #3

2023.04.06 - [Language/TypeScript] - TypeScript 기본 개념 공부 #2 TypeScript 기본 개념 공부 #2 Call Signatures 2023.04.04 - [Language/TypeScript] - TypeScript 기본 개념 공부 #1 TypeScript 기본 개념 공부 #1 공부 이유 타입스크립트를 이전에 진행한 프로젝트(해킹대회 사이트 개발 - 추후에 포스팅할 예정) hu-bris.tistory.com 이번 포스트에서는 다형성(polymorphism)에 대해서 다룰 것이다. 다형성(Polymorphism) 다형성(polymorphism)이란 무엇인가? 그리스어로 poly가 무슨 뜻인지 보자. poly라는 뜻은 many, several, much, mul..

Language/TypeScript 2023.04.06

TypeScript 기본 개념 공부 #2

Call Signatures 2023.04.04 - [Language/TypeScript] - TypeScript 기본 개념 공부 #1 TypeScript 기본 개념 공부 #1 공부 이유 타입스크립트를 이전에 진행한 프로젝트(해킹대회 사이트 개발 - 추후에 포스팅할 예정)에서 별로 모르는 상태로 처음 써보고 괜찮은 언어라고 생각되며 많은 기업에서 타입스크립트 hu-bris.tistory.com 이전 포스트를 보면 함수의 인자 타입을 지정해줘야 한다. function add(a: number, b: number) { return a + b; } const add = (a: number, b: number) => a + b// arrow function 원래는 리컨 값의 타입도 정해줘야 하지만 어차피 인자들..

Language/TypeScript 2023.04.06

TypeScript 기본 개념 공부 #1

공부 이유 타입스크립트를 이전에 진행한 프로젝트(해킹대회 사이트 개발 - 추후에 포스팅할 예정)에서 별로 모르는 상태로 처음 써보고 괜찮은 언어라고 생각되며 많은 기업에서 타입스크립트를 사용하고 있어 제대로 공부해보고자 했다. TypeScript 타입스크립트가 무엇인가? 먼저 쉽게 말하자면 자바스크립트에 타입을 지정할 수 있는 언어라고 생각하면 된다. 그렇다면 자바스크립트가 사용되는 모든 프론트엔드와 백엔드에서 사용할 수 있다는 말이다. 목적에 맞지 않는 타입의 변수나 함수들에서 에러를 발생시켜 버그를 사전에 제거한다. 또한 코드 자동완성이나 실행 전 피드백을 제공하여 작업과 동시에 디버깅이 가능해 생산성을 높일 수 있다. 기본 문법 let str: string = 'hi'; let num: number..

Language/TypeScript 2023.04.04