#  ShoppingOnline

An online shopping platform built with **Next.js**, **TypeScript**, and **Firebase**, integrating **Stripe** for secure payments. This project focuses on responsive design, user-friendly interactions, and a smooth checkout experience.

##  Features

-  **Authentication**: Sign in, sign up, and guest checkout options.
-  **Stripe Integration**: Secure payment gateway with conditional logic (orders under R500 incur an additional R100 fee).
-  **Responsive UI**: Optimized for all devices using Tailwind CSS.
-  **Next.js App Router**: Modern routing with server-side rendering and hydration handling.
-  **Web Push Notifications**: Stay updated with order status and promotions.
-  **Hydration Debugging**: Actively resolving hydration mismatches for seamless SSR.

##  Project Structure

ShoppingOnline/ ├── .vscode/ # Editor settings ├── public/ # Static assets and Web Push certificates ├── src/ │ └── app/ # Main application logic (entry: page.tsx) ├── .gitignore ├── components.json ├── next.config.ts ├── package.json ├── postcss.config.mjs ├── tailwind.config.ts ├── tsconfig.json └── README.md

##  Setup & Installation

1. Clone the repository:
   ```bash
   git clone https://github.com/Lintshiwe/ShoppingOnline.git
   cd ShoppingOnline

2. Install dependencies:

   npm install

3. Configure environment variables for Firebase and Stripe.

4. Run the development server:

   npm run dev

Notes

• Ensure Stripe is active and properly configured before testing payments.
• For orders below R500, an additional R100 is automatically added to the total.

Screenshots

Coming soon...

License

This project is private and not currently licensed for public use.

---

Built by Lintshiwe

Want to add badges, deployment instructions, or a live demo link next?