When comparing Codepen vs GitHub Codespaces, the Slant community recommends Codepen for most people. In the question“What are the best cloud IDEs?” Codepen is ranked 17th while GitHub Codespaces is ranked 18th. The most important reason people chose Codepen is:
CodePen makes it really easy to export code as a zip or Github Gist.
Specs
Ranked in these QuestionsQuestion Ranking
Pros
Pro Easily export your pen
CodePen makes it really easy to export code as a zip or Github Gist.
Pro Real time output
Pro Lots of support for frameworks and preprocessors
CodePen has an impressive amount of support for preprocessors (such as Jade, Haml, Slim, Sass, Less, Stylus, Coffeescript and PostCSS). There is also plenty of frameworks and libraries to pick from (Foundation, Bootstrap, Angular, D3, Backbone, Ember etc.).
Pro Great display/profile page
The codepen profile page allows you to display all of your public pens, and control which order you want them to be viewed in. This is great for showing off your work to possible employers, other devs etc..
Pro Easily fork pens
To fork a pen only requires clicking one button, and you'll be able to modify the pen on your own account.
Pro Great community pens
You can search through other pens, either by keyword or popular, picked or recent.
Pro Preferences are synced
Your Visual Studio local preferences and extensions are saved within GitHub, allowing you to use your configurations on the go.
Pro One-click experience
Designed to make contributing to a repository easier, all it takes to start the cloud IDE is its dedicated button within the repository page.
Pro Visual Studio Codespaces extensions works as-is
If you are a customer for Visual Studio Codespaces, your extension to control GitHub Codespaces will also work and you will be able to use your Visual Studio Code to interact to the Codespace instead of using the Web IDE if need be.
Pro Extensible and configurable
Borrowing from its bigger sister, Visual Studio Codespaces, which is also based on Visual Studio Code, any VS Code extensions work outside the box, no gotchas.
Pro Customizable environments
Environments can be customized in the user-level or the repository using a container declaration file, allowing the environments to be tailored according to the user and the target project
Cons
Con No private pens with free account
There is an option on Codepen for private pens, however it requires upgrading to a Pro account ($9/month).
Con Limited to GitHub
As this is a GitHub Product, do not expect it to work with the likes of GitLab or BitBucket. If you want to use third party VCS providers, you might want to use Visual Studio Codespaces instead.
Con Limited to 5 Codespaces instances
GitHub Codespaces currently limits you to 5 concurrent working codespaces. You have to delete another to start another codespace.
Con Early-Access Software
Currently invite-only, expect GitHub Codespaces to have some bugs until its GA release.