2023.04 첫째 주 WIL

이형준·2023년 4월 10일
0

WIL

목록 보기
1/1

PICO.CSS

PICO.CSS란?

시멘틱(각 요소의 의미에 맞게 작성하는)HTML을 위한, 미니멀한 CSS 프레임워크이다. Class 선택자 문법 없이 깔끔한 디자인을 할 수 있게 도와준다.

내가 느낀 PICO.CSS의 장점

PICO.CSS는 익숙한 Bootstap과 비슷하게 사용 가능하므로 적응하기 편했다. 또한 모든 요소에 동적으로 반응하며, 유저의 다크 모드 설정에 따라 자동으로 변화하는 등 사용하기 매우 편리하다. Bootstrap과 비교할 수 없는 수준으로 코드를 간단하고, 시멘틱하게 짤 수 있도록 도와준다.

내가 느낀 PICO.CSS의 단점

PICO에서 추가한 요소를 수정할 경우, 간단한 크기 조절과 같은 작업은 문제없었다. 하지만 이보다 조금 복잡한 디자인을 넣고 싶은 경우에 Bootstrap과 달리 내가 원하는 대로 동작하지 않는 경우가 많았다. 아무리 봐도 그냥 큰 수정 없이 컴포넌트를 넣고 사용하는 데에 초점이 맞춰져 있는듯?

또한 사용 중 서버가 내려갔는지 프레임워크가 먹통이 되는 현상이 간헐적으로 발견됐다. 주기적으로 발생하는 문제라면 꽤나 큰 문제일듯

총평

사용 편의성이 매우 뛰어나지만 구현할 수 있는 디자인은 부족한, 요약하기 쉬운 CSS 프레임워크다. 먹통이 되는 현상만 일어나지 않는다면, 1) 본인이 프론트엔드 작업을 귀찮아하고 2)간단한 개인 웹 같은 곳에 적용할 예정이라면 충분히 고려해볼 만 한 가치가 있다고 생각한다.

쿠키와 세션, 그리고 JWT

등장배경

HTTP 프로토콜의 단점 보완을 위해 등장함. HTTP 프로토콜은 커넥션 종료 시 데이터를 유지하지 않는다. (Statless 프로토콜) 하지만 데이터가 유지되지 않는다면 상당히 불편함이 꽃피겠지?
이를 위해 등장한 녀석들이라고 볼 수 있겠다.

쿠키란 무엇인가?

  • Google의 쿠키 사용법에서 발췌
    쿠키는 사용자가 방문한 웹사이트에서 사용자의 브라우저에 전송하는 작은 텍스트 조각입니다. 쿠키가 있으면 웹사이트에서 사용자의 방문에 관한 정보를 기억하여 다음번에 사이트에 방문했을 때 번거로운 작업을 피하고 더 유용하게 사이트를 활용할 수 있습니다.

쿠키의 특징

  • 이름, 값, 만료일(저장기간), 경로 정보로 구성되어 있다.
  • 클라이언트에 총 300개의 쿠키를 저장할 수 있다.
  • 하나의 도메인 당 20개의 쿠키를 가질 수 있다.
  • 하나의 쿠키는 4KB(=4096byte)까지 저장 가능하다.

세션

  • 세션은 클라이언트가 웹브라우저를 통해 웹서버에 접속한 시점부터 웹브라우저를 종료하는 시점까지 클라이언트가 누군지 구별하고 클라이언트에 따라 다른 권한을 주기 위해 사용되는 기술
  • 클라이언트는 세션 ID를 보관, 서버는 각 ID를 구별할 수 있는 세션 데이터를 보관
  • 인증 요청이 들어오면 이를 매칭시켜 웹 브라우저 종료 전까지 유저를 기억할 수 있게 함
  • 쿠키만을 이용해 유저를 기억하려 한다면 유저의 데이터를 쿠키에 담아 보내야 하기에 보안이 좋지 않지만, 세션은 그럴 필요가 없기에 비교적 보안이 좋다.
  • 각 페이지끼리의 정보 전달은 쿠키를 이용 -> 쿠키는 정보 전달 매개체라고 생각하면 편할듯
  • 서버에 세션 데이터를 저장할 공간이 필요하다는 것이 단점

JWT

  • JWT는 Json 형태로 이루어진 세션, 쿠키를 대신하는 문자열 토큰 (Json Web Token)
  • JWT는 Header, Payload, Signature 세 부분으로 이루어짐
  • 인증 요청시, 서버가 유저에게 발급해주는 육중한 쿠키라고 생각하면 편할듯?
  • 유저는 이제 이 토큰 서버에 요청할 때 같이 제시함. 서버는 이를 확인하고 유효하다면 작업 처리
  • 서버는 세션 데이터와 같은 것 필요 X 그때그때 JWT가 유효한지만 검사하면 되니까 좋다.
  • 장점도 많지만, 중요 데이터를 JWT에 싣는다거나, 보안 키를 대충 짓는 등의 실수를 한다면 보안이 박살날 수 있음.

Jinja2

Jinja2란?

Flask 웹 프레임워크에 내장된 웹 템플릿 엔진으로, 다른 파이썬 웹 프레임워크인 Django의 템플릿 시스템에서 영감을 받아 제작되었다고 한다.

기본적인 기능은 웹 템플릿 페이지에 데이터를 전달할 수 있고, HTML 내에서 파이썬처럼 코딩이 가능한 것. SSR을 구현하는 데 사용했었는데, 상당히 사용하기 편리했다.

추가적으로 보안 요소 강화, 템플릿 상속과 같은 강력한 기능들도 지원한다고 한다.

추가적인 정보는 Jinja2 공식 문서를 확인해보자

profile
저의 미약한 재능이 세상을 바꿀 수 있을 거라 믿습니다.

0개의 댓글