정훈's 프로그래밍

1. 필요한 패키지 설치터미널에서 다음 명령어를 실행하여 NextAuth, MySQL2(프로미스 지원), bcryptjs 패키지를 설치합니다.npm install next-auth mysql2 bcryptjs2. NextAuth API 라우트 생성Next.js의 API 라우트를 사용하여 인증 엔드포인트를 생성합니다. (Next.js 13 기준으로 pages 디렉터리를 사용하는 경우의 예제이며, app 디렉터리 사용 시에는 약간의 구조 차이가 있습니다.)파일 경로: pages/api/auth/[...nextauth].ts"use server";import NextAuth from "next-auth";import CredentialsProvider from "next-auth/providers/creden..

1. 프로젝트 루트에 .env 파일 생성프로젝트 루트(예: package.json 파일이 위치한 곳)에 .env 파일을 생성합니다.보통 민감한 정보(예: 데이터베이스 접속 정보, API 키 등)를 저장합니다.MYSQL_HOST=localhostMYSQL_USER=your_mysql_usernameMYSQL_PASSWORD=your_mysql_passwordMYSQL_DATABASE=your_database_name주의:클라이언트 사이드에서 사용해야 하는 변수는 반드시 NEXT_PUBLIC_ 접두사를 붙여야 합니다.예: NEXT_PUBLIC_API_URL=https://example.com/api2. Next.js가 .env 파일을 자동으로 로드Next.js는 기본적으로 프로젝트 루트의 .env, .env..

✅ route.ts(라우트 API) vs. Server Actions 비교라우트 API (route.ts) 서버 액션 (use server)방식HTTP 요청(예: fetch, axios)을 통해 API 엔드포인트를 호출서버에서 직접 함수를 호출하여 실행사용법app/api/.../route.ts에 작성 (GET, POST, PUT, DELETE 가능)use server 키워드를 사용하여 서버 함수 실행보안API 호출을 통한 요청이므로 CSRF 방어 필요클라이언트에서 직접 실행할 수 없어 CSRF 공격 걱정 없음유연성외부 API와의 통합이 용이클라이언트와의 직접적인 상호작용에 적합상태 관리fetch 요청으로 데이터를 가져와야 함클라이언트 컴포넌트에서 바로 실행 가능최적화캐싱 및 CDN을 활용할 수 있음페이지..