미리보기

• 패션비즈

  
  
  2024. 02 - 2024.04

  
  패션 비즈니스 사이트
  
  - Next.js 14를 이용하여 프로젝트 전체 페이지 개발

  
  - Styled Components를 사용하여 완벽한 반응형 디자인으로 개발
  - React hook form을 활용한 회원가입 및 소셜 로그인 기능 개발
  - GraphQL과의 효율적인 통신을 위하여 Apollo Client를 활용한 데이터 페칭 및 상태 관리 경험
  - Google 번역 API를 활용하여 해외 사용자 대상의 웹사이트 다국어 지원 기능을 구현
  - Framer motion을 활용한 이벤트 캘린더 개발

  - Metatag와 서버 컴포넌트를 활용한 SEO 최적화

다국어 지원, AI 기반 이미지 편집 사이트 | Github | 배포 링크

• 로그인 및 회원가입:

  • Clerk를 사용하여 소셜 로그인 구현 및 인증 과정 처리,

  • Webhooks를 이용하여 MongoDB에 유저 정보 저장

• 언어 번역 기능: Google API를 활용하여 언어 번역 기능 구현

• 이미지 편집 기능: Cloudinary AI를 활용한 이미지 편집(배경 및 객체 제거, 종횡비 및 객체 색 변경) 기능 구현

• 결제 기능:

  • Stripe API를 사용하여 결제 기능 구현

  • Webhooks를 사용하여 데이터베이스에 있는 유저 정보에 결제 정보 업데이트

• 프로젝트 라우트 기능: Clerk와 Middleware를 사용하여 로그인 여부에 따라 페이지 접근 권한 설정

E-commerce 웹 애플리케이션 | Github | 배포 링크

• 상품 결제 기능: Stripe API를 활용하여 결제 시스템 구축 및 결제 기능 구현

• Role-Based-Access Control 기능: NextAuth.js와 Next.js의 middleware를 활용하여 사용자의 권한에 따라 페이지 접근을 제어함

• 로그인/회원가입 기능: 소셜 로그인 및 회원가입을 위해 Next.js의 NextAuth.js를 이용하여 인증 과정 처리

• 상품 좋아요 및 리뷰 기능: Supabase, Prisma, Next.js의 API 라우트를 활용하여 상품에 대한 좋아요 및 리뷰 CRUD 기능 구현