CHIZE is a premium perfume e-commerce platform built for modern fragrance lovers. We believe that buying your favorite scents should be rewarding — not just occasionally, but regularly. That's why every purchase on CHIZE is designed to feel valuable. Customers buy luxury scents and earn Stellar-based crypto rewards with every successful order.
This project represents a production-ready application featuring a polished storefront, a daily-use perfume catalog, a seamless cart/checkout flow, and an innovative Web3 reward layer that turns everyday purchases into long-term value.
- 🛍️ Curated Catalog: Browse a stunning perfume catalog with detailed product insights, pricing, and potential reward amounts.
- 🛒 Persistent Cart: Seamless shopping experience with cart state managed via browser
localStorage. - 💳 Flexible Checkout Options:
- Paystack: Primary NGN payment rail for fast fiat transactions.
- Crypto & International Gateways: Extensible architecture supporting international and crypto checkouts.
- 🎁 Web3 Rewards: A gamified "reward reveal" page delivering Stellar-based assets upon payment success.
- 📊 Admin Dashboard: A built-in single-owner dashboard to manage orders, track inventory, and configure reward distribution rules.
- Framework: Next.js (App Router)
- Language: TypeScript
- Styling: Tailwind CSS + shadcn/ui
- Payments: Paystack
- Blockchain: Stellar Network (via
@stellar/stellar-sdk) - Deployment: Vercel
Make sure you have Node.js (v18+) and npm installed.
-
Clone the repository:
git clone https://github.com/Gozirimdev/chize.git cd chize -
Install dependencies:
npm install
-
Configure Environment Variables: Copy the example environment file and fill in your credentials.
cp .env.example .env.local
-
Start the development server:
npm run dev
-
Open http://localhost:3000 in your browser to view the storefront.
/— Storefront: The main landing page and product catalog./checkout— Checkout: Cart summary, shipping details, and payment selection./reward/[orderId]— Reward Reveal: Interactive page where users unlock their Stellar rewards./owner— Admin Dashboard: Secure owner area for managing the platform.
The platform includes a robust Stellar reward flow that processes transactions securely:
- Transaction Builder:
src/lib/stellar.tsconstructs Stellar payment transactions when the required environment variables are present. - Reward Endpoint:
src/app/api/rewards/stellar/route.tshandles the delivery of the cryptographic award to the user's wallet. - Fallback Mode: If Stellar credentials are not configured, the application safely falls back to a mock mode, returning a preview payload without attempting live blockchain transactions.
To enable live rewards, you must configure the following in your .env.local:
STELLAR_ASSET_CODESTELLAR_ISSUER_PUBLIC_KEYSTELLAR_DISTRIBUTION_SECRET
Optional but recommended:
STELLAR_HORIZON_URLSTELLAR_NETWORK_PASSPHRASE
The application is optimized for deployment on Vercel.
- Push your code to your GitHub repository.
- Import the project into Vercel.
- Ensure all environment variables (from your
.env.local) are added to your Vercel project settings. - Deploy!
Required for Live Mode:
NEXT_PUBLIC_APP_URLNEXT_PUBLIC_PAYSTACK_PUBLIC_KEYPAYSTACK_SECRET_KEYSTELLAR_ASSET_CODESTELLAR_ISSUER_PUBLIC_KEYSTELLAR_DISTRIBUTION_SECRET
Optional Integrations:
NEXT_PUBLIC_SUPABASE_URLNEXT_PUBLIC_SUPABASE_ANON_KEYSUPABASE_SERVICE_ROLE_KEYCOINBASE_COMMERCE_API_KEYTRIPLE_A_API_KEYFLUTTERWAVE_SECRET_KEY
Ensure your code meets the quality standards before pushing:
# Run ESLint to check for code issues
npm run lint
# Build the project locally to catch compilation errors
npm run buildWe welcome contributions! Please see our CONTRIBUTING.md for guidelines on how to get started, report bugs, or submit pull requests.