도리쓰에러쓰

유틸리티 타입 - 제네릭 타입이라고도 불린다. - 정의한 인터페이스를 변환한다. 1. 파셜 타입(Partial Type) : 특정 타입의 부분 집합을 만족하는 타입을 정의 interface IPersonal { name: string; birth: string; phone: string; } type TUserInfor = Partial 위 예시만 보면 어떤 용도인지 아직 파악이 안되지만 아래 예시처럼 객체에 있는 모든 프로퍼티에 옵셔널 프로퍼티를 적용한 것과 같다. interface IPersonal { name?: string; birth?: string; phone?: string; } 2. 픽 타입 (Pick Type) : 특정 타입에서 몇 개의 속성을 선택하여 타입을 정의 interface IB..

1. 함수 타입스크립트에서 함수는 입출력 타입을 지정할 수 있다. 1️⃣ 매개변수 타입 표기 함수 선언 시 각 매개변수 뒤에 타입을 표기할 수 있다. const getSum (num1: number, num2: number) => console.log(num1 + num2); getSum(1, 2); // 3 만약 다음과 같은 상황이 발생하면 런타임 에러가 발생하게 된다. 📍 다른 타입을 표기한 경우 const getSum (num1: number, num2: number) => console.log(num1 + num2); getSum('1', '2'); // 런타임 애러 📍 인자의 개수가 다른 경우 const getSum (num1: number, num2: number) => console.log(..

이전에 프로젝트에서 파이어베이스를 통한 회원가입을 구현하였고 오늘은 이어서 로그인/로그아웃 기능을 구현해보려고 한다. 회원가입 구현 방법은 아래 게시물을 참고하면 된다. [Firebase] 파이어베이스 회원가입 기능 구현 (React + TypeScript + Firebase v9) 이전에 프로젝트 생성한 것에 이어 파이어베이스를 통해 회원가입 기능을 구현해보려고 한다. 프로젝트 생성 및 연결 방법은 아래 게시물을 참고하면 된다. [Firebase] 파이어베이스 프로젝트 설 dori-coding.tistory.com 1. 로그인 기능 구현 1️⃣ src/hooks 폴더에 useLogin.ts를 생성한다. 2️⃣ 에러 정보를 저장하는 error state와 서버와의 통신 상태 정보를 저장하는 isPendi..

이전에 프로젝트 생성한 것에 이어 파이어베이스를 통해 회원가입 기능을 구현해보려고 한다. 프로젝트 생성 및 연결 방법은 아래 게시물을 참고하면 된다. [Firebase] 파이어베이스 프로젝트 설정 (React + Firebase v9) 파이어베이스가 v9로 업데이트 되면서 기존의 v8 버전의 문법은 거의 사용할 수 없게 되었다. 그래서 프로젝트 설정부터 로그인 등등을 다시 공부해보려고 한다. 1️⃣ 파이어베이스에 접속하여 dori-coding.tistory.com 1️⃣ 아래 화면에서 자신의 프로젝트를 선택한 후, 왼쪽 메뉴에서 빌드 - Authentication을 클릭한다. 2️⃣ [시작하기] 버튼을 클릭하고 이메일/비밀번호로만 회원가입을 진행할 예정이기 때문에 [이메일/비밀번호] 버튼을 클릭한다. 3..

파이어베이스가 v9로 업데이트 되면서 기존의 v8 버전의 문법은 거의 사용할 수 없게 되었다. 그래서 프로젝트 설정부터 로그인 등등을 다시 공부해보려고 한다. 1️⃣ 파이어베이스에 접속하여 로그인하고 [시작하기] 버튼을 클릭한다. Firebase Firebase는 고품질 앱을 빠르게 개발하고 비즈니스를 성장시키는 데 도움이 되는 Google의 모바일 플랫폼입니다. firebase.google.com 2️⃣ 아래 화면에서 [프로젝트 추가] 버튼을 클릭한다. 3️⃣ 프로젝트명을 작성하고, 구글 애널리틱스는 필요가 없어서 설정을 끄고 프로젝트를 생성한다. 💡 구글 애널리틱스 : 웹페이지에 접속하는 사용자에 대한 분석 (몇명이 접속했는지, 사용자의 위치 등등) 4️⃣ 각자 사용하는 환경을 클릭해주면 되는데 나는..

1. 원시 타입 (string, number, boolean, array) 1️⃣ String 문자열은 모두 string 타입이다. const name: string = 'dori'; const introduce: string = `My name is ${name}`; 2️⃣ Number TypeScript는 C언어 혹은 JAVA처럼 int, float, double 타입이 존재하지 않고, 모든 수는 단순히 number 타입이다. (2진수, 8진수, 10진수 등의 표현도 가능) const integer: number = 1; const float: number = 1.11; 3️⃣ Boolean 참(true) / 거짓(false) 두 가지 값만 가진다. const isTrue: boolean = true..

import { configureStore } from '@reduxjs/toolkit' import menuSlice from './menu-slice' const store = configureStore({ reducer: { menu: menuSlice.reducer }, }) redux 파일에 아래와 같이 코드가 작성되어 있을 때 store와 dispatch 타입 지정 방법은 아래와 같다. 1. store type export type storeType = ReturnType 2. dispatch type export type dispatchType = typeof store.dispatch