DEV Community

Cover image for How do you unify TypeScript for both frontend and backend?
Pacharapol Withayasakpunt
Pacharapol Withayasakpunt

Posted on

2 2

How do you unify TypeScript for both frontend and backend?

As far as I know, there are only handful of frameworks doing this, e.g. blitz.js and frourio.

However, I know another easy way - Swagger/OpenAPI + typegen + Nodemon.

// nodemon.json
{
  "restartable": "rs",
  "execMap": {
    "ts": "yarn ts"
  },
  "events": {
    "restart": "yarn openapi || :"
  },
  "watch": [
    "server/"
  ],
  "env": {
    "NODE_ENV": "development"
  },
  "ext": "ts"
}
Enter fullscreen mode Exit fullscreen mode
// package.json
{
  "scripts": {
    "openapi": "wait-on tcp:$SERVER_PORT && curl -s http://localhost:$SERVER_PORT/api/doc/json -o ./assets/openapi.json && typegen ./assets/openapi.json > ./types/openapi.d.ts",
    "ts": "ts-node -r tsconfig-paths/register -O '{\"module\":\"commonjs\",\"noImplicitAny\":false}'"
  }
}
Enter fullscreen mode Exit fullscreen mode

And typegen is openapi-client-axios-typegen. (You can also try swaxios, but I failed to run it.)

With this approach, backend can be any programming languages that support OpenAPI or Swagger. Personally, I use fastify-swagger; but it can also be things like Python's FastAPI or Golang's Gin/Buffalo/Native.

ACI image

ACI.dev: Best Open-Source Composio Alternative (AI Agent Tooling)

100% open-source tool-use platform (backend, dev portal, integration library, SDK/MCP) that connects your AI agents to 600+ tools with multi-tenant auth, granular permissions, and access through direct function calling or a unified MCP server.

Star our GitHub!

Top comments (0)

ACI image

ACI.dev: Fully Open-source AI Agent Tool-Use Infra (Composio Alternative)

100% open-source tool-use platform (backend, dev portal, integration library, SDK/MCP) that connects your AI agents to 600+ tools with multi-tenant auth, granular permissions, and access through direct function calling or a unified MCP server.

Check out our GitHub!

Join the Runner H "AI Agent Prompting" Challenge: $10,000 in Prizes for 20 Winners!

Runner H is the AI agent you can delegate all your boring and repetitive tasks to - an autonomous agent that can use any tools you give it and complete full tasks from a single prompt.

Check out the challenge

DEV is bringing live events to the community. Dismiss if you're not interested. ❤️