I’ll be honest: I’m easily gripped by animations and purposeful motion on the Web, so much so that I wrote a whole article on it. However, I’m also a big fan of the Vue.js framework, and I’ve been building apps with it for three years.
All of these is why it was a delightful surprise when I realized that I could take advantage of ONLY the Transition API in Vue.js while leveraging my decent CSS skills to animate a component’s enter and exit animations in such a fluid manner.
How fluid? You might ask.
In this article, we’ll dive into a straightforward movie app with built-in filtering features. By the end, you should have a solid understanding of the <Transition>
and <TransitionGroup>
components in Vue.js and how they seamlessly handle enter and exit animations within Vue.js.
This article was originally published on FreeCodeCamp. To read it in full, click here.