유튜브블로그Top 10
내 프로필

데브허브 안내
소개업데이트 소식

데브허브 커뮤니티

Next.js AI SDK Tutorial - 2 - Project Setup

Codevolution

2025. 8. 5.

0

#frontend
#ai
  • Next.js 앱을 최신 버전으로 생성하고, 프로젝트 이름을 'next-ai-app'으로 설정합니다. 🚀
  • TypeScript, ESLint, Tailwind CSS, Source directory, App router를 사용하고 Turbo pack과 Customize import alias는 사용하지 않습니다. ✅
  • AI SDK의 필요한 모듈(AI, OpenAI, React, Zod)을 npm을 사용하여 설치합니다. 📦
  • OpenAI API 키를 platform.openai.com에서 생성하고, 결제 정보를 추가합니다. 🔑
  • 생성한 API 키를 .env.local 파일에 안전하게 저장하고, git에 커밋하지 않도록 주의합니다. 🛡️
  • npm run dev 명령어로 개발 서버를 실행하고, http://localhost:3000에서 Next.js 환영 페이지를 확인하여 설정이 완료되었는지 테스트합니다. 🧪
  • 다음 단계로 OpenAI에 메시지를 보내고 응답을 표시하는 첫 번째 코드를 작성합니다. ✍️

Recommanded Videos