수소 데모 스토어

수소 템플릿: 데모 스토어

수소는 헤드리스 상거래를 위한 Shopify의 스택입니다. Hydrogen은 Shopify의 풀 스택 웹 프레임워크인 Remix와 딱 들어맞도록 설계되었습니다. 이 템플릿에는 Hydrogen을 시작하는 데 필요한 모든 기능을 갖춘 구성 요소, 쿼리 및 도구 설정이 포함되어 있습니다. Hydrogen.shop에 배치되어 있습니다.

Hydrogen 문서를 확인하세요. Remix에 익숙해지기

무엇이 포함되어 있나요?

• 리믹스
• 수소
• 산소
• Shopify CLI
• ESLint
• 더 예뻐요
• GraphQL 생성기
• TypeScript 및 JavaScript 버전
• Tailwind CSS(PostCSS를 통해)
• 모든 기능을 갖춘 구성 요소 및 경로 설정

시작하기

요구사항:

• Node.js 버전 18.0.0 이상

npm create @shopify/hydrogen@latest -- --template demo-store

매장 도메인과 Storefront API 토큰으로 .env 업데이트하는 것을 잊지 마세요!

생산을 위한 건물

npm run build

지역 발전

npm run dev

Customer Account API 사용을 위한 설정( /account 섹션)

ngrok를 사용하여 공개 도메인 설정

1. ngrok 계정을 설정하고 영구 도메인(예: https://.app )을 추가하세요.
2. 터미널에서 사용할 ngrok CLI를 설치합니다.
3. ngrok http --domain=.app 3000 사용하여 ngrok 시작

고객 계정 API 설정에 공개 도메인 포함

1. Shopify 관리자로 이동 => Hydrogen 또는 Headless 앱/채널 => 고객 계정 API => 애플리케이션 설정
2. https://.app/account/authorize 포함하도록 Callback URI(s)
3. 공개 도메인 https://.app 포함하거나 공백으로 유지하도록 Javascript origin(s)
4. 공개 도메인 https://.app 포함하거나 비워두도록 Logout URI 편집하세요.