Last year, I wasn't able to make something theorically simple with CSS3 animations and ReactJS. Last night, I made it work with VueJS (and CSS3 animations yeah). Feels. So. Fuckin. Good.

Some visual representation of what you did!?

@litesam126 not yet pushed on GitHub, but imagine a Single Page App with four pages displaying different things, and with the following rules:
- on "landing" page, you can go to "shop", "biography" and "contact"
- on both "biography" and "shop", you can reach "landing" and "contact" but not each other
- On contact, you can only go back to the previous page
You have a sliding transition on each page :
- landing to shop : left (right when getting back to landing)
- landing to bio : right (left to getting back to landing)
- any page to contact : page slides up
- contact to any page : page slides down

Sounds easy (and kinda is) but fuck did I struggle to set this up with React. Took only 40 mn (and more experience) with VueJS

@Drillan767 You could've used styled-components and be done with the app within 30mins, you can have all the things within a snap of a finger.

For example:

/* Without styled-components */
<button className="btn btn--primary">primary</button
<button className="btn btn--disabled">disabled</button>
<button className="btn">normal</button>

/* With styled-components *?
<Button primary>primary</Button>
<Button disabled>disabled</Button>
<Button>normal</Button>
/* all those "primary", and "disabled" will be given to you as a prop in a place where you created your prop */

*Boom* that is simple, right?

For more clearer view just see the below image.