This project demonstrates a full-stack setup using gRPC as the backend service with a tRPC server acting as a bridge to expose gRPC methods to a Svelte frontend.
graph LR
subgraph Go_Server
A[gRPC Server - Engine]
end
subgraph Node_Server
B[gRPC Client - Node-TS]
C[tRPC Server - Node-TS]
end
subgraph Svelte_Frontend
D[tRPC Client - Svelte]
end
A -->|gRPC| B
B -->|tRPC| C
C -->|tRPC over HTTP/WebSocket| D
Architecture:
- gRPC Server (Go): Provides core gRPC services.
- tRPC Server (Node.js with TypeScript): Acts as a middleware that communicates with the Go gRPC server via a gRPC client and exposes APIs to the frontend.
- Svelte Frontend: Connects to the tRPC server and provides a user interface.
Data Flow:
- Go gRPC Server serves data on defined protobuf methods.
- tRPC Server acts as a gRPC client to the Go server, exposing the same methods over HTTP/WebSocket via tRPC.
- Svelte Client interacts with the tRPC server to access gRPC functionality.
- Navigate to the
remotedirectory. - Run
go run server.goto start the Go gRPC server. - Ensure it listens on a specified port (e.g.,
localhost:50051).
- In the
trpcdirectory, install dependencies:npm install
- Configure
client.tsto connect to the Go server as a gRPC client using generatedservice_pb.jsandservice_grpc_pb.jsfiles. - Set up
router.tsto expose methods via tRPC. - Run the server with:
node server.ts
- The tRPC server should now be accessible (e.g., on
http://localhost:4000or via WebSocket if subscriptions are required).
-
Install dependencies in the root Svelte project directory:
npm install
-
Configure
client.tsinsrc/lib/trpcto connect to the tRPC server. -
Use pages in
src/routes(e.g.,GetStateInfo.svelte,Chat.svelte) to call tRPC methods.
-
Run the Go gRPC server by navigating to the
remotedirectory and using:go run server.go
-
Run the tRPC server in the
trpcdirectory:node server.ts
-
Run the Svelte client in the root directory:
npm run dev
- WebSockets: Ensure WebSocket support on the tRPC server for real-time subscriptions.
- Protobuf Generation: Use
protobuf_generate.shinremote/protobufto regenerate Go and Node.js protobuf files if.protofiles are updated.