DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 968,547 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for Play games to improve your developer skills.
Chris Jarvis
Chris Jarvis

Posted on

Play games to improve your developer skills.

Can you learn to code by playing games? Can games make you a better developer? Yes. I am listing some games that teach you coding concepts or improve skills that will help you code.

Shortcut Foo

Shortcut Foo
Keyboard shortcuts speedup your coding. This site teaches you shortcuts and muscle memory by playing a ninja fighting game.

shortcutFoo was created by programmers for programmers in an attempt to make learning your editor fun, easy, and effective. Akin to the days of first learning how to type on a keyboard, shortcutFoo aims to help programmers accomplish more in less time and with fewer keystrokes. --from their site.

First you practice a shortcut. Select the dojo for what subject you can to learn. An action appears on screen and you press the keys that command that action. You get several actions in a section. They repeat until you get them right fast enough.
In the fight section you can battle a ninja using those keystrokes as attacks. In the game two ninjas are lined up. An action like "Commit changes" appears on screen. You hit the keys or type the command and move your ninja along the line. First one to the end wins. You can even fight a friend by their username.
Finally test out to unlock the next level. This section plays the same way as the learning section.

Know what the key combo of ⇧βŒ₯DOWN (Shift + Alt + down keys) does on slack?

Jumps to the next channel or direct message with unread messages. 
Enter fullscreen mode Exit fullscreen mode

You can learn shortcuts for languages, editors, or apps. There are dojos for JavaScript, python, ruby, VScode, terminal, and git and more.

You can set reminders for days, a week, or even a month.

The basic levels are free but you must subscribe, $8 a month or $80 for an annual subscription, to unlock higher levels. There are personal and organizational options. Subscription unlocks all the dojos.

Ztype

ZType
Need practice typing, play ZType. It's typing meets space invaders. Words fly out of a ship and you type the word to shoot it. Misspelling count as a miss. You can't shoot another word till you finish the first.
The words can be random or you can load some content. They have 'Cat in the Hat' and 'Alice in Wonderland' as options. You can add you own text or a website.
You can even load a post. Tired of that blog you've been writing? Shoot it.
Hate someone's take on a subject? Shoot it!

space-ship shoot at words.

Ztype has great music. With controls to change the sound level of music and effects.
I played this while in bootcamp to get that muscle memory going. I still play sometimes just for a quick game. If you are a student and are having trouble keeping up with the lecturer, try this.
Ztype is sponsored by Typsey, a typing program. ZType itself is free but if you need more training, Typsey has a free 7-day trail and a $9 a month fee.

Flexbox Froggy

Flexbox Froggy teaches Flexbox by moving frogs around the screen. They list a property like align-items and you try different attributes to move the frogs to the lily pads. This is one of several code games from Codepip by Dave Geddis They have 2 free games and a Pro account with more, that is $6 a month. The free games are Flexbox Froggy and Grid Gardens. The games mostly cover CSS but the are a couple HTML and JavaScript games.

Grid Gardens

Grid Gardens teaches you CSS grid while you tend a virtual garden. Similar to Flexbox Froggy you use grid attributes to place water on plants and poison on weeds. video demo.

CSS Diner

CSS Diner beautiful minimalistic game that teaches CSS selectors. Not as much documentation on here, so it requires a little more experience than the other CSS games.

At the top of the screen is a small table. Below that is CSS and HTML. Each level asks you to select something on the table. You read the HTML side and enter the correct CSS selector on the CSS side to advance.

Thoughts

Do you play other code games? What would you recommend?

-$JarvisScript git push
Enter fullscreen mode Exit fullscreen mode

Top comments (6)

Collapse
 
captainyossarian profile image
yossarian

Please dont play Factorio. It will eat you

Collapse
 
cerchie profile image
Lucia Cerchie

awesome! will revisit the CSS ones

🌚 Friends don't let friends browse without dark mode.

Sorry, it's true.