CarShowcase Website Project

This project is a 3D-based car showcase website built using three.js and GSAP, designed to highlight Porsche cars with engaging camera animations and smooth interactions.

File Structure

assets/ .gitignore README.md angles.js car-showcase.css carShowcase.js carShowcasegui.js carshowcase.html carshowcaseGsapAnimations.js gsap-animation.js hsm.js index.html interactions.js loading.js loadingbar.css package-lock.json package.json style.css

assets/

This folder contains the 3D models of the Porsche cars used throughout the website.

angles.js

This file contains the JavaScript code for the animations and functionalities on the landing page.

car-showcase.css & style.css

These files define the styling for the car showcase page and other general styles.

carShowcase.js

This is the main JavaScript file for the car showcase page, handling the primary functionalities and initialization.

carShowcasegui.js

This file manages the GUI (Graphical User Interface) elements for the car showcase, such as controls and settings.

carshowcase.html

This is the HTML file for the car showcase page.

carshowcaseGsapAnimations.js

This file contains all GSAP-based animations specific to the car showcase page, providing smooth transitions and interactions.

gsap-animation.js

A general file containing additional GSAP animations used in landing page

hsm.js

This file includes the JavaScript code for the hamburger menu, ensuring smooth opening and closing of the navigation menu.

index.html

The main landing page of the website.

interactions.js

This file contains the JavaScript code for handling user interactions, such as click actions, and manages all car-related information displayed on the site.

loading.js & loadingbar.css

These files handle the loading bar that appears when the website is loading, ensuring a smooth user experience from the start.

package-lock.json & package.json

These files manage the project's dependencies, ensuring consistent installations and builds.

Installation and Usage

1. Clone the repository to your local machine.
2. Install dependencies using npm install.
3. run command npx vite