Interactive code playgrounds are wonderful. Being able to play with ideas quickly is really helpful for my personal and professional learning. Kotlin is the newest addition to my skill set, and in addition to their excellent documentation they offer an interactive playground at https://play.kotlinlang.org.

This is what you see when you initially visit the site.

Maybe other languages have this now as well—I didn’t check. When I learned most of the languages I know, such things didn’t exist. I was first introduced to code playgrounds with Xcode, but those weren’t embedded in a website and you couldn’t just share them via a link.

Being an author on Medium, I regularly share code with readers, either using plain code blocks or embedded GitHub gists. For simplicity, I usually stick with block code because I want the article and the code in the same document. Especially now that Medium supports syntax highlighting, I’ve preferred code blocks over gists.

With the ability to embed interactive code in my articles, I might change things up a bit.

Now let me show how easy it is.

I changed the initial code into a runnable example. Disclaimer: it’s not meant to be a meaningful example.

When you hit the “Run” button, the window expands to show the output area.

The code block can be shared by clicking “Share code.”

If the code is embedded via an iframe, copy the first line. Click “Medium” and paste that first line directly into your Medium article.

This is what I did with the snippet above. The result:

https://pl.kotl.in/0CVdngU2D

That’s so neat!

Hopefully you find this useful.

Thank you for reading!