Build an AI Chatbot From Any Website

March 12, 2026
6 min read
Written by Jignesh
Build an AI Chatbot From Any Website

If you don’t know about Chatbase

If you don’t know about Chatbase, it’s basically a tool that lets you turn your website into an AI chatbot.

You provide your website URL, the platform scrapes your content, and then you can embed a chat widget on your site so users can ask questions about your product, documentation, or services.

Instead of navigating through multiple pages, users can simply ask questions like:

“How do I contact support?”

“What features does your product have?”

“Where can I find pricing information?”

The chatbot answers based on the content of your website.

This idea is actually very useful. For SaaS products, documentation websites, or startups, it improves the user experience because visitors can get answers instantly without searching manually.

But when I tried to use Chatbase for one of my projects, I ran into a few problems.


The Problem With Chatbase

The biggest issue for me was the pricing.

Many AI tools start simple but quickly become expensive with monthly subscriptions. Chatbase follows a similar model.

If you only want to experiment or build a small chatbot for your site, paying a large monthly fee doesn’t make much sense.

Another issue is control.

Most hosted tools require you to upload your data to their platform and depend completely on their infrastructure. That means you have limited flexibility if you want to customize the system or integrate it deeply into your own stack.

As a developer, I prefer tools that I can run myself, inspect, and modify if needed.

Sometimes you just want something simple that works locally and integrates easily with your own codebase.

So I started thinking about building something myself.


The Idea: A Simple CLI Tool

The idea was very simple.

What if there was a command line tool that could:

• Scrape a website

• Turn the content into a knowledge base

• Connect that knowledge base to an AI model

• Provide ready-to-use components for a chatbot

And most importantly, make it free and open source.

That idea eventually became a project I built called Bot4site.

The goal was to make the workflow extremely simple.

Convert any website into an AI chatbot with just a few commands.


How Bot4site Works

Bot4site is a Node.js CLI tool that automates the entire process.

The workflow looks like this:

  1. Scrape your website content
  2. Convert it into a structured knowledge base
  3. Connect it to an AI model
  4. Allow users to chat with that knowledge

Instead of sending raw HTML pages to the AI every time, the content is scraped once and stored locally as a markdown knowledge base.

Example file:

ai-knowledge.md

This file becomes the context for the AI agent.

So when a user asks a question, the AI answers based on that knowledge instead of searching the internet.

Bot4site also supports multiple AI providers so developers aren’t locked into one ecosystem.

Supported providers include:

• OpenAI

• Google Gemini

• Anthropic Claude

This gives flexibility depending on pricing or preferred models.


Installing and Running Bot4site

You can run the tool directly using npx.

npx bot4site setup

This launches an interactive setup process.

During setup you will be asked to configure things like:

• AI provider

• Model

• API keys

• Website URL

• Number of pages to scrape

Once the setup finishes, the CLI generates a configuration file.

Example configuration:

{
"model": "gemini-3.1-flash-lite",
"provider": "google",
"url": "https://example.com/",
"limit": 20,
"systemInstruction": "You are a helpful customer support agent for my website."
}

Sensitive API keys are stored separately in a .env file.

Example environment variables:

OPENAI_API_KEY
GEMINI_API_KEY
ANTHROPIC_API_KEY
FIRECRAWL_API_KEY


Website Scraping

When you run the setup command, Bot4site automatically scrapes the website content.

It uses Firecrawl to extract and clean the pages and convert them into markdown.

The scraped content is saved locally as:

ai-knowledge.md

This file becomes the knowledge base that the AI uses to answer questions.

Because the data is stored locally, you have full control over it and can modify it if needed.


Adding a Chat Widget to Your Website

If you're building a React application, Bot4site can generate ready-to-use components.

Just run the following command:

npx bot4site component

You can then choose which components you want to generate, such as:

• Chat Widget

• Sticky Chat Button

The CLI will automatically create a components folder in your project.

Example structure:

components/
ChatWidget.tsx
ChatButton.tsx

You can import these components directly into your React application and instantly add a chatbot UI to your website.

This removes the need to design the entire chat interface from scratch.


Testing the AI Directly in the Terminal

Before integrating the chatbot into your application, you can test the AI agent directly from the command line.

Run:

npx bot4site chat

This opens a CLI chat session where you can interact with your website’s knowledge base.

Example:

You: How do I contact support?

AI: You can contact support through the contact form on the website or by emailing support@example.com.

This is useful to verify that the scraping and configuration are working correctly before deploying the chatbot.


Using Bot4site Programmatically

Bot4site can also be used directly in your backend code.

Example usage:

import { askAgent } from 'bot4site';

const text = await askAgent("How do I contact support?");
console.log(text);

You can also override the AI provider or model for specific requests.

Example:

const response = await askAgent("Review this code", {
provider: "anthropic",
model: "claude-opus-4.6",
systemInstruction: "You are a code reviewer."
});

This makes it flexible enough to integrate into APIs, dashboards, or internal tools.


Example With Next.js

You can integrate Bot4site with a Next.js app using server actions.

Server side:

'use server';

import { askAgent } from 'bot4site';

export async function getAnswer(question) {
const text = await askAgent(question);
return { text };
}

Client side:

'use client';

import { useState } from 'react';
import { getAnswer } from './actions';

export default function Home() {
const [answer, setAnswer] = useState("");

return (
<button
onClick={async () => {
const { text } = await getAnswer("What are the main features?");
setAnswer(text);
}}
>
Ask AI
</button>
);
}

This allows you to build custom AI assistants inside your own web applications.


Final Thoughts

AI chatbots for websites are becoming more common because they dramatically improve how users interact with products and documentation.

However, many tools in this space rely on expensive subscriptions or closed platforms.

Bot4site is my attempt to build a simpler alternative.

A tool that developers can run locally, customize, and integrate directly into their own projects.

It’s still early, but it already works well for many common use cases.


Try It Yourself

If you want to try it out, you can check out the project using the links below:

GitHub Repository

NPM Package

YouTube Demo Video


If you find it useful, feel free to contribute. You can raise feature requests, report bugs, or submit pull requests on the GitHub repository.

And if you want to see the full walkthrough, I’ve also created a video explaining how everything works step by step.

#turn website into ai chatbot#chatbase alternative#free chatbase alternative#build ai chatbot from website#website ai chatbot tutorial#create ai chatbot for website#ai chatbot using website data#open source ai chatbot tool#bot4site npm package#ai chatbot for documentation website#ai chatbot for saas website#website scraping ai chatbot#nodejs ai chatbot tutorial#react ai chatbot widget#ai chatbot developer tool#build chatbot with website content