https://github.com/moonhighway/ai-with-react-and-next-js
Getting started with AI in Next.js apps
https://github.com/moonhighway/ai-with-react-and-next-js
Last synced: about 1 year ago
JSON representation
Getting started with AI in Next.js apps
- Host: GitHub
- URL: https://github.com/moonhighway/ai-with-react-and-next-js
- Owner: MoonHighway
- License: mit
- Created: 2024-06-12T17:24:06.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-10-10T22:16:31.000Z (over 1 year ago)
- Last Synced: 2025-03-29T03:32:01.979Z (about 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 83 KB
- Stars: 8
- Watchers: 2
- Forks: 6
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# AI for React Developers
Knowledge of AI tooling is critical for future proofing the careers of React developers, and the Vercel suite of AI tools is an approachable on-ramp. In this course, we’ll take a closer look at the Vercel AI SDK and how this can help React developers build streaming interfaces with JavaScript and Next.js.
## Workshop Installation Instructions
Before you attend, it would be good to make sure you have the following:
1. This repo cloned or downloaded.
2. A code editor of some sort.
3. [Node.js version 20+](https://nodejs.org/en)
4. Optional: An [OpenAI API Key](https://openai.com/index/openai-api/). I'll share one that you can use during the workshop if you'd prefer.
## Instructor Info
- Eve Porcello, eve@moonhighway.com, [@eveporcello](https://x.com/eveporcello)
## Topics
- Understanding AI in Node Projects
- Choosing a LLM
- Creating a React Project with Next.js
- Customizing Streaming Interfaces
- Building Routes
- Creating and Generating Components
- Using Hooks (useChat, useCompletion, useActions, etc)
## Slides
- [Slide Deck](https://www.canva.com/design/DAGH9QpxXh0/DgEc63sNlUWp2wBmMLxqYA/view)
## AI In Node Projects
- [Generating an API Key](https://platform.openai.com/api-keys)
- [Available Models](https://platform.openai.com/docs/models/overview)
- [Example Prompts](https://platform.openai.com/docs/examples)
## Assistants
- [Assistants API Docs](https://platform.openai.com/docs/assistants/overview)
- [Assistants UI](https://platform.openai.com/assistants)
## Next + AI
- [Vercel AI Core](https://sdk.vercel.ai/docs/ai-sdk-core): Text generation, structured objects, tools with LLMs
- [Vercel AI SDK UI](https://sdk.vercel.ai/docs/ai-sdk-ui): Hooks for building chat interfaces
- [Vercel AI RSC](https://sdk.vercel.ai/docs/ai-sdk-rsc): Specific tools for React Server Component Architecture
- [AI SDK Providers](https://sdk.vercel.ai/providers/ai-sdk-providers)
## Copilot Kit
- [Copilot Kit Docs](https://www.copilotkit.ai/)