Web Dev 214

26 :: Node.js, 서버 만들기, express.js, 왜 Docker 쓰나

엘리스 SW 엔지니어 트랙 26일차 박성국님 실시간 강의 6주차 시작 Node.js로 들어왔다! 6주만에 Node.js로 들어왔다 이건 좋을 수도 있지만 앞에 내용의 복습이 없으면 다 까먹는다는 이야기 예방해야된다 웹에 대한 소개로 시작했다 SSR vs CSR CSR 장점 첫 로딩 정적파일 다 받는다 동적으로 빠르게 렌더링, UX 뛰어남 서버에 요청 횟수 적다 단점 모든 정적 파일 로드 될때까지 시간 걸림 SEO 문제 발생 SSR 장점 초기 로딩 속도 빠름 SEO 가능 단점 매번 새로 고침 서버에 매번 새로 요청 => 서버 부하 가중 (캐싱 같은게 어느정도 커버) 선호하는 것을 이용하면 된다고 한다 Node.js 서버에서 동작하는 자바스크립트 엔진 IO needs to be done differently..

Web Dev/ELICE 2021.11.30

25 (2/2) :: TypeScript 데코레이터

엘리스 SW 엔지니어 트랙 25일차 송현지 강사님 온라인 강의날 데코레이터 함수를 감싸는 함수 런타임에 호출 아직 표준이 안된 함수라 Decorator 사용하려면 자바스크립트 Babel, 타입스크립트 "experimentalDecorators": true 해줘야된다 데코레이터가 있는 선언에 대해 특정 타입의 메타데이터 내보내려면 reflect-metadata 설치 npm i reflect-metadata --save yarn add reflect-metadata 데코레이터전에 알아야할 JavaScript 일급객체: 값으로 사용가능 클로저: 내부 변수 끝나도 사용가능, 내부 변수를 누군가 가리키고 있으면 가비지 콜렉터가 없애지 않는다 고차 함수(함수 반환하는 함수) Property Descriptor De..

Web Dev/ELICE 2021.11.27

25 (1/2) :: Type Guard, Optional Chaining, 함수 오버로딩, 인덱스 시그니처

엘리스 SW 엔지니어 트랙 25일차 송현지 강사님 온라인 강의날 다양한 예시 보여주셔서 감사합니다 타입 심화 Union Type Or A타입 이거나 B 타입 A | B 유니온 타입 예시 // Union Type let one : string | number one = '1' one = 1 인터페이스는 유니온 타입 확장 불가 type과 &를 사용해줘야한다 type으로 유니온 타입 확장 예시 type A = string | number // 이건 에러 나온다 interface StrOrNum extends A { a: string } // 이렇게 바꿔줘야된다 type StrOrNum = { a: string } & (string | number) Union Type은 겹치는 것만 사용가능 type Human..

Web Dev/ELICE 2021.11.27

TypeScript :: VSCode에서 타입스크립트 설치 & 실행

시작은 우리의 설치를 도와줄 Node.js 1. Node.js Node.js 공식 사이트 링크 => https://nodejs.org/en/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. VSCode 들어가서 터미널 열고 typescript 설치 npm install -g typescript 3. typescript 잘 깔린지 확인 tsc --version 4. ts 파일 js로 컴파일 tsc index.ts OOOOOOOOOR ts 파일 자체를 console에서 확인하고 싶다면 5. 추가로 ts-node 모듈 설치 npm install -g ts-node 6. ts 파일 확인 ts..

24 :: TypeScript Generic, Constraints, keyof

엘리스 SW 엔지니어 트랙 24일차 온라인 강의날 어제 실시간 강의에서 배운 Interface와 Generic 복습 일찍 끝나면 실제로 타입스크립트 이용해서 만들어봐야지 or 만드는 방법 해봐야지! Generic Constraints(제약조건) => extends 이용한다 extends로 string or number로 제한하는 예시 // Constraints => extends 이용 const printMessage = (message: T): T => { return message } printMessage("1") // Good printMessage(1) // Good printMessage(false) // Error keyof 두 개의 타입 T와 U가 있다 첫 번째 타입 T에 오브젝트를 입력받..

Web Dev/ELICE 2021.11.26

23 (3/3) :: TypeScript 복습, 실습

엘리스 SW 엔지니어 트랙 23일차 김병철 강사님 실시간 강의 23 (2/3) :: Generic 링크 => https://forgottenknowledge.tistory.com/entry/23-23-Generic 23 (2/3) :: Generic 엘리스 SW 엔지니어 트랙 21일차 박성국 강사님 실시간 강의 23 (1/2) :: TypeScript Interface, 사용 이유 & 예시, 상속 링크 => https://forgottenknowledge.tistory.com/entry/23-12-TypeScript-In.. forgottenknowledge.tistory.com 앞의 이론 시간에 배운 내용 복습 조금 interface 클래스와 달리 구성되는 것의 타입만 명시 생성자 메서드 구현 X =>..

Web Dev/ELICE 2021.11.25

23 (2/3) :: Generic

엘리스 SW 엔지니어 트랙 23일차 박성국 강사님 실시간 강의 23 (1/2) :: TypeScript Interface, 사용 이유 & 예시, 상속 링크 => https://forgottenknowledge.tistory.com/entry/23-12-TypeScript-Interface-%EC%82%AC%EC%9A%A9-%EC%9D%B4%EC%9C%A0-%EC%98%88%EC%8B%9C-%EC%83%81%EC%86%8D 23 (1/2) :: TypeScript Interface, 사용 이유 & 예시, 상속 엘리스 SW 엔지니어 트랙 21일차 박성국 강사님 실시간 강의 Interface와 제네릭 타입스크립트에서 조금 더 중요한 개념이라고 하신다 Interface 타입 체크에 사용 변수, 함수, 클래스에 ..

Web Dev/ELICE 2021.11.25

23 (1/3) :: TypeScript Interface, 사용 이유 & 예시, 상속

엘리스 SW 엔지니어 트랙 23일차 박성국 강사님 실시간 강의 Interface와 제네릭 타입스크립트에서 조금 더 중요한 개념이라고 하신다 Interface 타입 체크에 사용 변수, 함수, 클래스에 사용 가능 클래스와 비스므리 하지만 직접 인스턴스 생성 불가 모든 메소드는 추상 메소드 abstract 키워드 사용 안한다 Interface 사용 이유 협업 개발시 공통적으로 사용되는 부분에 대해 미리 정의 추후 코드를 합칠 때 효율적이다 추상클래스 vs Interface 추상 클래스는 전체적인 구조 Interface는 프로그래머간 협업 Interface 예시 interface에서 정한 property는 모두 required 아니면 [grade: number] 이런식으로 활용 가능 value 자리에는 들어올 ..

Web Dev/ELICE 2021.11.25

22 :: 타입스크립트 복습

엘리스 SW 엔지니어 트랙 22일차 온라인 강의날 어제 실시간 강의에서 배운 타입스크립트 복습을 실습과 함께 하는 날 타입스크립트 Microsoft가 개발했구나~ 추가 제공 자료형 tuple 길이와 요소 타입이 정해진 배열을 저장하는 타입 enum 특정 값들의 집합으로 저장 인덱스 번호로 접근 가능 인덱스 변경가능 any 자바스크립트 변수 같은 제한 없는 타입 어제 살펴본 Utility Types에 대해 알아봤다 밑의 유틸리티 타입을 알아두면 좋은 것 같다 Partial Readonly Record Pick Omit Exclude Extract NonNullable Parameters ConstructorParameters ReturnType Required 클래스 클래스도 복습 + 새로운 내용 등장 접..

Web Dev/ELICE 2021.11.24

21 (2/2) :: TypeScript 함수 사용, class

21 (1/2) :: 타입스크립트, Type, Utility Types 링크 => https://forgottenknowledge.tistory.com/entry/21-12-%ED%83%80%EC%9E%85%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-Type-Utility-Types TypeScript 이용 함수 사용하기전 함수에 대해 알아보기 일급객체의 특징 1. 함수 자체를 값으로 저장 2. 함수를 파라미터로 넣어 줄 수 있다 3. 함수를 리턴할 수 있다 // 함수 자체를 값으로 저장 let sum = function(a, b) { return a + b } function ul(child) { return`${child}` } function makeLi(container, c..

Web Dev/ELICE 2021.11.23
728x90