With the growing number of large language models (LLMs) available, it's becoming more important for developers and users alike to compare how different models respond to the same prompts. Whether you're evaluating models for accuracy, speed, or style, being able to see their outputs side-by-side can help guide your decisions. In this post, we'll…
AI models are evolving fast, and developers are increasingly looking for ways to integrate multiple models into their applications, giving users the flexibility to choose the one that best fits their needs. In this post, we'll walk through how to build a simple multi-model chat interface using Next.js and the @ai-sdk package, allowing users to…
In the previous guide, we built a streaming chat interface using the raw OpenAI API. It worked, but required a fair bit of manual work: decoding text streams, managing message state, and wiring everything together from scratch. That approach is great for learning, but in real-world projects, you often want something more ergonomic, robust, and…
In this tutorial, you'll build a simple AI chat app using React.js on Next.js and the OpenAI API. You'll learn how to set up an API route to send prompts to OpenAI and build a frontend that displays the conversation in real time. By the end, you'll have a working full-stack AI application that you can expand upon. In addition, we will also learn…
Since it became possible to create full-stack applications with React, the question of authorization has been a recurring topic. In this extensive guide, I want to explore how authorization can be implemented in Next.js when using React Server Components and Server Actions in Next's App Router. While this guide follows the event of the recent…
Every year I discuss the most important trends in the world of React. In this article, we will explore the React trends in 2025 that you should be aware of. Whether you are a beginner or an experienced developer, these trends will help you stay up-to-date with the latest developments in the React ecosystem. React Server Components We've come a long…
In this tutorial we want to explore how to show toast notifications for Server Actions in React when using React's useActionState Hook in combination with useEffect. Feel free to check out the whole implementation in the GitHub repository . Return Toast Response from Server Action In preparation for displaying toast notifications, we need to…
In this tutorial we want to explore how to show toast notifications for Server Actions in React when using React's useActionState Hook. Note: This tutorial has been created following an insightful discussion with Sebastien on X. He suggested an improved solution to my original approach , which we'll explore together. A big thanks to Sebastien…
User feedback is an essential part of a great user experience. In this tutorial, we'll explore how to implement toast notifications when calling Server Actions in React. Therefore we'll create a React Server Component that fetches user data and then allow users to upvote, downvote, and delete entries from a Client Component. Each React Server…
Want to build a chatbot in your Node.js terminal using JavaScript? We will walk through the most basic scenario when using LangChain and OpenAI. In this guide, we'll walk through creating a simple CLI chatbot using Node.js. You'll learn how to interact with OpenAI's language model and process user input in a terminal-based interface. By the end…
