분류 전체보기

OAuth 로그인이란?보통 우리가 직접 로그인을 구축할 때는 사용자에게 아이디 또는 이메일 & 비밀번호를 입력하게 만든다. 그런데 사용자가 쓰는 서비스가 한두 개도 아닌데, 그 서비스마다 새로운 아이디 또는 이메일과 비밀번호를 입력해야 하면 불편할 것이다. 이때 제3의 서비스에게 이러한 인증 과정을 맡길 수도 있다. 즉, 사람들이 이미 많이 쓰고 있는 서비스인 구글/카카오/네이버로 로그인을 하면 우리 서비스에서도 로그인이 된 것처럼 처리하는 것이다. 결국 로그인 및 회원가입을 하는 이유가 사용자 고유의 정보로 사용자 계정을 식별하기 위한 것이므로, 이미 회원가입이 되어 있는 다른 서비스에서 대신 로그인하고 그 서비스에서 사용자 고유 정보(이메일, 닉네임 등)을 받아오는 것이다.OAuth는 바로 이러한 인..

솔직히 말해서 2024는 매일같이 "내가 이 정도인 건 아닌데, 이것보다 더 잘할 수 있는데"라는 생각을 했던 해였던 것 같다. 올해를 요약하자면 아래와 같다.Jen-Feb: 공모전 참여24년도의 첫 시작이자 마지막 겨울 방학은 내내 GDSC에서 진행하는 프로젝트인 Google Solution Challenge 2024를 위한 개발을 하면서 모든 시간을 보냈다. 사실 이 프로젝트는 내가 진행했던 것 중 가장 독특한 프로젝트가 아닌가 한다. Wearable 기기, 그것도 AI를 적용한 프로젝트를 진행한 게 처음이었기 때문에 재미도 있었고 정말 예상치 못한 어려움도 있었다. 또한 구글이 요구하는 빡빡한 조건들을 모두 맞춰서 프로젝트 개요를 쓰느라 정말 힘들기도 했고, 프로젝트 기획서를 제대로 써보는 소중한 ..

Refresh Token을 왜 구현해야 하는가?우리는 일반적으로 한번 로그인한 사이트에서는 어느 정도 계속 로그인이 유지되길 바란다. 특히 자주 방문하는 웹사이트를 매번 로그인해야 한다면 정말 번거로운 일이 된다. 하지만 이를 위해서 Access Token의 유효기간을 매우 길게 설정한다면, 악의적인 공격자가 이 Access Token을 탈취해서 사용할 수 있는 위험성이 커진다.이를 해결하기 위해서 Access Token 자체의 유효기간은 짧게 설정(예: 한 시간)하되, Access Token이 expired될 경우 로그인 없이 새롭게 발급받을 수 있게 도와주는 토큰이 Refresh Token이다. Refresh Token은 더 긴 유효기간을 가지고 있으며, (예: 일주일) 이 유효기간 동안 Expire..

Presigned URL이란?일반적으로 사진과 같은 미디어는 S3 버킷으로 업로드되고, 해당 사진의 엔드포인트(url)만 RDB에 저장된다. 이때 사진 파일은 굉장히 많은 트래픽을 소모하므로, 프론트엔드→백엔드→ S3로 전달하는 것보다 프론트엔드→S3로 전달하는 것이 더 효율적이다. 또한 이미지를 조회할 때도 S3→백엔드→프론트엔드보다는 S3→프론트엔드로 전달하는 게 서버의 과부화를 막을 수 있다.여기서 문제는 AWS 리소스인 S3에 접근하기 위해서는 엑세스 키처럼 권한이 필요한데, 이 키를 프론트엔드가 직접 사용할 수는 없다는 것이다. 프론트엔드는 사용자가 접근 가능한 영역이므로, 프론트엔드에 키를 줄 경우 유출 문제가 생길 수 있다.이 문제를 해결하기 위해서 사용하는 것이 바로 presigned ur..

Tailwind CSS란?HTML와 CSS 파일을 별도로 두지 않고, HTML 코드 내에서 관리할 수 있도록 돕는다. 또한, 클래스 명에 대해서 고민할 필요가 없기 개발할 수 있도록 돕는다. 이게 가능한 이유는 Tailwind CSS 내부에 이미 정의된 유틸리티 클래스가 있는 Utility-First Fundamentals이기 때문이다. dark: 를 통해서 다크모드에 대한 스타일링 정의를 할 수 있고, md:등의 수식어로 빠르게 반응형을 만들 수도 있다. first-child, last-child, required, invalid, disabled 등의 다양한 수식어 또한 적용 가능하다.Tailwind CSS 설치하기난 패키지 매니저로 pnpm을 사용하고 있기 때문에 다음과 같이 설치해주었다. 여기서 ..