DEV Community

Cover image for introducing new Vercel AI SDK
Dom Sipowicz
Dom Sipowicz

Posted on

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>
  )
}
Enter fullscreen mode Exit fullscreen mode

SDK docs:

Vercel AI Playgroud:


Godspeed

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

Top comments (0)