1. Add Any Library You Want, Quickly
It’s as simple as selecting a library from the Quick Add dropdown, or even better, just start typing the library and we’ll offer matching choices. There are thousands of CDN-hosted libraries we offer through typeahead.
2. Write in ES2015
Shown here is the
let keyword, an arrow function, and template literals.
You can also write ES2015 stuff without using Babel as well, but you may run into browser support issues like you would any other cutting edge feature.
3. Use a Real Console for Output and Debugging
You can use your browser’s DevTools console on CodePen, of course. But you need to make sure you set the context of it to the demo
<iframe>, or else it won’t work.
Or, you can pop open CodePen’s built-in console, which is always in the correct context.
Mini tip! You might notice the URL change when you open/close differnet code panels. There are four numbers, and stand for HTML, CSS, JS, and Console (in that order). So the URL parameter:
2 as the last number maximizes the console. In this way you could share a Pen where the output is intentionally only for the console.