✨ GSAP Crash Course Workshop ✨

A beginner-friendly crash course repo to learn GSAP animations with React. Explore animations like to, from, fromTo, stagger, timelines, and text animations step by step!

---

📋 Table of Contents

1. ✨ Introduction
2. ⚙️ Tech Stack
3. 🚀 Quick Start
4. 🔗 Contacts
5. ⭐️ Show Your Support

---

✨ Introduction

This project is a GSAP Workshop showcasing a variety of primary animations.
GSAP (GreenSock Animation Platform) is one of the most powerful JavaScript animation libraries, used widely to create fluid, performant, and engaging motion experiences across the web.

By working through this crash course, you’ll learn:

• The difference between gsap.to, gsap.from, and gsap.fromTo
• How to chain animations with timeline
• Staggering elements for cool effects
• Text reveals and smooth transitions

---

⚙️ Tech Stack

• React is a popular JavaScript library for building user interfaces, particularly single-page applications where data changes over time. React's component-based architecture allows developers to create reusable UI components, making development more efficient and the codebase easier to maintain.

• GSAP (GreenSock Animation Platform) is a powerful JavaScript library for creating high-performance animations. It excels in animating HTML elements with smoothness and precision, making it ideal for enhancing user interfaces and web experiences. GSAP's robust API allows developers to create complex animations easily, leveraging timelines and plugins for advanced control and customization. Its efficient rendering engine ensures animations run smoothly across different browsers and devices, providing a seamless user experience.

• Vite is a modern frontend build tool known for fast ES Module imports, efficient bundling, and quick development server startup times. It supports frameworks like Vue.js and React, optimizing workflow and performance compared to traditional bundlers.

---

🚀 Quick Start

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

✅ Prerequisites

Make sure you have installed:

• Git
• Node.js
• npm (Node Package Manager)

📂 Clone the Repository

git clone https://github.com/Itssanthoshhere/GSAP-Crash-Course.git
cd GSAP-Crash-Course

📦 Install Dependencies

Let's install the project dependencies, from your terminal, run:

npm install

▶️ Run the Project

Installation will take a minute or two, but once that's done, you should be able to run the following command:

npm run dev

Open http://localhost:5173 in your browser to view the project.

---

🔗 Contacts

Let’s connect:

• GitHub: Itssanthoshhere
• LinkedIn: Santhosh VS

---

⭐️ Show Your Support

If this repo helped you, please give it a ⭐ and share it with others!