Full-Stack TypeScript with tRPC and React

Re:Full-Stack TypeScript with tRPC and React by rcfox on Tuesday March 14, 2023 @04:36PM (#35158092)

I'm currently working on a project with Typescript and gRPC. It's mostly great, but I'm somewhat disappointed with the generated code.

The frontend and backend get code generated differently. The backend is all interfaces (which, through some Nestjs magic get translated into protobufs) and the frontend is all objects. So on the frontend, you're expected to write:

    const message = new MyRequest().setName('Bob').setFoo('bar');

On the backend, you'd just write:

    const message = { name: 'Bob', foo: 'bar' }

It's not a big deal, but it's weird. The backend ends up being more/overly strict about all values being set when you might just be fine with the default zero/empty values.

Also, using a `oneof` field is correctly typed on the frontend as

    myfield: TypeA | TypeB | TypeC`

But the backend gives you

    myfield: {a: TypeA | undefined, b: TypeB | undefined, c: TypeC | undefined}

For a future project, I'd look into buf or Connect instead of the default gRPC code generators, but for now, I just need to get stuff done.

[ Parent | on HN ]

Re:Full-Stack TypeScript with tRPC and React by tczMUFlmoNk on Tuesday March 14, 2023 @06:19PM (#35159854)

> Also, using a `oneof` field is correctly typed on the frontend as

    myfield: TypeA | TypeB | TypeC

But what about when the `oneof` has multiple variants with the same base type? Like:

    message User {
        oneof contact_info {
            string email = 1;
            string phone_number = 2;
        }
    }

Does this get compiled down to `contact_info: string | string` on the frontend? How do you tell which variant was used without encoding the discriminant?

[ Parent | on HN ]