프라이D
프라이Develog(❁´◡`❁)
프라이D
전체 방문자
오늘
어제
  • ALL (378)
    • TDD, Cleancode with JavaScr.. (5)
    • 프로젝트 (32)
      • work (3)
      • 직접 만드는 기술 블로그 (2)
      • 데일리 옥션 (19)
      • 모락모락 (8)
    • Computer Science (1)
    • Algorithm & 자료구조 (94)
      • 알고리즘 w.JavaScript (53)
      • 자료구조 (5)
      • (인프런) 자바스크립트 알고리즘 문제풀이 (34)
    • JavaScript (45)
      • JavaScript (41)
      • 모던 자바스크립트 Deep Dive (4)
    • WEB (13)
    • 회고 (12)
    • TIL (109)
    • WIL (7)
    • Stacks (20)
      • React.js (6)
      • Next.js (1)
      • Redux (3)
      • Node.js (2)
      • GIT (2)
      • SAP (1)
    • 15일 메이킹 프로젝트 (15)
    • 이전 기록 (14)
    • ETC. (5)
    • ---------------2021 (6)
      • 내일배움단-웹개발 5주 (2)
      • 정보처리기사 (4)

블로그 메뉴

  • 홈
  • 태그
  • 미디어로그
  • 위치로그
  • 방명록

공지사항

인기 글

태그

  • 내일배움카드
  • 코드스테이츠
  • MySQL
  • 자바스크립트
  • 모던자바스크립트딥다이브
  • 코딩프로젝트
  • Til
  • vanilaJS
  • JavaScript
  • nomadcoder
  • 스파르타코딩클럽
  • nomadcoders
  • 비트마스크
  • 자바스크립트비트마스크
  • 투포인터알고리즘
  • 자바스크립트알고리즘
  • 국비지원
  • 2023 인프콘 후기
  • 내일배움단
  • 알고리즘

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
프라이D

프라이Develog(❁´◡`❁)

[Day 37] 2022-0812
TIL

[Day 37] 2022-0812

2022. 8. 13. 17:53

🐈오늘 공부한 것

✔️CORS  복습

서버와 브라우저의 origin이 다를 경우 브라우저의 리소스 요청을 처리할 수 있는 매커니즘 (권한 부여). SOP 정책 때문에 서로 다른 origin 끼리는 리소스를 공유할 수 없는데, api 요청 등 필요한 상황에서는 리소스의 공유가 이루어질 수 있도록 권한을 부여할 수 있다. CORS 설정은 응답 헤더에 Access-Control-Allow-Origin(아직도 헷갈린다;) 항목에 허용할 origin을 포함시켜 응답을 해주면 된다. 만약 이 항목에 대한 값이 * 이라면, 이는 전체 origin에 대한 CORS 설정을 의미한다! 

참고로 origin이란 스키마(프로토콜), host, port 까지를 의미하며, 엔드포인트는 포함되지 않는다. 

또 CORS 와 SOP 는 어디까지나 브라우저의 제한사항이기 대문에 포스트맨등에서는 cors 에러가 없을 수도 있음!

✔️Buffer와 Stream

먼저 스트림이란 데이터 컬렉션을 의미한다. 자료가 원활히 전송될 수 있도록 하는 데이터 통로같은 느낌? 버퍼는 데이터의 임시 저장공간이다. 입출력 전송의 속도 차이가 있을 수 있는데, 한 쪽에서 처리가 완료될 때까지 데이터들이 대기하는 공간이다. 버퍼를 사용할 땐 API 호출 횟수가 줄어서 성능 개선에 도움을 줄 수 있는데, 상호작용이 빠르게 이루어져야하는 경우에는 버퍼를 사용하는게 적합하지 않을 수도 있다. 무조건 사용하는 것은 아니라고 한다!

✔️express로 웹서버 구현하기

오늘 과제는 전날 http 모듈로 구현했던 내용을 express 라이브러리를 사용해 리팩토링하고, 조금 더 복잡한 기능을 하는 웹서버를 구축하는 과제였다. 이 부분은 내용이 많아서 별도로 정리해야 할 것 같다. 일단 express를 사용하면 기존에 request body 에 접근하는 과정을 간소화 할 수 있다. 기존에는 request.method 의 값을 하나씩 확인해 조건에 따라 분기를 해줬는데, express에서는 해당 http 메서드만을 위한 함수가 존재하고 있어서 코드가 짧아지고 가독성이 좋아진다.  그리고 cors 설정을 하는 express의 라이브러리도 있어서 이 과정도 간소화된다. 복잡하고 어려웠던 부분은 일단 라우팅을 라우터를 활용해서 별도의 파일로 분리시킬 수 있다는 점이었는데, 코드를 봐도 잘 이해가 되지 않는다. 또한 .use 로 미들웨어를 사용하고,  res.json, res.send 같은 메서드로 응답을 전송할 수 있는데 이 부분도 많이 어려웠다. res.json으로 응답을 보내줄 때 객체 리터럴로 만든 데이터를 리턴하니 테스트에는 통과를 못했는데, res.json이 정확히 어떻게 동작하는 건지도 궁금해졌다. 그리고 미들웨어에 대해서는... 거의 모르겠다 T.T 

 

🐈더 공부할 것

1. express의 메서드와 미들웨어, 라우팅 .. 전체적인 개념에 대해서 다시 짚고 넘어가야겠다.

🐈오늘의 느낀 점

1. 사실 오늘은 8월 12일이 아니고 13일이다. 금요일 오후가 되면 좀 늘어지는 경향이 있는데, 어제 내용이 어려웠다보니 늘어짐이 심해져서 결국 당일 복습 원칙을 깨고 말았다 ㅜㅜ. 다만 다행인 것은 루틴이 깨져도 회복하는데 이전보다 시간이 짧아졌다는 점? 공부할 내용이 많다고 생각하면 일단 한 번 회피하고 보는 경향이 금요일이 되면 심해지는 것 같다. 

 

2. 월요일이 공휴일이라 3일의 시간이 있다. 한 번에 여러가지 일을 하려고 하지 말고 되도록 통으로 진행하는 습관을 들여봐야지. 

저작자표시 (새창열림)

'TIL' 카테고리의 다른 글

[Day 39] 2022-0817  (0) 2022.08.18
[Day 38] 2022-0816  (0) 2022.08.17
[Day 36] 2022-0811  (0) 2022.08.11
[Day 35] 2022-0810  (0) 2022.08.10
[Day 34] 2022-0809  (0) 2022.08.09
    'TIL' 카테고리의 다른 글
    • [Day 39] 2022-0817
    • [Day 38] 2022-0816
    • [Day 36] 2022-0811
    • [Day 35] 2022-0810
    프라이D
    프라이D
    틀린내용 정정 및 개선사항은 언제든지 댓글 달아주세요 :D

    티스토리툴바