When I think about tools that I use on an almost daily base, CodePen sparks my mind.
Not only do I use it so often, but then it hit me. They don’t even ever ask for anything in return.
Could it be? The perfect tool DOES exist?
And because of that, I just had to write this love letter to CodePen. The tool that brings so much and never asks for anything in return ❤️.
What is CodePen?
CodePen is a browser-based development environment. It allows you to create real-time code examples to quickly test something out or demo something to other people.
You might have seen the phrase: Could you create a CodePen demonstrating this issue?
And that’s exactly what it is! It doesn’t take favorites, as it comes with so many tools, libraries and languages supported.
Not only is it just that, but there is a whole community around CodePen, which is a super cool developer space.
It’s a portfolio
When we think about developer portfolios, especially front-end devs, we often neglect that CodePen plays an immersive role.
We might have made some CSS art or just a very cool JavaScript project that we want to share with the world.
And yes, CodePen might be just as important as your GitHub profile.
It’s inspiring
I often find myself browsing CodePen for inspiration. The team picks top projects to showcase for the rest of the world to explore.
Heck, I even got features with a couple of items.
See the Pen CSS Frosted glass creditcard by Chris Bongers (@rebelchris) on CodePen.
And that is the power of CodePen. It not only allows us to try out code right in the browser, it even makes this visible to the rest of the world.
It’s free
Crazy right? They do offer a CodePen pro which is even better, but in essence, you can use it for free.
You might think, what’s the catch, and to be honest, I don’t know what the catch is, or If there even is one?
It’s no hassle
The cool part is that we don’t have to go through manual installations to try something out.
I often help out interns or juniors by providing them with a sample CodePen of something they want to try out but might struggle with.
This way, I don’t have to go through all kinds of installation steps just to run a simple project with Tailwind.
CodePen I’m just crazy about you
Chris Coyier, thanks for bringing us CodePen. It’s one of my most valued developer tools and so underrated by me at times.
Even looking at this blog, about half my articles are powered by some CodePen demo.
You make my life complete. Without you, I wouldn’t be able to demo out all these little examples so people can understand and try out code in their browsers.
To get the point.
I think I love you…
❤️ Chris
Thank you for reading, and let’s connect!
Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on Facebook or Twitter
