This is a WebRTC-based Voice AI stream application using OpenAI's Realtime API and WebRTC. Project contains /api route and UI components developed with Next.js and shadcn/ui. It supports real-time audio conversations implented in skrivov/openai-voice-webrtc-next with the addition of a hook to abstract the WebRTC handling.

• Next.js Framework: Built with Next.js for server-side rendering and API routes.
• Modern UI: Animated using Tailwind CSS & Framer Motion & shadcn/ui.
• Use-WebRTC Hook: A hook to abstract the OpenAI WebRTC handling.
• Tool Calling: 6 example functions to demonstrate client side tools along with Realtime API: getCurrentTime, partyMode, changeBackground, launchWebsite, copyToClipboard, scrapeWebsite (requires FireCrawl API key)
• Localization: Select language for app strings and the voice agent (English, Spanish, French, Chinese)
• Type Safety: TypeScript with strict eslint rules (optional)

• Deno runtime or Node.js
• OpenAI API Key or Azure OpenAI API Key in .env file

git clone https://github.com/cameronking4/openai-realtime-api-nextjs.git
cd openai-realtime-api-nextjs

Create a .env file in the root directory:

OPENAI_API_KEY=your-openai-api-key

If using Node.js:

npm install

If using Deno:

deno install

npm run dev

deno task start

The application will be available at http://localhost:3000.

1. Open the app in your browser: http://localhost:3000.
2. Select a voice and start the audio session.

Deploy in one-click

Deploy with Vercel

This project is licensed under the MIT License. See the LICENSE file for details.

• OpenAI for their API and models.
• Next.js for the framework.
• Tailwind CSS for styling.
• Simon Willison’s Weblog for inspiration
• Originator: skrivov for the WebRTC and Nextjs implementation