[Saida Lab] Next-auth 적용하기 (3)_build error

이제 로그인과 관련된 기능들도 잘 동작하고 끝났다고 생각 했는데, 요기 베라의 명언은 이 개발씬에서도 매번 적용이 되는거 같다. 끝날 때까지 끝난게 아니다 - Yogi Berra 왜 또 뭐가 문제인데? 이번에는 build 과정에서 발생한 문제였다. Type error: ... Property 'authOptions' is incompatible with index signature. Type 'AuthOptions' is not assignable to type 'never'. 6 | 7 | // Check that the entry is a valid entry > 8 | checkFields

• format_list_bulleted Stack/Next.js
• · 2024. 3. 17.
• textsms

[Saida Lab] Next-auth 적용하기 (2)_callback

지난 번에는 Next-auth를 이용해서 간단하게 카카오 로그인을 구현해 봤다. React를 사용 했을 때와 비교해 봤을때, 초기에 세팅하는 구조가 달라서 조금 헷갈릴 수 있겠지만 사용하는 방법은 (개인적으로) 월등하게 편하게 사용할 수 있지 않나 하는 생각이 든다. 거기다가 useSession을 사용하면 어떤 페이지에서도 가져와서 사용할 수 있다는 점도 좋은 점 중 하나인 것 같다. 그렇게 카카오 로그인을 해결한 개발자는 오래오래 행복하게 살ㅇ... 뭐가 문젠데? 현재까지 적용한 것만 보면 카카오에서 전달해준 유저의 기본적인 정보와 카카오에서 제공하는 토큰을 사용할 수 있게 됐다. 그러나 서버의 API는 카카오의 토큰을 사용할 수 없고, 서버에서 제공해 주는 토큰을 사용해야만 통신을 할 수 있다. 그래..

• format_list_bulleted Stack/Next.js
• · 2024. 3. 16.
• textsms

[Saida Lab] Next-auth 적용하기 (1)_app router + kakao Login

전에 리액트를 이용해서 소셜 로그인 (카카오 로그인)을 구현했던 경험이 있었다. 그 때 기억 때문에 이번에 프로젝트 진행할 때, 그 방법 그대로 하려고 하다가 CTO님께서 '다른 프로젝트에서도 Next-auth 사용해서 적용했으니 이번에도 적용해봐요' 라고 하셔서 몇일간의 고생 끝에 적용한 내용을 기록하려고 한다. React로는 어떻게 했더라.. 카카오 디벨로퍼에 있는 문서를 보면 REST API를 사용하는 방식으로는 위와 같은 방식을 진행한다고 적혀있다. 실제로 나도 위 문서를 토대로 로그인 작업을 진행했었다. a 태그에 카카오 인가코드 받을 수 있는 링크 연결해 주고, 리다이렉트 경로 설정해서 내 프로젝트의 설정한 경로로 오게 되면 서버로 인가 코드 보내줘서 서버가 토큰을 받아오게 하거나, 아니면 클..

• format_list_bulleted Stack/Next.js
• · 2024. 3. 15.
• textsms