An Enhanced TypeScript Playground

As I was going through my Twitter feed earlier this evening, a tweet from someone I follow popped up.

I was like, hey, that looks pretty cool. So I asked Steven if he had created it, to which he replied.

In a nutshell, typescript-play is like the official TypeScript playground but with some great enhancements:

• All strict options turned on by default
• More available compiler options
• Ability to switch TypeScript version
• More space for code
• More examples
• Quicker sharing, URL updates as you type
• Shorter sharing URLs

What's even cooler is the fact that it's open sourced, so you can deploy it locally.

agentcooper / typescript-play

Better TypeScript playground

⚠️ Please use the offical TypeScript playground, now it has all the same features and even more. Use https://github.com/microsoft/TypeScript-Website/issues for issues and questions.

---

TypeScript playground

A better TypeScript playground.

Website: https://typescript-play.js.org.

Differences from https://www.typescriptlang.org/play:

• All strict options turned on by default
• More available compiler options
• Ability to switch TypeScript version
• More space for code
• More examples
• Quicker sharing, URL updates as you type
• Shorter sharing URLs

Getting started

npm install
npm run setup
npm start

Updating TypeScript

Playground relies on UNPKG to fetch monaco-editor (contains typescript through monaco-typescript package).

In case if monaco-editor is not updated to the latest TypeScript, the latest version can be built with npm run get-typescript latest and served locally If you run into errors, the latest monaco version may be incompatible with the latest typescript version in which case you'll need to update monaco-typescript upstream, or apply a patch locally (see the …

View on GitHub

If you don't feel like cloning it, check it out at typescript-play.js.org.

Happy coding!

Photo by Jorge Gonzalez on Unsplash

Comments

[Mihail Malo]

Would be cool if it included typescript@next, not stopped at an old stable version.
I understand it wouldn't be hard to update, but I meant specifically tracking every @next release :)

I do prefer the UI and other features like strict.

[Nick Taylor]

Sounds like a great idea if you wanted to try upcoming features.

You can always open an issue or put up a PR. 😎

[Steven]

Hey that’s me! 😊

A quick update: the 3rd party playground has been merged into the official playground so all the features are available thanks to Agent Cooper and Orta 🎉

[Nick Taylor]

Yeah, I saw that a little while back and it also looks like Orta has been doing a tonne of work there and in the docs. 👏

Also, welcome to DEV 👋

[Steven]

Thanks! This DEV community might make me start blogging again. My current blog has spider webs and that’s not just for Halloween 🕸 👻

[Nick Taylor]

You can also cross-post here. That is what I do. I've got a Gatsby blog, iamdeveloper.com, set up and then whenever I post something, I can sync it here and tweak it a little bit.

Also, you can even use the platform as your content and publish an external blog using Stackbit. @ben wrote a post about this recently.

You can now generate self-hostable static blogs right from your DEV content via Stackbit

Ben Halpern ・ Sep 26 ・ 4 min read

#meta #projectbenatar #webdev #changelog

It'd be great to get some of your writing here. Maybe even get the Zeit org to cross-post here. 😉

[Steven]

Thanks for the cross-posting idea! I finally wrote a blog post 😅

dev.to/styfle/website-redesign-3-0...