3 Reasons to Start Using CodePen

While messing around trying to learn CSS, Jonas showed me a site called CodePen. After using it for a couple days, I can safely say that it's one of the best sandboxes for HTML/CSS that I've found. Here are three reasons I think it's the best way to manage software.

1. All code compiles in real time, in your browser.

A typical screen in CodePen looks like this:

All code for the site is on the side, including related HTML, CSS, and JS. Then, the site is displayed on the right, compiled instantly. Any changes in the code will appear on the site, which really helps for people learning to code in CSS like me. The fact that all code is input into the browser and that the response is immediate makes it very helpful for beginners. No extra software to worry about--just a nice site that handles all the compilation.

2. The site provides inspiration.

CodePen allows users to share their sites with others around the world. This allows users like me to explore the possibilities of HTML and CSS. Some of my favorite sites are those that help give design advice, or that showcase certain aspects of CSS. 

This page illustrates how to add dynamic elements on a page using only CSS, while this page shows the power of CSS animations. CodePen allows coders to see the possibilities of HTML and CSS.

3. The site lends structure.

CodePen helped me organize my code by combining the HTML, CSS, and JS of a project in one location. Instead of having to dig through my files and find the matching CSS and HTML files, CodePen has them linked for me. Thanks to CodePen, web design becomes easy.