Skip to main content

LangChain LangServe Adapter

LangChain is a new and popular framework for building services powered by Large Language Models. It enables applications that are context-aware. It also provides a library called LangServe to create standardized APIs that can be used to interact with LangChain runnables.

This example illustrates how to use nlux to connect to a LangChain runnable made available through LangServe.

Learn More About nlux LangChain Adapter
import {AiChat} from '@nlux/react';
import {useChatAdapter} from '@nlux/langchain-react';
import '@nlux/themes/nova.css';

export default () => {
  // LangServe adapter that connects to a demo LangChain Runnable API
  const adapter = useChatAdapter({
    url: 'https://pynlux.api.nlux.ai/pirate-speak'
  });

  return (
    <AiChat
      adapter={adapter}
      personaOptions={{
        bot: {
          name: 'FeatherBot',
          picture: 'https://nlux.ai/images/demos/persona-feather-bot.png',
          tagline: 'Yer AI First Mate!',
        },
        user: {
          name: 'Alex',
          picture: 'https://nlux.ai/images/demos/persona-user.jpeg'
        }
      }}
      layoutOptions={{
        height: 320,
        maxWidth: 600
      }}
    />
  );
};

This example focuses on the frontend integration between LangServe and nlux. If you are interested in seeing the backend code that enabled this demo, you can check this repository, which contains Python LangServe API code.