Skip to content

[Day5] 20210226 쇼핑하우

kyle edited this page Feb 28, 2021 · 1 revision

20210225 - 쇼핑하우

TODO

  • 두개의 slide(캐러셀) 공통 부분 따로 구현하기
  • 더보기 누를 때마다 데이터 가져오기

크롱 수업

  • HTTP 헤더에 대해 공부해야한다.
  • HTTP 메소드 공부. 특히 GET,POST - 차이 (multipart를 이용해서 form을 통해 비동기로 서버에 사진같은 걸 보내는 연습하면 배우기 좋다.)

로그인 상태

서버에서 매번 사용자 인증을 하려면 매우 번거롭다. 응답이 느려질 것이다.

원래는 stateless로 상태를 보관하지 않지만 서버에서 session을 이용해서 stateful하게 할 수 있다.

세션을 이용해서 stateful한 웹사이트

  1. 맨 처음 로그인

    클라이언트 : POST로 로그인 정보를 보낸다.

    서버: session ID를 만들고 cookie에 담고 set-Cookie를 이용해 응답할 때 헤더에 같이 보내준다. DB에 session ID를 저장한다.

  2. 로그인 후 이용 (stateful)

    클라이언트: 쿠키에 있는 session ID가 HTTP Request 헤더에 자동으로 포함돼서 날라간다.

    서버: DB에서 유효한 session ID인지 확인해서 그에 맞는 응답을 해준다.

토큰기반 stateful? JWT?

서버에서 상태값을 보관하지 않는다. 즉, DB에 세션관련 정보를 저장하지 않는다.

  1. 서버에서 토큰 정보를 보내 클라이언트를 저장

  2. 서버에서 토큰 정보가 유효한지만 확인해서 stateful처럼 작동하게 만들 수 있다.

API에 대한 응답만 줄 때 토큰기반 인증을 많이 한다.

  • API에 대한 응답이란?

    서버가 웹페이지 같은 것이 아닌 JSON응답만 주는 것. 주로 싱글페이지에서 이루어진다.

피드백 - 수정 및 주의해야 될 사항

  • 한 컴퓨터에서 client와 server할 때 폴더를 나눠서 구현하는 것도 좋은 방법이다.
  • 코드에는 URL값은 파라미터로 받게 해야한다. (중요)
  • 캐쉬를 고려하는 습관을 가지자. 반복되는 연산 같은 값을 기억해 연산을 줄이는 것이 좋다.
  • !!value 로 불린값으로 나타낼 수 있다.

공부하는 법?

SASS를 쓴다는 것, 문법 같은 것을 배우는 것보다는

- SASS가 어떻게 CSS로 컴파일이 되는지?
- parser가 어떻게 되어있는지

즉 어떻게 되는 것인지 과정 및 원리를 아는 것이 중요

캐러셀 구현방법

캐러셀 구현방법 정리