Adding your own transition classes
If your application is rich in animations and you would like to reuse your CSS classes in other projects by mixing and matching them, this is the recipe for you. You will also understand an important technique for performant animations, called FLIP (First Last Invert Play). While the latter technique is normally triggered automatically by Vue, we will implement it manually to get a better understanding of how it works.
Getting ready
To complete this recipe, you should understand how CSS animations and transitions work. This is out of the scope of this book, but you can find a good primer at http://css3.bradshawenterprises.com/. This website is also great because it will explain when you can use animations and transitions.
How to do it...
We will build an interface for a taxi company (similar to the preceding recipe) that will enable users to call a taxi at the click of a button and will provide a nice animated feedback when the taxi is called.
To code the button...