Welcome to the Nike Website project! This project is a showcase of modern web development techniques, utilizing Vite React, Tailwind CSS, Framer Motion, and GSAP for smooth animations and interactions.
- Vite-React: Utilizes Vite for fast, modern React development.
- Tailwind CSS: Employs Tailwind CSS for rapid UI development and styling.
- Framer Motion: Implements Framer Motion for fluid animations and interactive elements.
- GSAP: Integrates GSAP for creating custom animations, including a unique following cursor effect.
- Preloader: Features a sleek preloader animation built with Framer Motion to enhance user experience.
- Clone the repository:
git clone https://github.com/BurningHat20/Nike-Clone.git- Navigate into the project directory:
cd Nike-Clone- Install dependencies:
npm install- Start the development server:
npm run dev- Open your browser and visit
http://localhost:5173to view the website.
Feel free to explore the codebase and customize it to your liking! Here are a few pointers to get started:
- Animations: Discover how Framer Motion and GSAP are utilized for animating various elements throughout the website.
- Cursor Effect: Dive into the GSAP implementation for the custom following cursor effect, adding a unique touch to user interactions.
- Styling: Leverage Tailwind CSS classes and utility-first approach for styling components and layouts efficiently.
- Preloader: Examine the preloader animation created with Framer Motion, enhancing the loading experience for users.
Contributions are welcome! If you'd like to contribute to this project, please follow these steps:
- Fork the repository.
- Create your feature branch:
git checkout -b feature/new-feature. - Commit your changes:
git commit -m 'Add some feature'. - Push to the branch:
git push origin feature/new-feature. - Submit a pull request.
This project is licensed under the MIT License.
- Vite: Fast, opinionated web dev build tool that serves your code via native ES Module imports during development.
- Tailwind CSS: A utility-first CSS framework for rapid UI development.
- Framer Motion: A production-ready motion library for React providing a simple interface for creating animations.
- GSAP: A JavaScript library for creating high-performance, zero dependencies, cross-browser animations.
Connect with us on social media: