https://github.com/shivxmr/iphone

Recreated the Apple iPhone 15 Pro website, combining GSAP animations and Three.js 3D effects.
https://github.com/shivxmr/iphone

gsap reactjs tailwindcss threejs vite

Last synced: about 1 month ago
JSON representation

Recreated the Apple iPhone 15 Pro website, combining GSAP animations and Three.js 3D effects.

• Host: GitHub
• URL: https://github.com/shivxmr/iphone
• Owner: shivxmr
• Created: 2024-07-13T08:46:45.000Z (7 months ago)
• Default Branch: main
• Last Pushed: 2024-07-13T12:31:28.000Z (7 months ago)
• Last Synced: 2024-11-19T21:43:01.589Z (3 months ago)
• Topics: gsap, reactjs, tailwindcss, threejs, vite
• Language: JavaScript
• Homepage: https://shivxmr-iphone.vercel.app/
• Size: 37.2 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


  


    

    

    

    

  


  
Iphone 15 Website




This is a clone of Apple's iPhone 15 Pro website using React.js and TailwindCSS. It highlights the effective use of GSAP (Greensock Animations) and Three.js for displaying iPhone 15 Pro models in various colors and shapes.

## ⚙️ Tech Stack

- React.js

- Three.js

- React Three Fiber

- React Three Drei

- GSAP (Greensock)

- Vite

- Tailwind CSS

## 🤸 Quick Start

Follow these steps to set up the project locally on your machine.

**Prerequisites**

Make sure you have the following installed on your machine:

- [Git](https://git-scm.com/)

- [Node.js](https://nodejs.org/en)

- [npm](https://www.npmjs.com/) (Node Package Manager)

**Installation**

Install the project dependencies using npm:

```bash

npm install

```

**Running the Project**

```bash

npm run dev

```

Open [http://localhost:5173](http://localhost:5173) in your browser to view the project.