KO | EN

GitLite

Minimalist Open Source Repository Search Engine

gitlite — search

#typescript #ai-agents #developer-tools #cli #codex #claude-code #react #mcp #open-source #deepseek-harness #dsh-plugin #ai

website-chat-demo

★ 95 Open GitHub ↗

An example on how to integrate an AI chat with voice and text interactions to a website or app

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Alan AI: Text AI Chat for Web

[Alan AI Platform](https://alan.app/) • [Alan AI Studio](https://studio.alan.app/register) • [Docs](https://alan.app/docs)

This sample project demonstrates how to quickly add a text AI chat to your web page, website or web app.

## Features

- Conversational AI powered by LLMs and generative AI
- Automatic question answering
- Actionable AI: performing actions with voice and text commands
- Voice and text input modes
- Customizable chat interface

## Supported web frameworks

* React
* Angular
* Vue
* Ember
* Electron 
* JavaScript

## How to start

To get started with the project:

1. Clone the repository to your local machine: `https://github.com/alan-ai/website-chat-demo`. 
2. Open the `index.html` page in a browser.
3. In the bottom right corner of the page, click the chat button and type the following commands in the chat:

* `Who are you?`
  * `What is your experience with AI?`
  * `Do you have a portfolio?`
  * `Show iOS apps/Show all apps`
  * `Open a resume`
  
## Dialog script

To view the dialog script used in this project, do either of the following:

- View the dialog scripts in the `dialog-scripts` folder
- <a href="https://studio.alan.app/register" target="_blank">Sign up for Alan AI Studio</a> and select **Create project** > **Web Chat Example**

## What's inside

The project is structured in the following way:

* `index.html`: web page with the web chat added
* `dialog-scripts`: dialog scripts for the web chat conversational experience
* `assets`: content-related assets (images, PDFs, JS files and so on)

You can replace the Alan AI SDK key with your own key in the `index.html` file, the `Alan button block` section.

## Live demo

Check out the live web chat demo here: [https://alan-ai.github.io/website-chat-demo/](https://alan-ai.github.io/website-chat-demo/)

## Docs

Find out how to enable and customize the text chat with Alan AI here: [Enabling the text chat](https://alan.app/docs/usage/button/customization/#enabling-the-text-chat).

## Have questions?

If you have any questions or something is missing in the documentation:
- Join [Alan AI Slack community](https://app.slack.com/client/TL55N530A) for support
- Contact us at [support@alan.app](mailto:support@alan.app)

website-chat-demo

Explore Similar Repositories

Was this content helpful?

Recent Feedback

Download README