Full Stack Challenge | AI Image Editor with Nextjs & ImageKit
- 이 비디오는 기존 코드베이스에 기능을 추가하는 실제 회사 업무 환경을 모방한 풀 스택 AI 이미지 편집기 챌린지를 소개합니다. 🏢
- Next.js와 ImageKit을 사용하여 AI 이미지 편집기를 구축하는 과정을 안내하며, 초보자보다는 어느 정도 경험이 있는 개발자를 대상으로 합니다. 🧑💻
- 제공된 코드베이스를 기반으로 새로운 기능을 구현하고 기존 기능을 개선하는 것이 목표입니다. 🛠️
- 참가자들은 ImageKit을 활용하여 이미지 변환, 크기 조정, 필터 적용 등의 기능을 구현할 수 있습니다. ✨
- 데이터베이스로는 Neon을 사용하며, 이미지 정보와 변환 설정을 저장합니다. 💾
- 챌린지 참여를 독려하기 위해 추첨을 통해 'I write code' 티셔츠를 증정합니다. 🎁
- 코드베이스 구조, 환경 설정, 패키지 의존성, 데이터베이스 스키마 등을 설명하는 KT(Knowledge Transfer) 세션을 제공합니다. 📚
- 참가자들은 주어진 정보를 바탕으로 스스로 코드를 이해하고 문제를 해결해야 합니다. 🤔
- ImageKit 문서와 예제를 참고하여 이미지 처리 기능을 구현할 수 있습니다. 📖
- 코드베이스는 Next.js 라우트, API 엔드포인트, 컴포넌트 등으로 구성되어 있으며, TypeScript로 작성되었습니다. ⌨️
- UI는 Radix UI를 사용하며, drag and drop 기능을 위해 react-dropzone 라이브러리를 사용합니다. 🎨
- 코드 편집 시 회사의 코딩 규칙과 린팅 규칙을 준수해야 합니다. ⚠️
- 코드베이스를 이해하고 새로운 기능을 추가하는 데 AI의 도움을 받을 수 있지만, 회사 정책에 따라 코드 공유에 주의해야 합니다. 🤖
- 최종 목표는 제공된 데모 앱과 유사한 기능을 구현하는 것입니다. 🎯