> 웹 프론트엔드 > JS 튜토리얼 > Next.js로 전자상거래 구축

Next.js로 전자상거래 구축

Susan Sarandon
풀어 주다: 2024-10-19 20:35:30
원래의
812명이 탐색했습니다.

Building eCommerce with Next.js

저는 개발자로서 Shopify 템플릿에 얽매이고 싶지 않지만 매장 API를 맞춤형 앱과 함께 사용하고 싶지도 않습니다. 나는 내가 원하는 방식으로 조정할 수 있는 완전히 사용자 정의 가능한 솔루션을 갖고 싶습니다. ui/ux, db, 백엔드, api, 인증, devops 등에서. 그래서 저는 React, Next.js, MongoDB 및 Stripe를 사용하여 완전히 사용자 정의 가능한 결제 솔루션을 구축했습니다.

여기에서 데모 링크를 찾을 수 있습니다: https://wexcommerce.dynv6.net:8002

그리고 소스 코드는 여기: https://github.com/aelassas/wexcommerce

다음 솔루션을 사용하면 최소 1GB RAM이 있는 Docker 드롭릿에서 호스팅하여 매우 저렴한 비용으로 Stripe 결제 게이트웨이를 사용하여 SEO에 최적화된 완전히 사용자 정의 가능한 전자 상거래 웹사이트를 구축할 수 있습니다.

이 솔루션은 프런트엔드와 관리자 대시보드로 구성됩니다. 프런트엔드에서 고객은 원하는 제품을 검색하고 장바구니에 추가하고 결제할 수 있습니다. 고객은 Google, Facebook, Apple 또는 이메일로 가입할 수 있으며 신용 카드, Cash On Delivery, 전신 송금, PayPal, Google Pay, Apple Pay, Link 또는 기타 Stripe 결제 방법으로 결제할 수 있습니다. 로그인하면 구매 내역에 액세스하고 주문을 따를 수 있습니다. 관리자 대시보드에서 관리자는 주문, 결제, 제품, 카테고리, 고객 및 기본 언어, 통화, 배송, 배송 및 허용되는 결제 방법과 같은 일반 설정을 관리할 수 있습니다.

TypeScript의 수많은 장점 때문에 주요 디자인 결정이 TypeScript를 사용하기로 결정되었습니다. TypeScript는 강력한 타이핑, 도구 및 통합을 제공하여 디버그 및 테스트가 쉬운 고품질, 확장성, 읽기 쉽고 유지 관리가 쉬운 코드를 제공합니다.

특징

  • 재고관리
  • 주문관리
  • 결제관리
  • 고객관리
  • 다양한 결제 옵션(신용카드, 현금결제, 전신환 송금, PayPal, Google Pay, Apple Pay, 링크)
  • 스트라이프 결제 게이트웨이 운영
  • 다양한 배송 옵션(택배, 매장 출금)
  • 다국어 지원(영어, 프랑스어)
  • 다양한 로그인 옵션(Google, Facebook, Apple, 이메일)
  • 반응형 백엔드와 프런트엔드

자원

  1. 개요
  2. 설치(자체 호스팅)
  3. 설치 중(도커)
    1. 도커 이미지
    2. SSL
  4. 스트라이프 설정
  5. 소스에서 실행
  6. 데모 데이터베이스
    1. Windows, Linux 및 macOS
    2. 도커
  7. 언어 및 통화 변경
  8. 새 언어 추가
  9. 로그

어떤 의견이라도 보내주시면 감사하겠습니다.

위 내용은 Next.js로 전자상거래 구축의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:dev.to
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿