{"slug": "build-agentic-full-stack-apps-with-genkit", "title": "Build agentic full-stack apps with Genkit", "summary": "Google's open-source framework Genkit has introduced a new Agents API in preview for TypeScript and Go, enabling developers to build full-stack AI-powered applications with built-in support for message history, tool loops, streaming, persistence, and frontend protocols. The API allows defining agents on the server and driving them with a unified chat() interface, supporting both server-managed and client-managed conversation continuity.", "body_md": "[Genkit](https://genkit.dev/) is an open-source framework for **building full-stack, AI-powered and agentic applications for any platform** with support for TypeScript, Go, Dart, and Python. Some of the most compelling AI features are conversational, like a support assistant that remembers the ticket or a copilot that works across several turns. Each needs more than a single `generate()`\n\ncall, and building one today means wiring up message history, the tool loop, streaming, persistence, and a frontend protocol by hand. That plumbing repeats on every project and has little to do with what makes your app distinct.\n\nGenkit solves this with the [ Agents API](https://genkit.dev/docs/agents/overview/), which packages all of that behind one interface. You define an agent on the server, then drive it with the same\n\n`chat()`\n\nAPI whether it runs in process or behind an HTTP endpoint.**>** The Agents API is in **preview** today in TypeScript and Go. It can introduce breaking changes in minor version releases.\n\nAn agent needs a name and a system prompt to start. From there you add tools, state, and a session store as the feature grows.\n\n``` python\nimport genkitx \"github.com/firebase/genkit/go/genkit/exp\"\n\ng := genkit.Init(ctx,\n    genkit.WithPlugins(&googlegenai.GoogleAI{}),\n    genkit.WithExperimental(), // Enables preview features like Agents API.\n)\n\nassistant := genkitx.DefineAgent(g, \"assistant\",\n    aix.InlinePrompt{\n        ai.WithModelName(\"googleai/gemini-flash-latest\"),\n        ai.WithSystem(\"You are a helpful assistant.\"),\n    },\n)\n\nout, err := assistant.RunText(ctx, \"Hello. What can you do?\")\nif err != nil {\n    log.Fatal(err)\n}\n\nfmt.Println(out.Message.Text())\n```\n\nThe same agent object is flexible and can handle a one-shot reply, a streamed turn, a paused tool call, and a multi-turn conversation. You do not reach for a different abstraction as the feature grows.\n\nEvery conversation needs continuity between turns, and you decide who owns it.\n\nAdd a `store`\n\nand the agent becomes **server-managed**. The server persists messages, custom state, and artifacts as snapshots, and clients continue by sending back a session ID. Choose this for persistent chat apps, shared devices, and any workflow where the client should not carry the whole conversation.\n\n``` python\nimport firebasex \"github.com/firebase/genkit/go/plugins/firebase/exp\"\nimport genkitx \"github.com/firebase/genkit/go/genkit/exp\"\n\nstore, err := firebasex.NewFirestoreSessionStore[WeatherState](ctx, g,\n    firebasex.WithCollection(\"snapshots\"),\n    firebasex.WithCheckpointInterval(10),\n)\nif err != nil {\n    log.Fatal(err)\n}\n\nweatherAgent := genkitx.DefineAgent(g, \"weatherAgent\",\n    aix.InlinePrompt{\n        ai.WithSystem(\"Answer weather questions. Ask for a location when one is missing.\"),\n        ai.WithTools(getWeather),\n    },\n    aix.WithSessionStore(store),\n)\n```\n\nThe store you configure decides where snapshots live. For production, Firestore gives you a managed, multi-instance database that several server instances can share. Genkit also ships lighter stores for local work and lets you implement your own, which the section below covers.\n\nLeave the store off and the agent is client-managed: the server returns the full state and the client sends it back on the next turn. Use this when your app already owns persistence or you need stateless server deployments.\n\nEvery successful server-managed turn writes a snapshot, so you can resume the latest state by `sessionId`\n\nor branch from an exact point in history by `snapshotId`\n\n. Branching lets a user explore an alternative from any saved moment without disturbing the original thread.\n\n```\n// Continue the latest state in a conversation.\nout, err := weatherAgent.RunText(ctx, \"Continue where we left off.\",\n    aix.WithSessionID[WeatherState](\"user-session-123\"),\n)\n\n// Or branch from a specific saved point.\nbranch, err := weatherAgent.RunText(ctx, \"Revise this plan for a smaller budget.\",\n    aix.WithSnapshotID[WeatherState](approvedPlanSnapshotID),\n)\n```\n\nAlongside message history, an agent carries two more kinds of state. **Custom state** is your typed application data, the compact control and UI values that drive the next turn, such as workflow status, a task list, or selected entities. **Artifacts** are generated outputs the user may inspect, download, or version on their own, such as a report, a patch, or an itinerary. A tool updates either one through the active session, and Genkit streams the changes to the client as they happen.\n\nEvery agent is already a servable action, so putting one behind an HTTP endpoint is a few lines. The route helpers return descriptors you mount on a standard http.ServeMux, and they wire up the turn endpoint plus the snapshot and abort companions for you.\n\n``` python\nimport genkitx \"github.com/firebase/genkit/go/genkit/exp\"\n\nmux := http.NewServeMux()\nfor _, route := range genkitx.AllAgentRoutes(g) {\n    mux.HandleFunc(route.Pattern(), route.Handler())\n}\n\nlog.Fatal(http.ListenAndServe(\":8080\", mux))\n```\n\nThat same wire protocol is what the client below speaks, so a JavaScript or Go backend serves any client identically.\n\nThe piece that ties your server and client together is the remote agent. `remoteAgent()`\n\nreturns a handle with the **same** `chat()`\n\n** interface** as a local agent, so the code that drives an agent in your backend tests is the code that drives it from the browser. There is no separate request and response protocol to design, and no streaming format to invent.\n\nWe are launching a JavaScript client, so a web frontend can talk to the same agent endpoint. The following is an example of how to connect to a remote agent from a TypeScript frontend.\n\n``` js\nimport { remoteAgent } from 'genkit/beta/client';\n\nconst agent = remoteAgent<WeatherState>({\n  url: 'http://localhost:8080/api/weatherAgent',\n});\n\nconst chat = agent.chat();\nconst res = await chat.send('Weather in Tokyo?');\n\nconsole.log(res.text);\n```\n\nThe client speaks one wire protocol over the agent route, so it works the same against a JavaScript or a Go backend. It resolves dynamic auth headers per request, applies streamed state patches, and continues the next turn with a session ID, a snapshot ID, or client-managed state, whichever your agent uses.\n\nStreaming is built into the same interface. `sendStream()`\n\ngives you a chunk stream and a final response, and each chunk can carry text, custom state, or an artifact as it is produced.\n\n``` js\nconst turn = agent.chat().sendStream('Write a long report.');\n\nfor await (const chunk of turn.stream) {\n  if (chunk.text) process.stdout.write(chunk.text);\n  if (chunk.custom) updateStatus(chunk.custom);\n  if (chunk.artifact) renderArtifact(chunk.artifact);\n}\n\nconst res = await turn.response;\n```\n\nIf you already have apps that use the [Vercel AI SDK UI](https://ai-sdk.dev/docs/ai-sdk-ui) library, the `@genkit-ai/vercel-ai`\n\npackage provides an adapter for its `useChat`\n\nhook. The `GenkitChatTransport`\n\nadapter connects `useChat`\n\nto your Genkit agent, so you can assemble the interface from Vercel's [AI Elements](https://elements.ai-sdk.dev/) components while getting all the benefits of Genkit on the backend.\n\nA tool can pause an agent and hand control back to the user. The model decides outside input is needed, the tool interrupts, and the client approves, rejects, or supplies the missing value before the turn continues. This is how you put a human in the loop before a payment, a deployment, or any action you do not want to run automatically.\n\n``` python\nimport genkitx \"github.com/firebase/genkit/go/genkit/exp\"\nimport \"github.com/firebase/genkit/go/ai/exp/tool\"\n\nrunShell := genkitx.DefineInterruptibleTool(g, \"run_shell\",\n    \"Run a shell command after a safety check.\",\n    func(ctx context.Context, input ShellInput, confirm *Confirmation) (ShellOutput, error) {\n        if isRisky(input.Command) {\n            if confirm == nil {\n                return ShellOutput{}, tool.Interrupt(ShellInterrupt{\n                    Command: input.Command,\n                    Reason:  \"The command can modify files.\",\n                })\n            } else if !confirm.Approved {\n                return ShellOutput{}, errors.New(\"user rejected shell command execution\")\n            }\n        }\n\n        return execute(input.Command)\n    },\n)\n```\n\nThe turn finishes with an `interrupted`\n\nreason and the paused request on the response. The client resumes once the user answers, and the runtime validates the resume payload against session history so a tool cannot be tricked into running with forged input.\n\nSome turns take longer than a user wants to wait. With server-managed state, a client can detach a turn, close the tab, and reconnect later by snapshot ID. The agent keeps working on the server, writing progress to a pending snapshot that another session can poll, wait on, or abort.\n\n``` js\nconst chat = reportAgent.chat({ sessionId: 'report-123' });\nconst task = await chat.detach('Write the quarterly market report.');\n\n// Persist this so any client can reconnect to the work later.\nsavePendingSnapshot(task.snapshotId);\n\nfor await (const snapshot of task.poll({ intervalMs: 1000 })) {\n  renderStatus(snapshot.status);\n  if (snapshot.status === 'completed') renderMessages(snapshot.state.messages);\n}\n```\n\nThis makes long research jobs, multi-step planning, and tool-heavy workflows practical without holding a connection open or building a separate job queue.\n\nWhen one prompt cannot do everything well, you can split work across specialized agents and let an orchestrator combine their results. The `Agents`\n\nmiddleware injects a delegation tool for each sub-agent, so the orchestrator model can route parts of a request to the right specialist. Subagents with Genkit give you full control and the ability to implement your own orchestration.\n\n``` python\nimport middlewarex \"github.com/firebase/genkit/go/plugins/middleware/exp\"\n\ncoordinator := genkit.DefineAgent(g, \"coordinator\",\n    aix.InlinePrompt{\n        ai.WithSystem(\"Delegate to specialists, inspect their results, then answer the user.\"),\n        ai.WithUse(\n            &middlewarex.Agents{\n                Agents:           []aix.AgentRef{researcher.Ref(), coder.Ref()},\n                MaxDelegations:   5,\n                ArtifactStrategy: middlewarex.ArtifactStrategySession,\n            },\n            &middlewarex.Artifacts{Readonly: true},\n        ),\n    },\n)\n```\n\nDelegation shows up as ordinary tool activity in the orchestrator's stream, and specialist artifacts can merge into the parent session so the final answer can build on what each specialist produced.\n\nGenkit agents are an application primitive, built to live inside a full-stack, user-facing app. Consider the [Agent Development Kit (ADK)](https://google.github.io/adk-docs/) instead when:\n\nServer-managed agents store snapshots through a session store, and Genkit ships several so you can match the store to where you are running:\n\nAgents are first-class in the Genkit [Developer UI](https://genkit.dev/docs/devtools/). The new **Agent Runner** lets you start a conversation, send turns, watch streamed output and state updates, drive tool interrupts, and inspect snapshots, all without writing a client. It is the fastest way to exercise an agent while you are building it and to reproduce a conversation when you are debugging one.\n\nThe Agents API turns the repeated plumbing of conversational, full-stack AI into something you configure rather than rebuild. Define an agent on the server, give it a store when you want persistence, and drive it from your frontend with the same chat() interface through remoteAgent().\n\nHead to the [Full-stack agents documentation](https://genkit.dev/docs/agents/overview/) to dive in, or [get started with Genkit](https://genkit.dev/docs/get-started/) if you are new to the framework. The API is in Beta, so we want your feedback: [file an issue](https://github.com/genkit-ai/genkit/issues) with what you build and what you would change.\n\nHappy coding! 🚀", "url": "https://wpnews.pro/news/build-agentic-full-stack-apps-with-genkit", "canonical_source": "https://developers.googleblog.com/build-agentic-full-stack-apps-with-genkit/", "published_at": "2026-07-01 16:21:09.745855+00:00", "updated_at": "2026-07-01 16:21:12.330111+00:00", "lang": "en", "topics": ["ai-agents", "ai-tools", "developer-tools", "large-language-models", "generative-ai"], "entities": ["Genkit", "Google", "Firestore", "TypeScript", "Go", "Dart", "Python", "Gemini"], "alternates": {"html": "https://wpnews.pro/news/build-agentic-full-stack-apps-with-genkit", "markdown": "https://wpnews.pro/news/build-agentic-full-stack-apps-with-genkit.md", "text": "https://wpnews.pro/news/build-agentic-full-stack-apps-with-genkit.txt", "jsonld": "https://wpnews.pro/news/build-agentic-full-stack-apps-with-genkit.jsonld"}}