How To Host Your Codepen

Codepen is a super useful tool. It’s perfect for quickly dabbling with code online without the faff of an IDE. But, did you know that you can easily deploy and host your code in a couple of steps?

Here’s how: 

Prerequisite: You’re logged into any type of Codepen account (free or pro).

Step 1: Export your code from Codepen

Once you’ve found a Codepen you’d like to host, navigate to the bottom right hand corner your screen and click Export. You’ll end up with a neat zip of all your files.

Export feature on Codepen

Note: This feature only appears on desktop


Step 2: Upload it to tiiny.host

Head over to https://tiiny.host, enter a subdomain, upload the neat zip you just downloaded from Codepen and click Launch.

Uploading to tiiny.host

And you’re done! Your Codepen is now properly hosted and ready to show off to the world.