Introducing nlux: The AI Chatbot Library for React and JS Developers

Conversational AI is taking off, and chatbots powered by large language models (LLMs) like ChatGPT are becoming a must-have for many apps and websites. As a React developer, you want a simple way to build a great chat interface backed by these incredible LLMs. That's where nluxnlux comes in.

What is nluxnlux?

nluxnlux is an open-source React and Vanilla JS library that makes it easy to integrate LLMs like ChatGPT into your app and create natural conversational experiences for your users. With nluxnlux, you get:

• Quick Setup - nluxnlux has zero dependencies and integrates seamlessly with Create React App. You can be up and running with a basic chatbot interface in minutes.
• Customizable and Extendable - While nluxnlux comes with great defaults, you can customize every part of the UI with CSS and React components. It's also easy to extend by adding your own adapters to connect to different chatbot APIs.
• Optimized Performance - nluxnlux is built for speed. Features like message streaming give a smooth conversational experience. The vanilla JS version also allows for blazing fast non-React apps.
• Full-Featured - Out of the box, nluxnlux supports system messages, theming, attachments, user inputs, and more. The API is designed to be comprehensive yet simple.
• Cross-Platform - Use nluxnlux to build for the web, mobile, desktop apps, you name it. The React components provide a consistent interface everywhere.

So if you're looking to add an AI assistant or chatbot to your app, look no further than nluxnlux. Its simplicity, customizability, and focus on performance makes it the perfect choice.

Getting Started

To get started, you can check out the React JS NPM package here or the Vanilla JS NPM package here. Both NPM packages have detailed documentation and examples on how to use them.

Here is how to start:

npm install @nlux/react @nlux/openai-react

npm install @nlux/react @nlux/openai-react

import {AiChat} from '@nlux/react';
import {useAdapter} from '@nlux/openai-react';
 
const App = () => {
    const chatGptAdapter = useAdapter('openai/gpt', {
        apiKey: 'YOUR_OPEN_AI_API_KEY',
        // 👇 Instruct ChatGPT how to behave (optional)
        systemMessage:
            'Act as a Nobel Prize in Physics winner who is ' +
            'helping a PHD student in their research'
    });
 
    return (
        <AiChat
            adapter={chatGptAdapter}
            promptBoxOptions={{
                placeholder: 'Ask me anything about nuclear physics!'
            }}
        />
    );
}

import {AiChat} from '@nlux/react';
import {useAdapter} from '@nlux/openai-react';
 
const App = () => {
    const chatGptAdapter = useAdapter('openai/gpt', {
        apiKey: 'YOUR_OPEN_AI_API_KEY',
        // 👇 Instruct ChatGPT how to behave (optional)
        systemMessage:
            'Act as a Nobel Prize in Physics winner who is ' +
            'helping a PHD student in their research'
    });
 
    return (
        <AiChat
            adapter={chatGptAdapter}
            promptBoxOptions={{
                placeholder: 'Ask me anything about nuclear physics!'
            }}
        />
    );
}

An Open-Source Project

nluxnlux is an open-source project. We welcome contributions from the community. If you have an idea for a new feature or want to fix a bug, feel free to open an issue or submit a pull request. We're excited to see what you build with nluxnlux!

GitHub Repository: github.com/nluxai/nlux

You can ask questions or get help in the GitHub Discussions section.