introducing new Vercel AI SDK

• What is the new frontend AI library?
• How to start new AI web app?

npm i ai

TL;DR:

• build your own custom AI Chat on your website fast
• Streaming First UI Helpers
• edge-ready software development kit for AI apps
• built with React and Svelte.

'use client'

import { useChat } from 'ai/react'

export default function Chat() {
  const { messages, input, handleInputChange, handleSubmit } = useChat()

  return (
    <div>
      {messages.length > 0
        ? messages.map(m => (
            <div key={m.id}>
              {m.role === 'user' ? 'User: ' : 'AI: '}
              {m.content}
            </div>
          ))
        : null}

      <form onSubmit={handleSubmit}>
        <input          
          value={input}
          placeholder="Say something..."
          onChange={handleInputChange}
        />
      </form>
    </div>
  )
}

SDK docs:

sdk.vercel.ai

Vercel AI Playgroud:

sdk.vercel.ai

---

Godspeed

PS. Follow me on Twitter or LinkedIn
https://twitter.com/dom_sipowicz
https://www.linkedin.com/in/dominiksipowicz/