8주 5일차 - Refactor Express

8주 5일차 - Refactor Express

1. 배운 것

• express
• 단일 연결 리스트 개념정리, 문제풀이

2. 내용 정리

줌세션

• buffer : 로딩중일때 우리는 데이터 하나 하나의 조각인 chunk를 받아오는데 이 것이 buffer객체 형태로 온다.

on 메서드:
end 메서드:
요청 메세지의 구성
<메소드> <엔드포인트>
응답 메세지의 구성
EventEmitters, Streams - 깊게 알기엔 시간상 지금 하기엔 비효율적임. 뭔지만 알자.

1. http모듈 불러오기
2. 리슨메서드가 server객체에서 호출되어야 함.
3. 요청의 응답처리(response.end())
4. request 객체에서 메서드, url, 헤더를 받아오기(객체 구조분해할당)
5. 분기 - cors, 경로별 분기, 에러
6. 요청 바디 받아와서 응답 분기에 쓰기(비동기라서 받아오고 처리할 코드는 그 안에 있어야 함.(조건 분기))

body = Buffer.concat(body).toString(); 이 말은 데이터 조각들인 buffer들을 하나의 배열로 합쳐서 문자열로 바꿔서 담아준 것임.
—inspect를 통해 request 객체는 IncomingMessage의 인스턴스임을 알 수 있다. (npx nodemon —inspect app.js) 공식문서 인스펙터 활성화 파트 참고하기. https://nodejs.org/ko/docs/guides/debugging-getting-started/
app.js(클라이언트)에서 프리플라이트 요청 따로 안만들어도 자동으로 들어감!
하나의 요청엔 하나의 응답만 존재해야 한다. response.end()가 2번 나오면 에러!
모든 요청에 프리플라이트 요청도 같이 오는데, express에선 cors 미들웨어 사용하면 한번만 하면 되서 편리함.
setHeader vs writeHead - writeHead가 더 편리한 이유: 객체로 변수 선언해둔 헤더 응답목록에서 알아서 뽑아 쓸수 있음.
단순 요청은 특정 조건이 만족되면 프리플라이트 요청을 생략하고 요청을 보낼 수 있지만 일일히 헤더값을 수동설정하기 번거롭기 때문에 많이 안씀.

익스프레스 과제 가이드

[익스프레스 공식문서에서 읽어야 할 것!] by 교육엔지니어 민제경님
시작하기

• 설치
• Hello World
• 기본 라우팅

안내서

• 라우팅 (express.Router까지)
• 미들웨어 작성
• 미들웨어 사용

API 참조 (4.x)

• express.json()
• req.query
• req.params
• res.send()
• res.json()

자원

• 미들웨어 (cors)

[To Do List]

• mini-node-server에 cors 적용 실습
• express로 mini-node-server 리팩토링
• statesairline-server

익스프레스 공식문서 참고해서 설치, 리슨, 라우팅(매우 중요:express.Router)
미들웨어 사용시 무조건 에러나기 때문에 express 공식문서 express.json([options]) 꼭 확인. 특히 strict 프로퍼티 부분!!!!!
공식문서에서 app.use 파트 보기.
공식문서에서 req.params, req.query 보기.
공식문서에서 res.json, res.send 보기, 차이점 숙지하기.
res.end는 기존하고 똑같지만 여유되면 한번 보기.

단일 연결 리스트

// * 단일 연결 리스트
// * 단일 연결 리스트의 각 노드는 두개의 필드로 구성되어 있다.
// * 1. 데이터 필드 2. 다음 노드의 링크를 담은 필드

// 의사코드
const linkedList = {
  head: {
    value: 15,
    next: {
      value: 3,
      next: {
        value: 94,
        next: {
          value: 50,
          next: null,
        },
      },
    },
  },
};

class Node {
  constructor(value) {
    this.value = value;
    this.next = null; // 처음엔 다음 노드가 없기 때문에 null로 초기화
  }
}
// * 연결 리스트는 head와 tail에 대한 포인터를 가지고 있다.
// * 따라서 연결 리스트를 정의한 클래스의 constructor는 head, tail, 데이터갯수 3가지 프로퍼티는 반드시 가져야 함.
class SinglyLinkedList {
  constructor() {
    this.head = null;
    this.tail = null;
    this.dataLength = 0;
  }
  // * 1. 주어진 값을 받아 새로운 노드를 생성하는 push 메서드 만들기
  // * head는 처음 노드가 새로 생성될 때 해당 노드를 가리킨 상태로 고정, tail은 새 노드 추가시마다 해당 노드로 변경.
  // * 엣지케이스: head가 없다면 (리스트가 비어 있다면) head와 tail 모두 새로운 노드를 가리켜야 한다.
  // * head가 있다면 마지막 노드의 next를 새로 생성된 노드를 가리키도록 하고 tail은 새로 생성된 노드를 가리켜야 한다.
  // * length를 1 증가 시킨다
  push(value) {
    const newNode = new Node(value);
    if (!this.head) {
      this.head = newNode;
      this.tail = this.head;
    } else if (this.head) {
      this.tail.next = newNode; // 현재 tail의 next가 새 노드
      this.tail = newNode; // 새로운 tail은 새 노드
    }
    this.dataLength++;
    return this; // 리턴값은 있어야 한다.
  }
  // * 2. 노드 전체를 순회하는 traverse 메서드 만들기 (순회할수 있어야 pop 할수 있음.)
  // *
  traverse() {
    let current = this.head;
    while (current) {
      console.log(current.value);
      current = current.next;
    }
  }
  // * 3. 마지막 노드를 삭제하는 pop 메서드 만들기
  // * 엣지케이스: 리스트가 비어있으면 return undefined(this.head === null 이던가 길이가 0 이던가)
  // * tail 까지 순회. temp 변수가 현재 tail인 노드가 됨.
  // * 마지막 직전 노드(pre 변수)의 next 값을 null로 변경.
  // * tail은 pre가 됨(마지막 직전 노드)
  // * 길이 - 1
  // * 방금 제거한 노드의 value를 반환. (변수에 제거된 노드를 담아둬야 함.)
  pop() {
    if (!this.head) return undefined;
    let current = this.head;
    let newTail = current;
    while (current.next) {
      // 마지막 노드까지 순회하는 조건 - next값이 null일 때까지
      newTail = current; // 항상 마지막 이전이 newTail이 됨.
      current = current.next;
    }
    this.tail = newTail; // tail 포인터를 마지막 직전 노드를 가리키게 이동.
    this.tail.next = null; // pop 할 마지막 노드와의 링크를 끊는다.
    this.dataLength--; // 현재 데이터 수를 -1
    return current; // 제거된 노드 반환
  }
}

const list = new SinglyLinkedList();

list.push('머리');
// SinglyLinkedList {head: Node, tail: Node, dataLength: 1}
list.push('가슴');
// SinglyLinkedList {head: Node, tail: Node, dataLength: 2}
list.push('배');
// SinglyLinkedList {head: Node, tail: Node, dataLength: 3}
list.head;
// Node {value: '머리', next: Node}
list.head.next;
// Node {value: '가슴', next: Node}
list.head.next.next;
// Node {value: '배', next: null}
list.tail;
// Node {value: '배', next: null}
list.head;
// Node {value: '머리', next: Node}
list.traverse();
// 머리
// 가슴
// 배

참고 자료

• https://www.udemy.com/course/best-javascript-data-structures/

3. 리뷰

3.1 좋았던 점

3.2 아쉬웠던 점

3.3 notes

행복은 의미를 추구하는 과정에서 발생하는 부산물이다. 행복해 지려면 의미있는 것을 파악해야 한다. 시간을 들여 의미 있는 것이 무엇인지 찾아라. 작은 질문과 작은 해결책은 시간이 흐르면서 큰 변화를 이끌어낸다. 생산성은 지속적인 개선에 관한 문제다. 시작하지 않는다면 무조건 실패할 수밖에 없다. 시도하고 실패한다면, 한번 실패한 것이다. 타협하고 실패하면, 시도하지 않았다는 걸 알기 때문에 2배로 실패한 것이다. 통제할 수 있는 유일한 것은 대응하는 방식이다. 통제할 수 없는 것에 집중하면, 우리가 통제당할 수밖에 없다. 통제할 수 있는 것에 집중하라. 남에게 도움이 되고 싶다면, 스스로 유익한 사람이 돼야 한다. 특히 자신에게. 우리 내면을 개선시킬 수 없다면, 세상을 개선시킬 수 없다. 현명하게 친구를 선택하고, 자신과 친구가 되어라. 자신의 삶에 좋은 것을 공부하라. 성과는 제대로 인정하지 않으면 공허할 뿐이다. 자신의 노력을 제대로 인정할 수 없다면, 무슨 의미가 있단 말인가?! 따분한 일상에서 아름다운 음악을 찾아라. 자신이 하고 있는 일을 믿을 때, 목적은 고통을 변화시킨다.

라이더 캐롤 저, <불렛 저널> 중.

4. 할 일

과제 끝내기 개인 프로젝트