익명의 개발노트

무분별한 api 호출을 제한하기 위해 express-rate-limit 라이브러리를 설치해보자 npm i express-rate-limit RateLimit 미들웨어를 라우터에 넣으면 라우터에 사용량 제한걸림. const jwt = require('jsonwebtoken'); const RateLimit = require('express-rate-limit'); exports.apiLimiter = new RateLimit({ windowMs: 60 * 1000, // 기준시간 max: 1, //허용횟수 delayMs: 0, //호출간격 //제한 초과시 콜백함수 handler(req, res) { res.status(this.statusCode).json({ code: this.statusCode, //..

1. passport관련 패키지 설치 npm i passport passport-local passport-kakao bcrypt 2. app.js와 미리 연결 //app.js (다른 모듈 import) const passport = require('passport'); const passportConfig = require('./passport'); //passport 폴더 안에 index.js //express-session 설정 하단부에 passport session 설정해준다. app.use(session({ resave: false, saveUninitialized:false, secret: process.env.COOKIE_SECRET, cookie:{ httpOnly: true, secure..

패키지를 npm에 배포하기 위해서는 npm 계정이 필요하다. 아래의 명령어를 터미널에 입력하면, npm adduser Username, Password, Email을 npm에 가입한 정보를 그대로 입력하도록 한다. 실제로 임시 파일을 만들어서 배포해보자. 아래와 같이 package.json에서 진입점을 위해서 index.js 파일을 만들어주고, 패키지명을 작성한다. { "name": "calculator-11024", //배포할 패키지명 "version": "1.0.0", "description": "", "main": "index.js", //진입점 "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "l..

고차함수는 다른 함수를 반환하는 함수이다. const discounter = discount => { return price => { return price * (1-discount); }; }; const tenPercentOff = discounter(0.1); tenPercentOff(100); //90 아래와 같이 화살표함수를 이용해서 사용가능 const discounter = discount => price => price *(1-discount); discounter(0.1)(100) //90 이 방법은 두개의 다른 매개 변수를 가진 함수를 단일함수로 변환할때 유용하다고 한다. 출처: 자바스크립트 코딩의 기술

요약 1. Optional Chaining(?.) 2. Nullish coalescing Operator(??) 3. globalThis 4. Dynamic import 5. BigInt 6. String.prototype.matchAll 7. Promise.allSettled 1. Optional Chaining(?.) ?. 연산자는 왼쪽 연산자 값이 null이나 , undefined 일 경우 실행을 멈추고 undefined를 return하는 연산자이다. 장점으로는 존재하지 않을 수도 있는 값에 대하여 예외처리를 손쉽게 할 수 있다. const data = { user: { name: 'foo', getName() { return this.name } } } const user1 = data?.user..

전개연산자라고 알고 있는데, 나 또한 그렇게 알고 있었다. 하지만 ...은 연산자가 아닙니다. 연산의 개념은 식이 나타낸 일정한 규칙에 따라 계산하는 일이며, 연산자는 이것들을 행하기 위한 기호를 의미한다. 하지만 ...은 계산을 따로 하지 않기 때문에 연산자가 아니다. 구분 올바른 명칭 [1,...[2,3,4]] Spread elements { a: 1, ...{ b: 1 } } spread properties function abc(...args) {} rest parameter abc(...[1, 2, 3]) spread argument [x, ...xs] = [1, 2, 3] rest elements { x, ...xs } = { x: 1, b: 2, c: 3 } rest properties

Destructuring은 사전적 의미로 구조를 분해한다는 의미이다. 일반적으로 배열이나, 객체 처럼 구조를 가진 Object를 쪼개고, 쪼갠 값을 변수에 담아서 사용한다. 1. 배열 Destructuring const arr = [1,2,3,4,5]; const [ one, two ] = arr; console.log(one); //1 console.log(two); //2 이런 식으로 값을 쪼갤 변수를 먼저 만들고, 해당 배열을 일치시켜준다. 2. 객체 Destructuring 객체는 기본적으로 속성에 키, 값을 가진다. const obj = { id: 'dddd', pw: '1q2w3e', } const {id} = obj; console.log(id); //'dddd' 객체는 위와 같은 식으로 쪼..

1. 정의 : 함수의 실행을 중간에 멈추고 재개 할 수 있는 기능 2. 장점 1) 필요한 순간에 값을 계산하기때문에 불필요한 메모리를 낭비를 방지할 수 있다. 2) 실행을 멈추고 재 시작할 수 있기 때문에 멀티태스킹이 가능하다. 3. 사용법 1) function* 함수명(){} 으로 *를 사용하여 쓴다. 2) yield를 이용해서 함수를 멈출 수 있다. 3) yield 오른쪽에는 iterator값이 들어간다. 4) 결과값은 제네레이터 객체를 반환한다. 5) 제네레이터 객체는 next, return, throw 메서드를 가지고 있다. function* f1(){ yield 10; yield 20; return 'finished'; } const gen = f1(); 위 함수를 실행하려면, gen.next(..

1. promise란?? 사전적의미는 약속이다. 오브젝트 안에 오브젝트를 포함하는 자바스크립트 오브젝트의 특별한 형태이다. 프로미스에 접근할 수 있는방법은 .then()을 통해서 접근할 수 있다. function getFirstUser() { return getUsers().then(function(users) { return users[0].name; }); } 프로미스가 미래 시점의 데이터를 위한 것이고, 프로미스를 가지고 있기만 하면, 그 데이터가 미래시점인지 현재인지는 상관없다. why?? then을 통해서 부르기만 하면 되는 것임. 프로미스를 사용한다는 것은 비동기함수가 될꺼야, 라는 것을 의미한다. 그래서 리턴값을 지금 사용하든지, 아니든지, 나는 비동기함수야의 의미가 된다. 프로미스 특징은 ..

Vue.js는 2버전과 3버전으로 현재 나뉘고 있다. 2버전과 3버전으로 설치시 명령어가 다르다. 리액트에 create-react-app이 있다면, 뷰에는 Vue-cli가 있다. 1. 설치방법 npm i -g @vue/cli // vue-cli 3.x npm i -g vue-cli // vue-cli 2.x 2. 프로젝트 생성 vue create '프로젝트 명' // vue-cli 3.X vue init webpack '프로젝트 명' // vue-cli 2.X 3. 2버전을 설치하였다면, 프로젝트를 생성한 후 npm install를 실행해서 node_modules를 깔아주어야 하고, 3버전은 프로젝트생성시 자동으로 설치 된다. 4. 웹팩 설정파일 2버전은 노출이 되어있고, 3버전은 노출이 안되어있다. ..