1. 카카오 디벨로퍼스 사이트에 가서 회원 가입https://developers.kakao.com/ Kakao Developers카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.developers.kakao.com 2. 내 에플리케이션 추가 대략적으로 작성하고 저장 3. 설정하기 1) 카카오 로그인 활성화 대시보드 > 설정 > 카카오로그인 > 설정하기 클릭 카카오 호그인 활성화 설정 on 으로 설정 2) 동의 항목 설정 (닉네임 / 프로필 사진 등 ) 3) 앱키로 가서 REST API 키를 복사 한다. 아래 코드의 VITE_KAKAOCLIENT_ID 에 넣을 예정 4. 카카오 로그인 문서를 ..

OAuth란 무엇인가?OAuth는 Open Authorization의 줄임말이다. 사용자의 인증을 이미 신뢰할 수 있는 다른 서비스가 대신해주는 인증 방식이다.예를 들어, 구글 계정으로 다른 웹사이트에 로그인하는 경우를 떠올리면 된다. 이런 방식이 바로 OAuth의 대표적인 예시이다.기존 회원가입 방식과의 차이점어떤 웹사이트를 처음 이용할 때 보통은 이름, 아이디, 비밀번호 등 여러 정보를 직접 입력하여 회원가입을 해야 한다.하지만 소셜 로그인을 활용하면 이런 과정을 생략할 수 있다. 이미 가입되어 있는 다른 서비스의 인증을 통해 로그인하기 때문이다.이렇게 하면 사용자 입장에서는 정보를 일일이 입력하는 번거로움을 줄일 수 있고, 서비스 제공자 입장에서는 직접 회원 정보를 관리하지 않아도 되는 이점이 있다..

useActionStateuseActionState 는 인자로 3개의 인자를 반환한다.const [state, formAction, isPending] = useActionState( handleSubmit, null ) 이 훅은 actionFunction이 실행된 결과 상태(state)를 추적하고,그 액션을 트리거할 수 있는 함수(formAction)를 리턴하며,현재 실행 중인 상태인지를 알려주는 isPending도 함께 제공한다. 1. state액션 실행 후의 결과 상태. 예를 들어, 서버에서 리턴된 메시지나 에러 등이 여기에 담긴다. 처음에는 null이다. 2. formActionhandlrSubmit 을 실제로 실행시킬 수 있는 함수. 처럼 사용한다.. 3. isPendingtrue일 경우, 현재..

토큰 인증 방식이란?토큰은 쉽게 말해 입장권이나 출입증과 같은 인증 수단이다. 클라이언트가 서버로부터 인증을 받으면 서버는 토큰을 발급해주고, 클라이언트는 이 토큰을 들고 다니며 서버에 요청할 때마다 제출함으로써 인증을 대신하게 된다. JWT (JSON Web Token) 소개 웹에서 많이 사용하는 토큰 방식 중 하나는 JWT 이다.JWT는 JSON 형태의 데이터를 담고, 이를 인코딩하여 만든 토큰이다. 이 토큰은 총 3개의 구성 요소로 이루어져 있다.1. Header (헤더)토큰의 타입 (typ)과 알고리즘 정보 (alg)가 담겨 있다.예시:{ "alg": "HS256", "typ": "JWT"}2. Payload (페이로드)사용자 정보나 토큰에 담을 데이터가 들어간다.예시:{ "name": "J..

서버에서 session 정보를 삭제 했을 때 서버에서 session 정보를 보관하기 때문에 서버에서 session을 삭제 하게 되면 로그인 시 에러가 발생된다. 서버에서 session 설정app.use( session({ secret: "session secret", // 암호화 할 때 열쇠와 같은 문자열 resave: false, // 내용의 변경이 없어도 저장을 할 건지 saveUninitialized: false, // 요청의 내용이 비어 있을 때 저장을 할 건지 })); Session 이름 설정app.use( session({ secret: "session secret", resave: false, saveUninitialized: fals..

쿠키(Cookie)란 무엇인가?쿠키는 클라이언트(브라우저)에 저장되는 짧은 텍스트 데이터로, HTTP 프로토콜의 **무상태성(statelessness)**을 보완하기 위해 사용되는 도구다.HTTP의 무상태성이란?HTTP는 기본적으로 서버가 이전의 요청이나 응답을 기억하지 못하는 구조이다.예를 들어, 사용자가 “아메리카노 한 잔 주세요”라고 요청하고, 서버가 “따뜻하게 드릴까요?”라고 응답한 뒤, 다시 “아이스로 해주세요”라고 요청해도 서버는 이전 요청을 기억하지 못한다.이처럼 HTTP는 매 요청마다 독립적으로 처리되기 때문에 상태를 유지하지 않는다. 쿠키의 역할이러한 무상태성을 보완하기 위해 쿠키가 등장하게 되었다.서버는 한 번의 요청-응답 이후에 **클라이언트에게 정보를 저장하도록 지시(set-cook..