Apple Website

A visually rich and interactive Apple product showcase built with React, Vite, TailwindCSS, GSAP, and Three.js.

Preview

Technologies Used

• TailwindCSS
• GSAP
• Threejs

Project Structure

applewebsite/
├── public/
│   ├── index.html
├── src/
│   ├── assets/
│   │   ├── images/
│   │   ├── videos/
│   ├── components/
│   │   ├── Footer.jsx
│   │   ├── Hero.jsx
│   │   ├── Highlights.jsx
│   │   ├── HowItWorks.jsx
│   │   ├── Loader.jsx
│   │   ├── Model.jsx
│   │   ├── ModelView.jsx
│   │   ├── Navbar.jsx
│   │   ├── VideoCarousel.jsx
│   ├── constants/
│   │   ├── index.js
│   ├── utils/
│   │   ├── animations.js
│   │   ├── index.js
│   ├── App.jsx
│   ├── index.css
│   ├── main.jsx
├── package.json
├── vite.config.js

Installation

To set up and run this project locally, follow these steps:

Step 1: Clone the repository

git clone https://github.com/Sudhanshu-Ambastha/Apple-Website.git

cd applewebsite

Step 2: Install dependencies

npm install

Step 3: Install additional packages

npm install gsap @gsap/react

npm install three @react-three/drei @react-three/fiber

Running the Project

After following the installation steps, you can run the project using the command npm run dev and open it in your browser to see the Apple website in action.

npm run dev