CodePen
Description
CodePen is a playground for the front end side of the web. It’s all about inspiration, education, and sharing.
Need to build a reduced test case to demonstrate and figure out a bug? CodePen is great for that. Want to show off your latest creation and get feedback from your peers? CodePen is great for that. Want to find example of a particular design pattern for you project? CodePen is great for that.
CodePen PRO takes things further with features like Collab Mode which allows you to pair program in real time and Professor Mode for allowing a group of students to follow you as you teach code and chat with each other.
Pricing
Plan | Price | Details |
---|---|---|
CodePen | Free | Free to use. |
CodePen PRO Monthly Plan | $9/month | Advanced features, such as auto updating previews, file upload, classroom instruction mode, private pens, pair programming mode, and multiple external resources. |
CodePen PRO Yearly Plan | $75/year | Advanced features, such as auto updating previews, file upload, classroom instruction mode, private pens, pair programming mode, and multiple external resources. |
Reviews
Sign in or create an account to share your experiences with this tool.
One of the best ways to learn how to program is to look at existing code. This site gives you that in spades. The color-coded editor allows students to quickly parse the code and manipulate it for realtime results. My only complaint is it is hard to find something specific. I have to hunt around to find relevant examples for my course.