코딩 일지

ts + react 글로 돌아왔습니다 (아무도 안 기다림) 백날 타입스크립트만 공부해봤자 프론트엔드 개발자인데 리액트에서 사용할 줄 모른다면배운 의미가 없기에 사실상 이 글의 내용이 전 글보다 더 중요하다고 볼 수 있다..react, react-native에서 ts사용하는 방법은 사실상 거의 똑같아서구별이 무의미하긴 하지만 필자는 RN에 내장되어 있는 컴포넌트를 사용할 것이기 때문에(View, Text 등)제목을 저렇게 지정했다.   그럼 빠르게 ㄱㄱ   일단, 처음에 jsx 형식으로 초기 컴포넌트를 만들어 전체적인 틀을 만들어놓고 시작하겠다.   App.tsximport React, {useState} from 'react';import {SafeAreaView, Text, View} from 'rea..

전에 근무하던 회사에서는 자바스크립트를 사용했다보니타입스크립트는 안 쓴지 시간이 조금 지났다그래서 이번 기회에예전에 했던 타스 + 리액트 프로젝트를 되짚어보며 찬찬히 정리해보려고 함!  문자열let name: string = "청포도에이드"; 숫자let today: number = 28; 배열let arr1: number[] = [1, 2, 3];let arr2: Array = [1 , 2, 3];let arr3: Array = ["청포도", "에이드"];let arr4: [string, number] = ["writer", 27]; 객체let grape: object = { name: "청포도에이드", age: 27 };  object로 타입 지정 후 안에 요소는 마음 대로 추가할 수 있음그러나 위의 ..

목차 - 인터페이스(interface란?) - 예제 코드 인터페이스란? 인터페이스는 일반적으로 타입 체크를 위해 사용되며 변수, 함수, 클래스에 사용할 수 있다. 인터페이스는 여러가지 타입을 갖는 프로퍼티로 이루어진 새로운 타입을 정의하는 것과 유사하다. 인터페이스에 선언된 프로퍼티 또는 메소드의 구현을 강제하여 일관성을 유지할 수 있도록 하는 것이다. ES6는 인터페이스를 지원하지 않지만 TypeScript는 인터페이스를 지원한다. 인터페이스는 프로퍼티와 메소드를 가질 수 있다는 점에서 클래스와 유사하나 직접 인스턴스를 생성할 수 없고 모든 메소드는 추상 메소드이다. 단, 추상 클래스의 추상 메소드와 달리 abstract 키워드를 사용하지 않는다. 예제 코드 example/interface.ts int..

'작성중' type script 는 런타임이 없다! --> 번들링을 무조건 해야함 즉, 자바스크립트로 바꿔주어야한다. tsc index.ts /dist/app.js #json { "compilerOptions": { "outDir": "./dist/" } } npx tsc --build #json 별칭 경로 설정(paths) { "compilerOptions": { "outDir": "./dist/", "baseUrl": ".", "paths": { "@core/*": ["src/core/*"] } } } npm install -D @types/node ┌ [프로젝트] ├ /src ├─ /core ├── index.ts ├─ utils.ts **index.ts** #typescript -특정 경로를 아래..