🍎 Apple Website Clone – React + Vite + Tailwind CSS

📌 Project Overview

This project is a static UI clone of the Apple India website, built using React JSX, Vite, and Tailwind CSS. It focuses on replicating the visual structure and layout of the Apple homepage using a component-based architecture, without implementing dynamic functionality or backend integration.

🎯 Objective

To recreate the Apple homepage with pixel-perfect accuracy using modern frontend tools and best practices in component design.

🖼️ Screenshot Preview

🛠️ Tech Stack

• React (with Vite for fast development)
• Tailwind CSS (for utility-first styling)
• Component-based architecture with JSX

🧩 Components Implemented

• Nav Component: A responsive navigation bar mimicking Apple’s sleek top menu.
• Hero Component: A visually rich hero section showcasing featured products.
• Section Component: Multiple reusable sections to mirror Apple’s homepage layout.
• Button Component: Consistent, reusable buttons styled with Tailwind.
• Footer Component: A detailed footer replicating Apple’s site structure.

🎨 Styling Approach

• Tailwind CSS is used for rapid and consistent styling across components.
• Responsive design principles are applied to ensure visual fidelity across devices.

📦 Project Setup

• Initialized using Vite for fast builds and hot module replacement.
• Folder structure organized by components for scalability and maintainability.

✅ Outcome

• A static, visually accurate clone of the Apple India homepage, ideal for showcasing frontend skills, practicing UI replication, and learning component-based design.
• Apple-Clone [WebPage] - https://lokistark.github.io/Apple-Clone/
• Deployed in Versel - https://apple-clonepage.vercel.app/