DEV Community

Cover image for I made Swagger Chatbot (every backend servers also can do it)
Jeongho Nam
Jeongho Nam

Posted on • Edited on

7 4 4 4 4

I made Swagger Chatbot (every backend servers also can do it)

Preface

The above demonstration shows Shopping A.I. chatbot built with Swagger document.

As you can see, in the Shopping A.I. chatbot application, the user can do everything written in the Swagger documents just by conversation texts. Searching products, taking orders, checking delivery status, user can do these things by chatting texts.

Just by delivering the Swagger document, Super A.I. chatbot performing the LLM (Large Language Model) function calling is automatically composed. The Super A.I. chatbot will select proper functions defined in the Swagger document by analyzing conversation contexts with the user. And then Super A.I. chatbot requests the user to write arguments for the selected functions by conversation texts, and actually calls the API function with the argument. This is the key concept of the Nestia A.I. chatbot.

In other words, every backend servers can be conversed to the A.I. chatbot. In the new A.I. era, you no more develop the full level GUI (Graphical User Interface) application like before. Just prepare TypeScript class with enough documentations, and let the A.I. chatbot to do the rest.

Even though the A.I. chatbot can't conquer every frontend developments, it can replace many things, and more efficient and user-friendly than the traditional GUI applications. This concept is called Super A.I. chatbot, and it will change the application development ecosystem a lot.

Playground

Nestia Chat Playground

You can test your backend server's A.I. chatbot with the following playground.

Upload your Swagger document file to the playground website, and start conversation with your backend server. If your backend server's documentation is well written so that the A.I. chatbot quality is satisfiable, you can start your own A.I. chatbot service from the next section #Application Development.

Application Development

import { NestiaAgent } from "@nestia/agent";
  import { NestiaChatApplication } from "@nestia/chat";
import {
  HttpLlm,
  IHttpConnection,
  IHttpLlmApplication,
  OpenApi,
} from "@samchon/openapi";
import OpenAI from "openai";
import { useEffect, useState } from "react";

export const ShoppingChatApplication = (
  props: ShoppingChatApplication.IProps,
) => {
  const [application, setApplication] =
    useState<IHttpLlmApplication<"chatgpt"> | null>(null);
  useEffect(() => {
    (async () => {
      setApplication(
        HttpLlm.application({
          model: "chatgpt",
          document: OpenApi.convert(
            await fetch(
              "https://raw.githubusercontent.com/samchon/shopping-backend/refs/heads/master/packages/api/customer.swagger.json",
            ).then((r) => r.json()),
          ),
        }),
      );
    })().catch(console.error);
  }, []);
  if (application === null)
    return (
      <div>
        <h2>Loading Swagger document</h2>
        <hr />
        <p>Wait for a moment please.</p>
        <p>Loading Swagger document...</p>
      </div>
    );

  const agent: NestiaAgent = new NestiaAgent({
    provider: {
      type: "chatgpt",
      api: props.api,
      model: "gpt-4o-mini",
    },
    controllers: [
      {
        protocol: "http",
        name: "main",
        application,
        connection: props.connection,
      },
    ],
    config: {
      locale: props.locale,
    },
  });
  return <NestiaChatApplication agent={agent} />;
};
export namespace ShoppingChatApplication {
  export interface IProps {
    api: OpenAI;
    connection: IHttpConnection;
    name: string;
    mobile: string;
    locale?: string;
  }
}
Enter fullscreen mode Exit fullscreen mode

Developing Super A.I. chatbot is very easy. Load your swagger document, and compose OpenAI functino calling schema by HttpLlm.application() function of @samchon/openapi library. And render <NestiaChatApplication /> component with the schema.

Then you can start conversation with your backend server. Have a good time with your backend server, and feel the new A.I. era.

Make your own A.I. chatbot

Above @nestia/agent and @nestia/chat libraries are just for testing and demonstration. I’ve made them to prove a conncept that every TypeScript classes can be conversed with the A.I. chatbot, and typia / nestia are especially efficient for the A.I. chatbot development purpose.

However, @nestia/agent support only OpenAI, and has not optimized for specific purpose. As it has not been optimized without any RAG (Retrieval Augmented Generation) models, it may consume a lot of LLM cost than what you may expected. Therefore, use the @nestia/agent for studying the A.I. chatbot development, or just demonstrating your TypeScript class before the production development.

When developing your own A.I. chatbot, you need to learn how to converse the OpenAPI document to LLM function calling schema. Visit @samchon/openapi repository, and read README document of it. Then you may easily understand.

Image description

Next Episode

I'll introduce a new open source A.I. chatbot builder platform everyone can use even containing someone who does not know programming at all.

API Trace View

How I Cut 22.3 Seconds Off an API Call with Sentry 🕒

Struggling with slow API calls? Dan Mindru walks through how he used Sentry's new Trace View feature to shave off 22.3 seconds from an API call.

Get a practical walkthrough of how to identify bottlenecks, split tasks into multiple parallel tasks, identify slow AI model calls, and more.

Read more →

Top comments (0)

The Most Contextual AI Development Assistant

Pieces.app image

Our centralized storage agent works on-device, unifying various developer tools to proactively capture and enrich useful materials, streamline collaboration, and solve complex problems through a contextual understanding of your unique workflow.

👥 Ideal for solo developers, teams, and cross-company projects

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay