Skip to content

feat(cli): add Connect RPC and Protocol Buffers support - #1120

Open
MrPinguiiin wants to merge 3 commits into
AmanVarshney01:mainfrom
MrPinguiiin:main
Open

MrPinguiiin wants to merge 3 commits into
AmanVarshney01:mainfrom
MrPinguiiin:main

Conversation

@MrPinguiiin

@MrPinguiiin MrPinguiiin commented Jul 22, 2026

Copy link
Copy Markdown

Summary

This PR adds gRPC-compatible API generation using Connect RPC and Protocol Buffers.

Changes

  • Add grpc as a supported API option in the CLI and shared schemas.
  • Add gRPC support to the web stack builder and compatibility validation.
  • Add Buf configuration and TypeScript protobuf code generation.
  • Add generated Connect service definitions and protobuf message types.
  • Add gRPC route integration for:
    • Hono
    • Express
    • Fastify
    • Elysia
    • Next.js self backend
  • Add React web and native Connect clients.
  • Add unary RPC examples:
    • Health
    • Greet
  • Add server-streaming RPC example:
    • ListItems
  • Add compatibility validation for Cloudflare Workers.
  • Add a cross-platform codegen wrapper to avoid the Node localstorage-file warning.
  • Add a local gRPC icon asset.
  • Fix local SVG icon rendering in the stack builder and stack badges.
  • Add gRPC generation and compatibility tests.

Validation

The following checks pass:

  • bun run check
  • bun run build:cli
  • bun run typecheck in packages/template-generator
  • bun run check-types in apps/cli
  • bun test apps/cli/test/grpc-api.test.ts
  • Buf protobuf generation in a generated project
  • Generated API package typecheck
  • Generated server package typecheck
  • Runtime unary RPC test for Health
  • Runtime unary RPC test for Greet
  • Runtime server-streaming RPC test for ListItems

Scope

This implementation provides Connect RPC and Protocol Buffers support for TypeScript projects.

Supported client templates currently include React web and native frontends. Nuxt, Svelte, Solid, and Astro are intentionally rejected for gRPC until dedicated client templates are available.

Summary by CodeRabbit

  • New Features

    • Added gRPC as a supported API option for project creation.
    • Generated projects now include ConnectRPC services, clients, protobuf definitions, and server integrations across supported frameworks and runtimes.
    • Added gRPC technology details and selection support in the project setup experience.
  • Bug Fixes

    • Improved API compatibility guidance for unsupported gRPC combinations, including Cloudflare Workers and select frontends.
    • Fixed technology icons supplied through relative paths and HTTP URLs.
  • Tests

    • Added coverage for gRPC project generation across multiple backend and frontend configurations.

- Add gRPC as a new API option in CLI prompts
- Implement compatibility rules to restrict gRPC usage with Workers runtime and certain frontends
- Extend dependency management to include Connect, Buf, and related packages for gRPC
- Add gRPC-specific template files for server, React web, native clients, and fullstack Next.js
- Generate gRPC proto files, codegen config, and type declarations
- Include gRPC icon and update UI to support gRPC tech badge and tech icon rendering
- Add comprehensive tests for gRPC API integration with various backends and runtimes
- Provide error validations for incompatible configurations with gRPC API
- Update constants and utilities to handle gRPC API option and dependencies
- Delete local SVG files for oRPC and tRPC icons
- Change icon paths to use ICON_BASE_URL for remote icon loading
- Update constants to reference new icon URLs instead of local paths
@vercel

vercel Bot commented Jul 22, 2026

Copy link
Copy Markdown

@MrPinguiiin is attempting to deploy a commit to the Better T Stack Team on Vercel.

A member of the Team first needs to authorize it.

@chatgpt-codex-connector

Copy link
Copy Markdown

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.

@coderabbitai

coderabbitai Bot commented Jul 22, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 28305a73-2bb4-472d-b15d-e1c59bdd7fdd

📥 Commits

Reviewing files that changed from the base of the PR and between d323b4b and a2078fa.

⛔ Files ignored due to path filters (3)
  • packages/template-generator/src/templates.generated.ts is excluded by !**/*.generated.*
  • packages/template-generator/templates/api/grpc/server/src/generated/api/v1/service_connect.ts.hbs is excluded by !**/generated/**
  • packages/template-generator/templates/api/grpc/server/src/generated/api/v1/service_pb.ts.hbs is excluded by !**/generated/**
📒 Files selected for processing (9)
  • apps/cli/test/grpc-api.test.ts
  • apps/web/src/app/(home)/new/_components/utils.ts
  • packages/template-generator/templates/api/grpc/native/utils/connect.ts.hbs
  • packages/template-generator/templates/api/grpc/server/package.json.hbs
  • packages/template-generator/templates/api/grpc/server/proto/api/v1/service.proto.hbs
  • packages/template-generator/templates/api/grpc/server/src/index.ts.hbs
  • packages/template-generator/templates/api/grpc/server/tsconfig.json.hbs
  • packages/template-generator/templates/api/grpc/web/react/base/src/utils/connect.ts.hbs
  • packages/template-generator/templates/backend/server/fastify/src/index.ts.hbs
💤 Files with no reviewable changes (1)
  • packages/template-generator/templates/backend/server/fastify/src/index.ts.hbs
🚧 Files skipped from review as they are similar to previous changes (7)
  • packages/template-generator/templates/api/grpc/server/tsconfig.json.hbs
  • packages/template-generator/templates/api/grpc/server/package.json.hbs
  • packages/template-generator/templates/api/grpc/server/src/index.ts.hbs
  • packages/template-generator/templates/api/grpc/native/utils/connect.ts.hbs
  • apps/web/src/app/(home)/new/_components/utils.ts
  • packages/template-generator/templates/api/grpc/web/react/base/src/utils/connect.ts.hbs
  • apps/cli/test/grpc-api.test.ts

Walkthrough

Changes

gRPC support

Layer / File(s) Summary
API selection and compatibility
packages/types/src/schemas.ts, apps/cli/..., apps/web/src/app/(home)/new/..., apps/web/src/lib/constant.ts
gRPC is added to API choices and technology options, with restrictions for Workers, Nuxt, Svelte, Solid, and Astro configurations.
Generated API contract and tooling
packages/template-generator/src/..., packages/template-generator/templates/api/grpc/...
Dependency maps, protobuf services, Buf configuration, generation scripts, API package metadata, contexts, routes, and TypeScript configuration are added for gRPC projects.
Backend and client integrations
packages/template-generator/templates/backend/server/..., packages/template-generator/templates/api/grpc/web/..., packages/template-generator/templates/api/grpc/native/...
Connect transports and server routing are generated for Next.js, React web, native clients, Hono, Elysia, Express, and Fastify.
Generation validation
apps/cli/test/grpc-api.test.ts
Generation tests cover supported backend combinations, generated artifacts, React Router setup, and Workers incompatibility.

Possibly related PRs

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title accurately summarizes the main change: adding Connect RPC and Protocol Buffers support.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint install failed. For unrecoverable errors, disable the tool in CodeRabbit configuration.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 5

🧹 Nitpick comments (2)
apps/cli/test/grpc-api.test.ts (1)

31-35: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Assert concrete generated files for every supported combination.

The Hono case only checks that src/generated exists, while the Express, Fastify, Next.js, and React Router cases only call expectSuccess. Since expectSuccess only verifies creation success and a result object (apps/cli/test/test-utils.ts:152-162), missing or empty Connect output could still pass. Add shared assertions for concrete generated files and backend route artifacts.

Also applies to: 64-150

packages/template-generator/templates/api/grpc/server/tsconfig.json.hbs (1)

3-10: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick win

Pin the TypeScript target and libraries.

The generated context.ts.hbs and index.ts.hbs use Promise, Headers, and an async generator, but this standalone config relies on compiler defaults. TypeScript derives default libraries from target, and async iterable declarations require ES2018-era libraries; pin a supported runtime baseline instead of relying on the installed TypeScript version. (typescriptlang.org)

Suggested configuration
   "compilerOptions": {
+    "target": "ES2022",
+    "lib": ["ES2022", "DOM"],
     "strict": true,

Source: MCP tools


ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: cb3132a2-6e35-4448-90a2-a0d589604a3f

📥 Commits

Reviewing files that changed from the base of the PR and between 4473a3e and d323b4b.

⛔ Files ignored due to path filters (4)
  • apps/web/public/icon/grpc.svg is excluded by !**/*.svg
  • packages/template-generator/src/templates.generated.ts is excluded by !**/*.generated.*
  • packages/template-generator/templates/api/grpc/server/src/generated/service_connect.ts.hbs is excluded by !**/generated/**
  • packages/template-generator/templates/api/grpc/server/src/generated/service_pb.ts.hbs is excluded by !**/generated/**
📒 Files selected for processing (30)
  • apps/cli/src/prompts/api.ts
  • apps/cli/src/utils/compatibility-rules.ts
  • apps/cli/test/grpc-api.test.ts
  • apps/web/src/app/(home)/new/_components/tech-icon.tsx
  • apps/web/src/app/(home)/new/_components/utils.ts
  • apps/web/src/app/layout.tsx
  • apps/web/src/components/ui/tech-badge.tsx
  • apps/web/src/lib/constant.ts
  • packages/template-generator/src/processors/api-deps.ts
  • packages/template-generator/src/processors/backend-deps.ts
  • packages/template-generator/src/template-handlers/api.ts
  • packages/template-generator/src/utils/add-deps.ts
  • packages/template-generator/templates/api/grpc/fullstack/next/src/app/api/connect/\[...path\]/route.ts.hbs
  • packages/template-generator/templates/api/grpc/native/utils/connect.ts.hbs
  • packages/template-generator/templates/api/grpc/server/_gitignore
  • packages/template-generator/templates/api/grpc/server/buf.gen.yaml.hbs
  • packages/template-generator/templates/api/grpc/server/buf.yaml.hbs
  • packages/template-generator/templates/api/grpc/server/package.json.hbs
  • packages/template-generator/templates/api/grpc/server/proto/service.proto.hbs
  • packages/template-generator/templates/api/grpc/server/scripts/generate.mjs
  • packages/template-generator/templates/api/grpc/server/src/context.ts.hbs
  • packages/template-generator/templates/api/grpc/server/src/index.ts.hbs
  • packages/template-generator/templates/api/grpc/server/src/routers/index.ts.hbs
  • packages/template-generator/templates/api/grpc/server/tsconfig.json.hbs
  • packages/template-generator/templates/api/grpc/web/react/base/src/utils/connect.ts.hbs
  • packages/template-generator/templates/backend/server/elysia/src/index.ts.hbs
  • packages/template-generator/templates/backend/server/express/src/index.ts.hbs
  • packages/template-generator/templates/backend/server/fastify/src/index.ts.hbs
  • packages/template-generator/templates/backend/server/hono/src/index.ts.hbs
  • packages/types/src/schemas.ts
💤 Files with no reviewable changes (1)
  • apps/web/src/app/layout.tsx

Comment thread apps/cli/test/grpc-api.test.ts Outdated
Comment thread apps/web/src/app/(home)/new/_components/utils.ts
Comment thread packages/template-generator/templates/api/grpc/server/proto/service.proto.hbs Outdated
Comment thread packages/template-generator/templates/backend/server/fastify/src/index.ts.hbs Outdated
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant