도리쓰에러쓰

티스토리 블로그를 사용한지 1년 정도 되었지만.. 앞으로는 벨로그를 사용해보려고 한다..! (사실 이전부터 옮기고 싶었지만 이력서에 티스토리 블로그가 적혀져 있어서 옮기질 못했다.. 이상 저의 tmi..) 아무튼 앞으로 벨로그에서 봐요 👋 doheek2 (Dohee Kang) - velog 2022년 프론트엔드 취준생의 회고 올해 초에는 수술을 하고 좀 쉬면서 리액트를 공부하였고, 본격적인 취업 준비는 6월부터 시작하였다. 5월에 원티드에서 주최한 프리온보딩 프론트엔드 코스에 velog.io

유틸리티 타입 - 제네릭 타입이라고도 불린다. - 정의한 인터페이스를 변환한다. 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(..

1. 자바스크립트 엔진이 코드를 계산하기 위해 알아야 하는 부분 10 + 20 - 10, 20, + 기호의 의미를 알고 있어야 한다. - 10 + 20이라는 표현식의 의미도 해석할 수 있어야 한다. 자바스크립트 엔진은 피연산자인 10(좌변)과 20(우변)을 메모리에 기억하고, CPU를 사용해 연산한다. 2. 메모리(Memory) - 메모리(Memory): 데이터를 저장할 수 있는 메모리 셀(Memory Cell)의 집합체 - 메모리 셀 하나의 크기는 1바이트(8비트)이며, 컴퓨터는 메모리 셀의 크기, 즉 1바이트 단위로 데이터를 저장하거나 읽는다. - 각 셀은 고유의 메모리 주소(Memory Address)를 가진다. 메모리 주소는 메모리 공간의 위치를 나타내며 메모리의 크기만큼 정수로 표현된다. - 컴..

이전에 프로젝트에서 파이어베이스를 통한 회원가입을 구현하였고 오늘은 이어서 로그인/로그아웃 기능을 구현해보려고 한다. 회원가입 구현 방법은 아래 게시물을 참고하면 된다. [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..