이안의 평일코딩

명시적인 any 타입 선언 먼저, 명시적으로 any를 선언한다. tsconfig.json 파일에 'noImplicitAny' 값을 'true'로 추가한다. // tsconfig.json { "compilerOptions": { "allowJs": true, // 자바스크립트 검증 "target": "ES5", // 타입스크립트 컴파일 tsc "outDir": "./built", // 결과물 들어갈 곳 "moduleResolution": "Node", // Promise 인식 위해서 "lib": ["ES2015", "DOM", "DOM.Iterable"], // Promise 등 에러 안뜸 "noImplicitAny": true, // 외부라이브러리(axios 등) 오류에서 더 많은 타입에러가 뜸 }, "..

ES6 이전의 함수 // ES5 - 함수 선언문 function sum(a, b) { return a + b; } // ES5 - 함수 표현식 var sum = function(a, b){ return a + b; } ES6+ 화살표 함수 function을 없애고 =>를 추가해서 코드가 더 간결해졌다. 그리고 간단한 연산 표현식은 { }와 return을 없애서 쓸 수 있다. // ES6+ - 함수 표현식(화살표 함수) var sum = (a, b) => { return a + b; } var sum = (a, b) => a + b; 타입스크립트의 화살표 함수 // TS - 화살표 함수 var sum = (a: number, b: number): number => { return a + b; }

타입스크립트 기본 환경 구성 #1. NPM 초기화 (npm 설정파일 package.json 추가) npm init -y #2. 타입스크립트 라이브러리 설치 npm i typescript --save-dev #3. 타입스크립트 설정 파일(tsconfig.json) 생성 및 기본 값 추가 //tsconfig.json { "compilerOptions": { "allowJs": true, // 자바스크립트 검증 "target": "ES5", // 타입스크립트 컴파일 tsc "outDir": "./built", // 결과물 들어갈 곳 "moduleResolution": "Node" // Promise 인식 위해서 }, "include": ["./src/**/*"] //src폴더 모든 파일 대상 포함 } #4. ..

유틸리티 타입 기본 문법으로 충분히 타입을 변환할 수 있지만, 유틸리티 타입을 쓰면 이미 정의해 놓은 타입을 변환하거나 코드를 줄여 간결하게 정의할 수 있다. 제네릭타입이라고도 불리운다. Pick 타입을 불필요하게 정의하지 않아도 되며 간편하고 간결하게 만들어 준다. interface Product { id: number; name: string; price: number; brand: string; stock: number; } function fetchProducts(): Promise { // ... } Product의 일부(id, name, price)만 가지고 와야 하므로 Product를 쓰지 못함. 밑의 방법은 새로운 인터페이스를 만들기 때문에 권장되지 않는다. interface Product..

RDS (Relational Database Service) AWS에서 관계형 데이터베이스를 쉽게 사용할 수 있게 도와주는 서비스이다. 관계형 데이터베이스 관리의 부담을 덜어주지만 추가적인 비용이 발생한다. 쉬운 백업과 복구, 고가용성 확보, 수직 확장 수평 확장시 다운타임이 최소화된다. AWS 타 서비스들과의 통합이 편리하고 다양한 기능과 높은 성능이 갖고 있다. 관계형 데이터베이스 (RDBMS) 테이블 모양의 2차원 데이터(행과 열, 레코드와 필드)를 저장 데이터와 데이터 사이의 관계를 활용하여 중복데이터를 방지하고 검색 성능을 높임 가장 대표적인 데이터베이스의 형태로 Oracle, MySQL, MS-SQL Server 등이 가장 유명하다. RDS에서 지원하는 RDB는 Oracle, MySQL, Ma..

VPC(Virtual Private Cloud) AWS의 가상 사설 네트워크로 AWS를 잘 사용하기 위해서 반드시 알아야 되는 필수 지식. EC2의 네트워크 계층으로 많은 AWS 서비스들이 VPC를 통해 네트워크에 연결된다. VPC: 사용자의 AWS 계정 전용 가상 네트워크 망으로 리전 서비스 (고가용성을 위해 multi AZ로 구성) 서브넷: VPC를 더 작은 범위의 네트워크로 나눈 것으로 AZ 서비스 EC2인스턴스(AZ 서비스)는 바로 VPC에 연결되지 못하고 반드시 서브넷을 통해 연결됨 라우팅 테이블: 네트워크 트래픽 전달 규칙 지정 CIDR 블록: CIDR 표기법을 통해 IP 주소 범위를 지정 CIDR 표기법 IP의 범위를 간단하게 표기하는 표기법이다. IP address / Prefix 예) 0..

EC2(Elastic Computing Cloud) 안전하고 확장성 있는 컴퓨팅 서비스이다. 사용한만큼 요금 지불하고 초당으로 계산된다. (잘못 사용하면 일반적인 데이터 센터 IDC에서 서버를 임대하는 것보다 비쌀 수 있다.) 전세계 어디든지 빠르게 인스턴스를 생성하고 서비스 운영이 가능하다. ELB, Auto Scaling, S3등 다양한 AWS 서비스와 연동 가능하고 Linux, Windows, MacOS 지원한다. EC2와 주요 구성요소들은 AZ 기반이다. 고가용성을 위해서 MultiAZ를 이용하여 가용성을 확보해야 한다. MultiAZ는 둘 이상의 AZ를 활용해서 서비스를 구축하는 것으로 두 대 이상의 서버가 필요하고, 주로 ELB (Elastic Load Balancer)를 이용해서 서버를 연결..

Composition API 프로젝트가 커지면 데이터와 관련된 함수 찾는 것도 일이다. 지금까지 했던 문법은 Options API고 Composition API를 쓰면 관련있는 코드를 한 곳에 모을 수 있다. 편한걸로 컴포넌트마다 Composition 또는 Options 선택하면 된다. Composition API 써서 개발하려면 setup() 안에 코드를 짠다. setup() 안에서 데이터 생성, 조작, methods, computed, watch, hook걸기 등 거의 모든 기능개발을 setup 한 곳에서 가능하다. 먼저 vue에서 {ref}를 import 해온다. setup() 안에서 데이터 생성하는 법은 ref(데이터) 함수를 사용하면 된다. 모든 데이터를 refrence data type으로 감..