Vanilla JavaScript Chat Application using Cloudflare Workers AI

A web based chat interface built on Cloudflare Pages that allows for exploring Text Generation models on Cloudflare Workers AI. Design is built using tailwind.

This demo makes use of LocalStorage to maintain state. We have better solutions available (moar coming soon).

This is a template repository. Please feel free to create your own repository from this one by using the "Use this template" button. It's right next to the ⭐️ this repo button, which you could totally do as well if you wanted to.

This is, like all of us, a Work in Progress.

Installation

npm install
# If this is your first time here
npx wrangler login

Develop

This uses the local Vite server for rapid development

npm run dev

Preview

This builds and runs in Wrangler your site locally, just as it will run on production

npm run preview

Deploy

This hosts your site on Cloudflare Pages

npm run deploy

Debug

npx wrangler pages deployment tail

Advanced

If you are on a Mac, you can generate the list of models in script.js by running the following commands:

# If this is your first time here. You won't regret it.
brew install jq

# Filter all Text Generation models into "ga" and "beta"
npx wrangler ai models --json | jq ' 
  reduce .[] as $item (
    {beta: [], ga: []};
    if ($item.task.name == "Text Generation") then
      if ($item.properties | any(.property_id == "beta" and .value == "true")) then
        .beta += [$item.name]
      else
        .ga += [$item.name]
      end
    else
      .
    end
  ) |
  .beta |= sort |
  .ga |= sort
'

craigsdennis / vanilla-chat-workers-ai