IMPORTANT:

Learn CSS Today Course: https://courses.webdevsimplified.com/learn-css-today?utm_medium=video-description-no-mention&utm_source=youtube&utm_campaign=css-smash-like
1 Year Free Hosting: https://www.atlantic.net/webdevsimplified
Use code KYLE for an additional $50

I keep hearing that I should smash the like button on every video I watch, but the button never actually gets destroyed when I smash it. I decided to change that by making use of CSS, JavaScript, and SVG to create a like button which you can actually smash into pieces. This is a fun video focused on how you can use SVG to do some really unique things in CSS that are not possible with normal HTML and CSS.


Materials/References:

Original SVG Code: https://raw.githubusercontent.com/WebDevSimplified/Smash-The-Like-Button/master/original-like-button.svg
GitHub Code: https://github.com/WebDevSimplified/Smash-The-Like-Button
CodePen Code: https://codepen.io/WebDevSimplified/pen/RwPLOPE


🧠 Concepts Covered:

- How to use SVG with CSS
- Why SVG is best for unique animations and icons
- How to use the JavaScript transitionend event


Find Me Here:

My Blog: https://blog.webdevsimplified.com
My Courses: https://courses.webdevsimplified.com
Patreon: https://www.patreon.com/WebDevSimplified
Twitter: https://twitter.com/DevSimplified
Discord: https://discord.gg/7StTjnR
GitHub: https://github.com/WebDevSimplified
CodePen: https://codepen.io/WebDevSimplified


#SmashTheLikeButton #WDS #SVG