8 Learning Tools For Front-End Developers 🧵

1. FlexBox Adventure
FlexBox Adventure is an interactive adventure game allowing you to use your flexbox skills to assist the game character to solve 24 challenges.
https://codingfantasy.com/games/flexboxadventure

2. Knights Of The Flexbox Table
Knights of the Flexbox Table is another well-designed interactive course to help you learn the different aspects of the flexbox specification. This one includes 18 “dungeons” to teach you flexbox.
https://knightsoftheflexboxtable.com/

3. Flexbox Froggy
Flexbox Froggy has been around for quite some time and continues to be a popular choice for learning flexbox syntax. Use the different parts of the flexbox spec to arrange the frogs as required to pass the different levels.
https://flexboxfroggy.com/

4. Flexbox Zombies
Flexbox Zombies is another educational game to learn flexbox syntax.
https://geddski.teachable.com/p/flexbox-zombies

5. CSSBattle
Admittedly, CSSBattle might be the only interactive learning tool in this list that has the potential to make you a *worse* developer!
https://cssbattle.dev/

6. Learn Git Branching
Learn Git Branching aims to solve that problem with a visual and interactive walk-through of the different features of Git using a Git repository visualizer, sandbox, and a series of educational tutorials and challenges.
https://learngitbranching.js.org/

7. Flexbox Defense
Flexbox Defense is a play on the ‘tower defense’ strategy game genre that teaches you flexbox through 12 challenges where you have to use flexbox syntax to stop incoming enemies from getting past your defenses.
http://www.flexboxdefense.com/

8. CSS Grid Garden
A game for learning CSS Grid
https://cssgridgarden.com/

If you liked this:
1. Retweet the first tweet
2. Follow me on Twitter @MDvlpr for more threads like this one