데브허브 | DEVHUB | Next.js Authentication & Login

이 영상에서는 풀스택 Next.js 프로젝트에 인증을 추가하는 방법을 알아봅니다. 로그인 및 로그아웃 화면부터 미들웨어를 사용한 경로 보호까지, Next.js 프로젝트를 쉽게 구성하는 방법을 알아봅니다.

⭐ 신규 계정에는 "davegray" 코드를 입력하시면 Sentry 팀 플랜을 3개월 동안 무료로 이용하실 수 있습니다.
Sentry 홈페이지: https://bit.ly/sentry-dg
Sentry 가입: https://bit.ly/try-sentry-dg
Sentry Next.js: https://bit.ly/sentry-nextjs-dg
Sentry Next.js 문서: https://bit.ly/sentry-docs-dg

🔒 Kinde 인증: https://kinde.com/dgray-nextjsstack/

🔥 Neon Postgres: https://fyi.neon.tech/davegray

👉 초보자를 위한 웹 개발 로드맵(무료!): https://bit.ly/DaveGrayWebDevRoadmap

💖 Patreon에서 후원해 주세요 ➜   / davegray  

🚩 구독하기 ➜ https://bit.ly/3nGHmNn

📬 강좌 업데이트 ➜ https://courses.davegray.codes/

❓ Discord에서 질문하고 토론하세요 ➜   / discord  

☕ 커피 한 잔 사주세요 ➜ https://www.buymeacoffee.com/davegray

🔗 Next.js 풀스택 프로젝트 재생목록:    • Next.js Full Stack Project with Nextjs 15 ...  

👇 소셜 미디어 팔로우:
GitHub: https://github.com/gitdagray
Twitter:   / yesdavidgray  
LinkedIn:   / davidagray  

🔗 강좌 자료: https://github.com/gitdagray/nextjs-f...

Next.js 인증 및 로그인 | Nextjs 15 풀스택 프로젝트

(0:00:00) 소개
(0:01:11) 기술 스택
(0:01:31) 사용자 스토리 체크리스트
(0:04:09) Kinde 인증 vs "롤 유어 오운"
(0:06:18) 무료 Kinde 계정 설정
(0:08:53) 기존 코드베이스에 Kinde 추가
(0:10:05) Next.js 15를 사용하여 Kinde 설치
(0:13:45) 환경 변수 추가
(0:15:16) 필수 API 경로
(0:16:56) 로그인 페이지 생성
(0:20:47) Kinde 인증 설정
(0:25:45) 사용자 추가
(0:26:42) 권한 추가
(0:29:38) 다중 인증(Multi-Factor Auth) MFA
(0:31:09) 로그아웃 버튼 만들기
(0:35:43) 미들웨어를 사용한 경로 보호

📚 튜토리얼 참고 자료:
🔗 Next.js: https://nextjs.org/
🔗 ShadCN/ui: https://ui.shadcn.com/
🔗 Sentry Next.js: https://bit.ly/sentry-nextjs-dg
🔗 Tailwind CSS: https://tailwindcss.com/
🔗 TypeScript: https://www.typescriptlang.org/
🔗 Neon Postgres: https://fyi.neon.tech/davegray
🔗 Kinde 인증: https://kinde.com/dgray-nextjsstack/

이 Next.js 풀스택 인증 및 로그인 튜토리얼이 도움이 되셨나요? 도움이 되셨다면 공유해 주세요. 댓글로 여러분의 생각을 남겨주세요.

#nextjs #인증 #로그인

로딩 중...

Next.js Authentication & Login | Nextjs 15 Full Stack Project

[토비살롱🌱] 오프라인 밋업 1부 - 믿고 보는 개발자, 최범균님

글로벌 AI 챌린지 1위 휩쓴 한국 스타트업 ... 신용 정보 0인 인도 10억 인구를 분석하는 한국 AI 아키텍처 [안될공학x어피닛]

GPT5 Codex 나오자마자 사용 해봤는데 아주 강력합니다

바이브 코딩으로 17일만에 1.2억번 개발자 작품보기 (누적 30억이상 )

Build and Deploy A Responsive React Landing Page using TailwindCSS V4

How Google saves petabytes of CDN data transfer everyday