https://github.com/nuhptr/gsap-workshop
✅🚀 Learn to using basic GSAP animation with React and Tailwind
https://github.com/nuhptr/gsap-workshop
gsap react tailwindcss
Last synced: about 1 month ago
JSON representation
✅🚀 Learn to using basic GSAP animation with React and Tailwind
- Host: GitHub
- URL: https://github.com/nuhptr/gsap-workshop
- Owner: nuhptr
- Created: 2024-03-16T07:12:53.000Z (about 1 year ago)
- Default Branch: master
- Last Pushed: 2024-04-26T14:59:54.000Z (12 months ago)
- Last Synced: 2025-01-21T08:44:39.405Z (3 months ago)
- Topics: gsap, react, tailwindcss
- Language: JavaScript
- Homepage: https://gsap-workshop.vercel.app
- Size: 105 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# GSAP Workshop (30.00)
## Dependencies
- [tailwindcss](https://tailwindcss.com/) - pnpm add -D tailwindcss, postcss, autoprefixer
- [gsap](https://greensock.com/gsap/) - pnpm add gsap
- [@gsap/react](https://greensock.com/react/) - pnpm add @gsap/react
## Introduction
This is a workshop to learn the basics of GSAP (GreenSock Animation Platform). GSAP is a JavaScript library that allows you to create high-performance animations that work in every major browser. It is a powerful tool that can be used to create complex animations with a simple and easy-to-use API.
## Prerequisites
Before you start this workshop, you should have a basic understanding of HTML, CSS, and JavaScript. You should also have a code editor installed on your computer, such as Visual Studio Code or Sublime Text.
## What you will learn
In this workshop, you will learn the following:
- How to include GSAP in your project
- How to create simple animations with GSAP
- How to create complex animations with GSAP
- How to use GSAP plugins
- How to use GSAP with other libraries and frameworks
- How to optimize your animations for performance
- How to debug and troubleshoot GSAP animations