10 Copy-Paste Coding Game Snippets That Teach CSS, Regex & the Terminal

10 free coding game snippets that teach CSS selectors, regex, flexbox and the terminal. Live previews, vanilla JS, one-click React and Vue export.
10 Copy-Paste Coding Game Snippets That Teach CSS, Regex & the Terminal
Most "learn to code" widgets are quizzes wearing a costume. You read a question, you pick an answer, a green tick appears, and nothing about the way you think has changed — because the thing you were tested on was recall, and the thing that's actually hard is prediction. Does [1, 2, 10].sort() give you what you expect? Does that selector match three elements or five? Does cp src backup work without a flag? You don't find out by being told. You find out by typing something, being wrong, and seeing precisely how wrong. Below are ten free browser games that do exactly that: a CSS selector challenge that highlights your matches live, a flexbox alignment puzzle graded on pixels rather than properties, a regex trainer with a pass column and a fail column, a simulated terminal that accepts any correct spelling of a command, a bug hunt through seven real JavaScript defects, a timed "predict the output" quiz, a binary bit-flip game, a logic gate circuit puzzle with a…

About the author

Puneet Sharma is a freelance web developer and the creator of FWD Tools and WebDevPuneet. Follow him on X/Twitter

Post a Comment