Code Playground, a place for playful code

👋

Hey!

Welcome to
Code Playground

the place for playful code!

Code Playground is a place for me to play with code.

Learning code is challenging. There are many concepts to learn, and as you probably know already, practice is essential. Common advice for practicing what you're learning is "build projects!"

Yeah, but I want to practice most if not everything I learn - am I supposed to build a million projects to practice and demonstrate what I'm learning? No. Because another common piece of advice is to have fewer, more high quality projects, at least in your portfolio.

Well, okay. That's confusing.

First, you don't have put all the projects you create in your portfolio.

Second, in addition to creating larger projects, why not have a place that contains several smaller projects? These smaller projects can be accomplished in 30 minutes, an hour, or half a day.

That's where Code Playground comes in. Each section below is a self-contained project - a sandbox.

I only include things here that delight me.

Each sandbox has a link to resources where you can learn more about this thing.

Happy coding! 🎉

Because learning should be fun.

With so much to explore and discover in the world, why not have fun during that process?

The goals of Code Playground:

To make coding fun 🤸

To create a joyful experience and inspirational learning environment 💙

Heck, yeah!

All this project code is available on my Github.

Plus, it was one of my first projects to use a front-end framework, so...

If I can do it, so can you.

1. Show-and-Hide

Boo! 👻


RAWR! 🐉
Learn How to Do This

2. CSS Loader

Learn How to Do This

3. A Tulip, Blooming

Learn How to Do This

4. A Bit of Math

Enter first number:

Enter second number:

Learn How to Do This

5. A Bit More Math

Enter first number:

Enter second number:

Learn How to Do This

6. Firefighter

Click on the fire to put it out!

🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥

🔥🔥🔥🔥🔥🔥🔥🔥

🔥🔥🔥🔥🔥🔥

🔥🔥🔥🔥

🔥🔥🔥

🔥🔥

🔥

Click to reveal what you've saved...
🌲🌳🌲🌱🌳🌲🌳🌲🌱🌳🌲🌳🌲🌱🌳🌲🌳🌲🌱🌳🌲🌳🌲🌱🌳🌲🌳🌲🌱🌳🌲🌳🌲🌱🌳🌲🌳🌲🌱🌳🌲
Learn How to Do This