Peter's hardware & software

한국에서는 꼭!? 카카오 로그인되야 하나? 몰라 ㅋㅋㅋ 일단 해보자. 제목에 #1 달아놨는데 뭔지 알겠지? ㅋㅋ 한번에 안끝날거 같네? ㅋ 뭐 카카오 문제는 아닌거 같은데 뭔가 삐그덕 거려. 시작해보자구. 카카오 로그인 사용하려면 우선 https://developers.kakao.com/ 에 로그인 해야해. 👇👇👇 뭐해! 애플리케이션 추가 안 누르고 ㅎㅎㅎ 앱 아이콘 대강 선택하고, 앱 이름도 넣고 사업자 명도 넣고~ 없다고? 아무거나 넣어 ㅋㅋㅋ 그리고 저장! 그러면 앱 키들이 주르륵 보이고, 그중에 REST API KEY 키는 Client id로 nextauth에서 사용할거니까 그렇게 알아두시고~~ 조 아래 플랫폼 설정하기를 눌러서 웹 프로젝트라고 알려주자구. 가장 하단에 웹 플랫폼 등록하기 눌르고 ..

중요!) 2022년 6월 23일 현재 next-auth 소셜 로그인에 약간 문제가 있어. 어휴 지친다. cognito로 소셜 로그인을 하면 cognito에서는 정상적으로 로그인되지만 next-auth의 하위 모듈인 openid-client에서 nonce mismatch error를 뱉어. 이 때문에 next-auth 세션이 로그인 상태로 안가고 error 페이지로 리디렉션! 이 상태에서 한번 더 로그인을 시도하면 cognito는 이미 로그인이 되어 있는 상태여서 그런지 ㅎㅎㅎ 에러 없이 로그인 상태로 넘어가. 유저가 로그인 두번 눌러야 한다는 거지 -_-;; 암튼 그래서 현재 PR을 기다리고 있어. 👉 #4100 PR이 완료되기 전까지 사람들이 임시방편으로 patch-package를 사용해서 버티고는 있..

next.js에다가 aws amplify auth로 로그인을 구현해보자구. google부터 해볼거야. 나머지는 뭐 똑같겠지. 난 새로운 이메일 계정으로 aws 새로 가입해서 처음부터 시작했어. 새로 만들고 amplify 들어가면 누를 수 있는게 -_- 시작하기 두개 뿐이 없어. 지금 호스팅을 할건 아니니까 amplify studio 시작하기 버튼 클릭. 이제 앱 이름 각자 넣고 confirm deployment 클릭. 그리고 나면 몇분 동안 amplify 설정을 해. 조금 기다려주자 ㅋ 완료가 되면 아래와 같이 대쉬보드가 나오는데.. 이것 저것 살펴보자 ㅋㅋ 하지만 당신이 누를 수 있는 건 backend environments의 studio 시작 버튼 뿐이 없어 ㅋㅋㅋ 의심하지 말고 눌러보자. 이제 am..

2022.06.02 - [Next.js] - nextauth + firebase authentication #1 nextauth + firebase authentication #1 nextjs에 next-auth를 넣고 firebase authentication이랑 연동하는 걸 해봤는데 되긴 하더라구. 그래서 블로그를 남기는데 이것 저것 테스트하던 프로젝트 위에 하니까 지저분하고 그래서 새로 nextjs 프로젝 engschool.tistory.com 이전 글에 이어서 계속할게. nextjs에다가 nextauth로 google 로그인 하는 것까지 했어. GCP 설정도 했고. 이제 firebase authentication 활성화하고 연결해 붙이는 것까지 해보자구. 이전까지 구글 로그인은 됐는데 해당 로그인..

nextjs에 next-auth를 넣고 firebase authentication이랑 연동하는 걸 해봤는데 되긴 하더라구. 그래서 블로그를 남기는데 이것 저것 테스트하던 프로젝트 위에 하니까 지저분하고 그래서 새로 nextjs 프로젝트 만드는 것부터 nextauth 설정, GCP, firebase 설정까지 차근차근 가보는 글이야. github에도 깔끔하게 남겨두고 하려고 👇👇👇👇👇👇 Github: https://github.com/peter-bang/nextauth-fb-authentication GitHub - peter-bang/nextauth-fb-authentication: Next.JS example project for nextauth and firebase authentication Next..

미친짓을 많이 하는 편이긴 한데 -_-;; 굳이 nextauth를 사용하면서 firebase authentication에 붙여봤어 무쓸모인가? ㅋㅋ 아 몰라 ㅋㅋ 뭔가 잘 정리되어 있고 nextjs에 최적화 되어 있는 nextauth를 사용하면서 일반 DB사용하면서 개고생하는게 아니라 firebase authentication 같은 기능으로 관리받고 싶었어! ㅋ 내용을 먼저 간단하게 설명하자면 1. firebase 프로젝트 새로 만들기, gcp 사용자 인증정보 새로 만들기(client id랑 client secret 받아야 구글 로그인 가능) 2. next.js에 nextauth설치 후 google login example 작성해서 테스트 해본 다음에 3. firebase 설치 후 init 했고 4. ..

Nextjs에 로그인 적용하는 방법은 두가지라고 되어 있어. 첫 번째는 클라이언트에서 유저 데이터 Fetch하고 Loading state 사용하는 거고 (대부분 이런 방식을 사용하겠지) 그리고 두 번째는 서버에서 유저 데이터 Fetch하고 클라이언트에 아예 인증된 페이지만 주는 거지. 당연하겠지만 첫 번째 방식은 빠르지만 인증되지 않는 페이지들도 노출되고 두 번째 방식은 인증되지 않은 페이지는 클라이언트는 아예 보지도 못하므로 보안성은 훌륭할거야. 대신 서버는 병목이 엄청날거야. 매 request마다 페이지 pre-rendering해서 클라이언트에 뿌려줘야 하니깐. 그래서 ㅎㅎ 보통 첫 번째 방식을 사용하겠지 ㅋㅋㅋ 우린 또 느린 건 못참잖아? ㅋ 뭐 이런건 중요하지 않지 ㅋㅋ 그래서 Next.JS에서 ..