bright jazz music

https://catnails.tistory.com/577 [프레임워크 없는 프론트엔드 개발] 1.1. 순수함수를 이용한 렌더링 구현https://github.com/hojuncha997/frameworkless-front-end-dev GitHub - hojuncha997/frameworkless-front-end-dev: 프레임워크 없는 프론트엔드 서적 학습 리포지토리프레임워크 없는 프론트엔드 서적 학습 리포지토리. Contributcatnails.tistory.com 이전 포스팅에서 다뤘던 view.js의 함수는 DOM 을 조작하는 함수가 하나뿐이었다. 이번에는 해당 함수를 기능별로 나누었다.프로젝트 디렉토리의 루트 경로에 view 디렉토리를 만들고 아래의 파일을 만들어 주었다. 1. /view 디..

https://github.com/hojuncha997/frameworkless-front-end-dev GitHub - hojuncha997/frameworkless-front-end-dev: 프레임워크 없는 프론트엔드 서적 학습 리포지토리프레임워크 없는 프론트엔드 서적 학습 리포지토리. Contribute to hojuncha997/frameworkless-front-end-dev development by creating an account on GitHub.github.com* css, 라이브러리 등의 파일들은 여기에 기록하지 않았다. 위 리포지토리에는 남아 있으므로 참고할 것* 브라우저에서 file://경로/index.html 로 접근하면 CORS 정책 오류 때문에 자바스크립트 파일을 가져오지 ..

프로토타입은 생성자 함수가 생성되는 시점에 함께 생성된다. 프로토타입과 생성자 함수는 단독으로 존재할 수 없고 언제나 쌍으로 존재하기 때문이다. 생성자 함수는 사용자가 직접 정의한 사용자 정의 생성자 함수와 자바스크립트가 기본 제공하는 빌트인 생성자 함수로 구분할 수 있다. 사용자 정의 생성자 함수와 프로토타입 생성 시점 생성자 함수로 호출할 수 있는 함수, constructor는 함수 객체를 생성하는 시점에 프로토타입도 더불어 생성된다.// 생성자 함수가 평가되는 시점에 프로토타입도 더불어 생성됨console.log(Person.prototype); // {constructor: f} // 생성자 함수function Person(name) { this.name = name;}/*함수 선언문은 런타임 이..

생성자 함수에 의해 생성된 인스턴스는 프로토타입의 constructor 프로퍼티에 의해 생성자 함수와 생성자 함수와 연결된다. 이 때 constructor 프로퍼티가 가리키는 생성자 함수는 인스턴스를 생성한 생성자 함수다. 하지만 리터럴 표기법에 의한 객체 생성 방식과 같이 명시적으로 new 연산자와 함께 생성자 함수를 호출하여 인스턴스를 생성하지 않는 객체 생성 방식도 있다.// 객체 리터럴const obj = {};// 함수 리터럴const add = function (a, b) {return a + b};// 배열 리터럴const arr = [1,2,3];// 정규표현식 리터럴const regexp = /is/ig; 리터럴 표기법에 의해 생성된 객체도 프로토타입이 존재한다. 그러나 리터럴 표기법..

함수 객체의 prototype 프로토타입 prototype 프로퍼티는 함수객체만이 소유하며 생성자 함수가 생성할 인스턴스의 프로토타입을 가리킨다.// 함수 객체는 prototype 프로퍼티를 소유한다.(function () {}).hasOwnProperty('prototype'); // true// 일반 객체는 prototype 프로퍼티를 소유하지 않는다.({}).hasOwnProperty('prototype'); // false prototype 프로퍼티는 생성자 함수로 호출할 수 없는 함수들 // 화살표 함수는 non-constructorconst Person = name = > { this.name = name;}// non-constructor는 prototype 프로퍼티를 소유하지 않는다.co..

프로토타입 객체 또는 프로토타입은 객체 간 상속을 구현하기 위해 사용된다. 프로토 타입은 어떤 객체의 상위, 즉 부모 객체의 역할을 하는 객체로서 다른 객체에 공유 프로퍼티와 메서드를 를 제공한다. 프로토타입을 상속 받은 하위 객체는 상위 객체의 프로퍼티를 자신의 프로퍼티처럼 사용할 수 있다. 모든 객체는 [[property]] 라는 내부 슬롯을 가지며, 이 내부 슬롯의 값은 프로토타입의 참조이다. null인 경우도 있다. [[Prototype]] 슬롯에 저장되는 프로토타입은 객체 생성 방식에 의해 결정된다. 즉, 객체가 생성될 때 객체 생성 방식에 따라 프로토타입이 결정되고 [[Prototype]] 슬롯에 저장된다. 예를 들어 객체 리터럴에 의해 생성된 객체의 프로토타입은 Object.prototype..

실행 컨텍스트가 활성화될 때 자바스크립트 엔진은 해당 컨텍스트에 관련된 코드들을 실행하는 데 필요한 환경 정보들을 수집해서 실행 컨텍스트 '객체'에 저장한다. 이러한 객체는 자바스크립트 엔진이 활용할 목적으로 생성하는 것이며, 개발자가 확인할 수는 없다. 실행 컨텍스트 객체에는 아래와 같은 값들이 담기게 된다. VariableEnvironmentLexicalEnvironmentThisBinding 1. VariableEnvironment:  현재 컨텍스트 내의 식별자들에 대한 정보 + 외부 환경 정보 + '선언 시' LexicalEnvironment의 스냅샷이다.실행 컨텍스트를 생성할 때 VariableEnvironment에 정보를 먼저 담은 다음, 이를 그대로 복사해서 LexicalEnvironment..

1. ports:50000번 포트는 젠킨스 마스터 노드와 젠킨스 슬레이브 노드가 통신하는 포트이다. 비워 놓으면 포트포워딩이 설정되지 않기 때문에 명시적으로 기본 포트인 50000을 적어준다.8080포트는 젠킨스 웹콘솔에 접근하는 포트이다. 기본포트는 8080이지만 여기서는 9090으로 변경해서 적어줬다. 2. volumes:도커 볼륨을 의미한다. 도커 컨테이너는 기본적으로 휘발성이기 때문에 컨테이너가 삭제되면 내부 데이터도 전부 삭제돼 버린다. 컨테이너가 삭제되더라도 데이터는 남겨 놓기 위해서 호스트의 공간을 도커 컨테이너에게 연결(마운트)해 놓는 것이다. 이 때 이 공간을 도커 볼륨이라고 하며, 도커 컨테이너는 이 공간을 마치 컨테이너 내부의 공간처럼 사용하게 된다. 2.1 volume 1이 경우, ..

1. 인증기능 구현에 필요한 패키지 설치하기이미 설치한 패키지도 있을 수 있다.// JWT(JSON Web Token) 생성/검증을 위한 NestJS 모듈pnpm add @nestjs/jwt // Passport.js를 NestJS에서 사용하기 위한 어댑터/래퍼pnpm add @nestjs/passport // Node.js 인증 미들웨어 라이브러리pnpm add passport // JWT 기반 인증을 위한 Passport 전략# Authorization 헤더에서 JWT를 추출/검증pnpm add passport-jwt // username/password 기반 인증을 위한 Passport 전략 // 로그인 시점의 인증 처리pnpm add passport-local // 패스워드 해싱을 위한 라이브러..

1. 단위 테스트1.1.  members.controller.specs.ts// src/members/members.controller.spec.ts// 회원 관리 컨트롤러 테스트import { Test, TestingModule } from '@nestjs/testing';import { MembersController } from './members.controller';import { MembersService } from './members.service';import { AuthProvider } from '@common/enums';describe('MembersController', () => { let controller: MembersController; let service: Mem..