At my work at Delorean I've developed a helper tool for those projects where you use the Content Delivery API and uSync, and would like to have Typescript for your frontend needs. I've seen a few discussions on the forums where this has been requested. Feel free to check it out, perhaps it can be of help to your future project: https://github.com/DeloreanSE/usync-typescript-generator Hopefully in the future this will be solved by built in functionality into Umbraco and have even better support, but this can gets us over the hurdle currently.

Seems a neat idea - will take a look at lunch 👀

Let me know if you have any questions. This is a rather 'quickly written' tool to get up and running, and it might not follow best typescript practices either, but the end result is great for us currently as we finally have a somewhat direct connection between what fields we set up on our document types and what we have available in our frontend development. As long as our frontend checks the contenttype of the DocumentType received from the API request, the rest has proper typing moving along in the frontend component tree. If a document type has a block list with a set of blocks, those blocks have the proper types within them as well. Deeper nesting also works, and even compositions onto blocks (which we've never done but I noticed that's a thing you can actually do).

@UMB.FYI tip

Thanks for the tip

Looks like a great idea!

Does it use the modelsbuilder or is it really just your own implementation of it?

@PascalEugster It just looks at your exported uSync files, parses the xml and makes deductions accordingly, so no modelsbuilder used.

How does this compare to using a cli tool in nodejs land to generate a client and types etc from an Swagger/OpenAPI spec ?

That was my initial plan actually, to either use openapi > typescript, or https://jsontypedef.com/ or a third option. Can't remember. I also tried quicktype.io and the variants it used, JSON Schema etc. Either way, the big part of the job was to actually get the current fields one has setup. In this case, to parse the uSync files. None of the tried alternatives made the process smoother, rather more cumbersome. To use any of those, you'd probably have to restructure things quite a bit and adapt to the expectations of the chosen format/schema. It's probably a more solid approach to go through a custom Umbraco controller to get the modelsbuilder or something, but that would've taken a lot longer for me. For the expected lifetime of something like this, this was a reasonable approach. With the current approach I can add a field, hit save, and a second later in React get typescript hinting by typing

props.

and have the correct field hinted.

👍