I've been working with some public APIs as part of an upcoming course, and I'm often finding that I have the structure of a response object, but no TypeScript interface. I'm happy to convert this manually (either fully or view model), but I'm always looking for fun ways to automate my workflow.
Using the JSON Placeholder as an example, let's look at a typical response object for
If we wanted to create our own model from this, it'd take a few minutes, and this doesn't count any mistype(s) or errors. Enter... JSON to TS!
This can either be used with the web client https://www.jsontots.com/ but for productivity reasons, I much prefer using the VS Code Extension.
To install the extension, hit up the marketplace with
ext install json-to-ts and restart your editor. The same JSON data can then be pasted in with CTRL + ALT + V and a model will automatically be created:
Tada! If you found this useful, I'd love to know what other Visual Studio Code extensions you're using in the comments section below or @PWHSoftware.
Join the newsletter to receive the latest updates in your inbox.