E-commerce Shopping Website

Overview

This project is a dynamic e-commerce marketplace, initially built as a UI clone during a hackathon, now enhanced with backend functionalities. It leverages modern web technologies to provide a fully interactive shopping experience.

Live URL: Hekto E-commerce Shopping Website

Features

• Responsive Design: Fully optimized for desktop and mobile.
• Next.js: Server-side rendering and routing for a seamless experience.
• Tailwind CSS: Modern utility-first CSS framework for styling.
• Shadcn/ui: Component library for prebuilt, customizable components.
• Dynamic Product Display: Real-time product updates using Sanity CMS.
• Cart & Wishlist: Add, remove, and manage items dynamically.
• Buy Now & Share: Seamless purchasing and social sharing options.
• Search Functionality: Advanced product filtering and searching.
• Sanity CMS: Headless CMS used as the backend for managing products.
• Best Practices: Clean code structure and reusable components.
• Stripe Integration: Secure payment processing for transactions.
• Clerk : Used Clerk for auth and user management.

Technologies Used

• Next.js
• Tailwind CSS
• Shadcn/ui
• Sanity CMS (Headless CMS for dynamic backend)
• Vercel: Deployed for fast and reliable hosting.
• formspree: For form handling and submissions.
• Stripe: Payment processing for secure transactions.
• Clerk: For Auth and user management.
• Other npm Packages

Installation

1. Clone the repository:

   git clone https://github.com/MuhammedSuhaib/Hackathon-2-Q-2-Ui-clone

2. Navigate to the project directory:

   cd repository-name

3. Install dependencies:

   npm install

4. Run the development server:

   npm run dev

5. Open your browser and visit http://localhost:3000 to view the app.

Usage

• Browse and search for products dynamically.
• Add products to the cart or wishlist.
• Share product details with others.
• Buy products using a seamless checkout process.
• Admins can manage product listings via Sanity CMS.

Challenges & Learning

This project helped enhance my skills in:

• Implementing a headless CMS (Sanity) for dynamic content management.
• Creating a fully functional cart and wishlist system.
• Developing advanced search and filtering features.
• Building a seamless and scalable e-commerce experience.