Published 4/2023
MP4 | Video: h264, 1280×720 | Audio: AAC, 44.1 KHz
Language: English | Size: 1.92 GB | Duration: 3h 53m
Use Next JS & OpenAI to build a ChatGPT clone, including mongodb, edge functions, auth0, tailwind css + more! (Next v13)
What you’ll learn
Increase your value as a web developer by learning how to integrate AI
Build a ChatGPT clone with OpenAI and Next JS
Implement user accounts in your Next JS apps with Auth0
Style your Next JS apps with Tailwind CSS
Store chat history for your ChatGPT clone with MongoDB
Requirements
Basic understanding of React is required – everything else is covered!
Description
Don’t get left behind! Increase your value as a web developer today by learning how to integrate AI in to your projects!Welcome to the ultimate course on how to build your very own ChatGPT clone using the latest web development technologies!In this course, you’ll learn how to create a powerful chatbot that uses the Next.js framework, OpenAI’s cutting-edge natural language processing technology, MongoDB for data storage, Auth0 for user authentication, and Tailwind CSS for beautiful, responsive styling.Our expert instructors will guide you through every step of the development process, from setting up your development environment to deploying your finished chatbot to the web. You’ll learn how to create conversational interfaces, process user input, and generate natural language responses using OpenAI’s powerful language models.With MongoDB, you’ll learn how to store and retrieve user data and chat history, while Auth0 will enable you to secure your application with user authentication and authorization. Finally, you’ll use Tailwind CSS to create a stunning user interface that looks great on any device.This course is perfect for developers who want to expand their skillset and learn how to build complex web applications using the latest technologies. Whether you’re a seasoned web developer or just starting out, our step-by-step approach and easy-to-follow instructions will help you master the skills you need to build your very own ChatGPT clone.So why wait? Sign up now and start building your own ChatGPT clone today!
Overview
Section 1: Introduction
Lecture 1 Introduction
Lecture 2 Project setup
Lecture 3 Udemy ratings & reviews
Lecture 4 Set up the chat route / page
Section 2: Authentication & authorization with Auth0
Lecture 5 Set up auth0 for authentication
Lecture 6 Create auth api routes
Lecture 7 Set up the login and logout state
Lecture 8 Style the homepage with tailwind css
Lecture 9 Implement signup functionality
Lecture 10 Redirect to chat page if logged in
Section 3: Build out the chat page
Lecture 11 Create the basic chat page layout
Lecture 12 Create the ChatSidebar component and add the logout link
Lecture 13 Create the footer and message form
Section 4: Build the OpenAI streaming functionality
Lecture 14 Create an OpenAI API key
Lecture 15 Create the sendMessage endpoint
Lecture 16 Set up the OpenAI API call
Lecture 17 Stream the OpenAI response on the front end
Lecture 18 Create the Message component and display new messages in chat window
Lecture 19 Finish implementing the Message component styles and logic
Lecture 20 Protect the chat routes and pages so only logged in users can access
Lecture 21 Add the loading state to the form
Lecture 22 Refine the OpenAI prompt
Lecture 23 Fix the footer form position and make chat window scrollable
Section 5: Storing chats with MongoDB
Lecture 24 Overview of edge functions
Lecture 25 Set up MongoDB Atlas account
Lecture 26 Set up the createChat endpoint
Lecture 27 Test the createChat endpoint
Lecture 28 Create the getChats endpoint
Lecture 29 Render the list of chats in the sidebar
Lecture 30 Style the chat list in the sidebar
Lecture 31 Implement creating a chat in the sendMessage endpoint
Lecture 32 Create the addMessageToChat endpoint
Lecture 33 Navigate to newly created chat page
Lecture 34 Reload chat list on route change
Lecture 35 Load chat messages for a particular chat
Lecture 36 Render chat messages for a particular chat
Lecture 37 Modify the sendMessage endpoint to cater for existing chats
Lecture 38 Implement conversation history in OpenAI
Section 6: Deploy
Lecture 39 Deploy to vercel
Lecture 40 BONUS!
React developers who want to increase their value as a developer by learning how to create SAAS products and start leveraging the power of AI
Password/解压密码www.tbtos.com
转载请注明：0daytown » Build A Chatgpt Clone Using Next.Js & Openai – Next Js V13