본문 바로가기

핸드메이드 프로그램/실시간 코인가격 알림 ( React native )6

React Native에서 typescript 사용하기 우선 TypeScript에 필수적인 라이브러리 설치 진행 처음 만들어둔 프로젝트에서 typeScript 라이브러리를 설치한다. npm install typescript @types/react @types/react-native --save-dev 총 세개의 라이브러리를 설치한다. typescript : TypeScript 코드 작성을 위한 패키지 @types/react: react에서 사용할 타입이 정의된 패키지 @types/react-native: react-native에서 사용할 타입이 정의된 패키지 TypeScript 설정 파일 만들기 처음 폴더에서 tsconfig.json 파일을 생성 아래 내용을 복사하여 저장한다. 위 처럼 root 폴더 내에서 tsconfig.json을 만든다. { "compi.. 2021. 8. 19.
TypeScript 제네릭 제네릭(Generic) 제네릭이란 자바에서 클래스나 함수에서 어떤 형태로 값을 받아 들일지 정해지지 못한 상태에서 그 함수나 클래스를 사용할 때 결정하는 프로그래밍 기법을 말한다. 클래스 Class 우선 class를 직접 만들어 봄으로써 사용예제를 살펴보자 class My_class { private a: T; private b: T; private c: T; constructor( item : T, item2: T) { this.a = item; this.b = item2; } add( ): void { this.c = this.a + this.b; } result(): T { return this.c; } } 다음과 같은 class를 작성한다고 가정해보자. 현재 어떤 타입이 들어올지 예상을 할 수 없.. 2021. 8. 10.
TypeScript 함수 작성 TypeScript 함수 작성법 function split(input: string): string[] { return input.split(''); } TypeScript 에서는 다음과 같이 함수를 작성할 수 있다. 우선 들어오는 입력 input : string을 보면 매개변수 str과 그 형태가 어떤 것인지 알 수 있다. 그리고 뒤에 :string [] 뜻은 출력으로 어떤 형태가 나오는 건지 미리 선언 할 수 있게 된다. let fc : Function = function() { }; let fc : (string) => string[] = split; 물론 미리 어떤 식의 함수를 만들 것인지도 이렇게 선언할 수 있다. 보면 Function인터페이스가 내장되어 있기 때문에 위 처럼 fc : Funct.. 2021. 8. 9.
'decorators-legacy' isn't currently enabled 오류 해결 'decorators-legacy' isn't currently enabled 오류 mbox의 @action, @observable 등의 decorator를 사용하려다 보면 위와 같은 오류가 나오는 것을 확인할 수 있다. 이 경우 에러 해결을 하기 위해서는 babel.config.js 파일로 들어가 아래 코드를 추가해주면 정상적으로 동작하는 것을 확인 할 수 있다. "plugins": [ ["@babel/plugin-proposal-decorators", { "legacy": true}], ["@babel/plugin-proposal-class-properties", { "loose": true}] ] 2021. 7. 26.