career CSS git javascript resources tools

Interactive learning tools

Interactive Learning Tools
by Marko Denic | November 30, 2021

Learning how to code in an interactive way is much more fun. So, I created a list of interactive learning tools for you. You can find tools to learn CSS, JavaScript, TypeScript, React, Python, Git, SQL, Regex, and more in this list.

Let’s start!

1. Learn to Code RPG

It is a visual novel game developed by FreeCodeCamp. In this game, you will teach yourself to code, make friends in the tech industry, and pursue your dream of becoming a developer 🎯

2. CodeCombat

Learn typed code through a programming game. Learn Python, JavaScript, and HTML as you solve puzzles and learn to make your own coding games and websites.

3. jsdares

Make your own games by learning JavaScript programming.

4. Coding Games

CodinGame is a challenge-based training platform for programmers where you can play with the hottest programming topics. Solve games, code AI bots, learn from your peers, and have fun.

5. JavaScript Quiz

Check your knowledge by having fun.

6. Screeps

A strategy sandbox MMO game with a persistent open world where you play by writing JavaScript to control your units. They live within the game and operate autonomously even while you are offline.

7. CSS Diner

A fun game to help you learn and practice CSS selectors.

8. Crunchzilla

Crunchzilla offers interactive tutorials that get people excited about programming. Play with code, build and learn.

9. Codepip

Codepip’s coding games, including Flexbox Froggy, Grid Garden, CSS Surgeon, Code Crunchers, and Nester.

10. CSS Battle

Use your CSS skills to replicate targets with the smallest possible code.

11. Interactive Vim tutorial

Learn what Vim is about without hassle.

12. Coding Fantasy

Collection of coding games to learn HTML, CSS, and JavaScript.

13. Knights of the Flexbox Table

Learn and remember Flexbox with Tailwind CSS to overcome your cheat sheet.

14. CSS Ruler

Explore CSS lengths.

15. TypeScript Exercises

A set of interactive TypeScript exercises.

16. Design Patterns Game

A game to test your familiarity with the design patterns implemented in JavaScript.

17. React tutorial

React Tutorial is an easy, interactive way to learn & practice modern React online. Understand how React works not just how to build with React.

18. Promisees

Promise visualization playground for the adventurous.

19. Git Branching

An interactive Git visualization tool to educate and challenge.

20. Select Star SQL

An interactive SQL book.

21. Regex 101

Regular expression tester with syntax highlighting, explanation, and cheat sheet for PHP/PCRE, Python, GO, JavaScript, and Java. Features a regex quiz & library.

22. Regex Crossword

A crossword puzzle game using regular expressions. Earn achievements by completing puzzle challenges. Easy tutorials for people new to regular expressions.

23. RegexOne

RegexOne provides a set of interactive lessons and exercises to help you learn regular expressions.

Did you like this article? Share it with your friends:

Related articles

How to Build and Deploy a Laravel App to Sevalla

How to Build and Deploy a Laravel App to Sevalla

In this tutorial, we will see how to build a simple Laravel Application and deploy it to the cloud using Sevalla.

Introduction to CSS if Statements and Conditional Logic

Introduction to CSS if Statements and Conditional Logic

Conditional logic is a familiar concept to anyone who has written a programming language. Languages like JavaScript or Python use if/else statements to evaluate expressions and execute different blocks of code depending on whether the condition is true or false.

CSS Pulse Animation

CSS Pulse Animation

Enhance user engagement with a smooth pulse animation! This eye-catching effect is perfect for quickly grabbing attention and improving UI interaction. Learn how to implement it now!