This workshop with Josh Comeau covers a bunch of tools and techniques that can be used to create rich, delightful interactions and animations with React. We’ll create Facebook-style “Text Delight” animations from scratch, dig into Twitter-style micro-interactions, and create some really over-the-top animations using Canvas and SVG. There are a lot of powerful tools at our disposal, from modern browser APIs to powerful libraries like React Spring and Pose, and we’ll learn how to leverage them to do complex things in record time.

Requires beginner-to-intermediate React skills (should feel comfortable with props/state, lifecycle methods, and refs)

Covered subjects:

• Thoughtful application of animation and interaction
• CSS transitions and keyframe animations
• JS animation with React hooks
• React libraries: React Spring and popmotion Pose
• Particle effects
• HTML Canvas animation
• SVG animation (Bezier curves!)
• CSS clip-path animation