Animate when scrolled into view
Triggering animations on scroll with Framer Motion
Learn how to use whileInView in Framer Motion for animation in React
This is a space where we can learn about JavaScript, animate React components and, navigate the ever-changing world of the web.
I'm trying something a bit different.
I often stumble across some excellent tools, pacakges and services but I hardly ever write about them unless I want to create a tuorial or have a strong opinion on it. But what about all those things I end up using and having trouble fidning again months later?
This is why I'm creating a new type of writing on my blog, scorecards. They're a way of giving you a brief introduction or quick refresher on a package, service or tool. I hope they'll help me out when I'm wracking my brain for that one NPM package I used last year! I hope scorecards will help others out too, they contain links to useful resources, examples of usage, when you might want to use it and some other tidbits.
I like to create little tools and have fun building things. This is a way to showcase them without going into too much detail that a full article might warrant.
Learn how to use whileInView in Framer Motion for animation in React
I'm saying goodbye to Gatsby and moving to Next.js, this is why I made the leap
I started out on Medium but here's why I think it's better to self-host your content instead
That Raspberry Pi sitting in your desk draw still has some life in it. Why not put it to use with Elixir and Nerves!
Working with a single web app that handles routing is pretty straightforward, but what about multiple web apps? Let's try Traefik to simplify it.
Heroicons are a great set of icons that are easy to integrate without the hassle.
Tailwind CSS might just be worth your time, especially in teams and in agencies.
A simple interaction where the user can click on an image on the right side and it will expand over to the left, becoming the primary image. This technique could be used as an image gallery or a product chooser for an ecommerce site.
There's plenty more articles to choose from, 67 in fact.
So why not check them out!
Watch my free tutorial series on how to get started coding in Framer.
We'll use the popular design and prototyping Framer Web to craft beautiful user interfaces but we'll make them more rich and interactive with code. I'll take you from your first code component in React, smooth animations with Framer Motion and handoff into a code project.
Create your first code component from scratch in Framer Web. This tutorial will…
Use property controls to make your code components in Framer Web more flexible.…
Learn how to turn design elements and code components in Framer Web into interac…
Framer Web excels at providing easy ways to animate components. We’ll create tra…
Create complex interactions by leveraging the Data instance in the Framer API. D…
Your prototype in Framer Web can make the leap into a codebase. Web developers c…