ChatGPT AI Voice Chatbot Build with React and FAST API Combo

Develop a Human Sounding Voice Assistant or Sales Chatbot That Speaks ANY Language Featuring Eleven Labs and ChatGPT AI
ChatGPT AI Voice Chatbot Build with React and FAST API Combo
File Size :
2.26 GB
Total length :
5h 16m



Shaun McDonogh


Last update




ChatGPT AI Voice Chatbot Build with React and FAST API Combo

What you’ll learn

Develop a realistic human sounding chatbot who can take on almost any task
Integrate ChatGPT and Eleven Labs AI into any application
Develop a diverse chatbots with voice, interviewers, sales people, Spanish teachers
Understand how full stack applications with a frontend and backend can work
Get familiar with React and FastAPI technologies
Interact with AI real-time in a fun and exciting way
Understand prompt engineering and the ease of integration into chatbots

ChatGPT AI Voice Chatbot Build with React and FAST API Combo


Must have done some basic programming in Javascript, Python, HTML and CSS.


Develop a human-like voice assistant with ChatGPT and Eleven Labs to make one of the most advanced Chatbots today so that you can prove that not only will coders survive the AI transition happening right now, but that they will thrive.With just some basic knowledge on python and javascript, you are going to build Rachel Chat, a chatbot which uses the power of ChatGPT for conversation, whether it be for sales, teaching you Spanish (or any language), talking about sci-fi movies – whatever your interest and application is.Companies are looking for developers who can build such tools and SAAS startups have a window to be first. If you are curious as to how you can connect new AI technologies to change the world then THIS is the course for you.You will learn:How to work with the Open AI API and Eleven Labs APIHow to integrate React and FastAPI to build efficient and robust full-stack applicationsHow to build a voice assistant that actually sounds human (you can even use your own voice)How to perform prompt engineering so that you can truly leverage and customise the power of AI large language modelsWe are truly excited to see what you develop, so make sure you share your application with the world.See you in class!Shaun


Section 1: Introduction and Resources

Lecture 1 What We Are Building

Lecture 2 About Your Instructor

Lecture 3 Course Structure

Lecture 4 Expectation vs Reality

Lecture 5 Tech Stack – Backend

Lecture 6 Tech Stack – Frontend

Lecture 7 Tech Stack – Styling

Lecture 8 CODE Package Resources

Lecture 9 Resource Instructions

Lecture 10 WARNING: OpenAI API Occasional Delay

Section 2: Extra: (OPTIONAL) – React Crash Course

Lecture 11 MUST READ

Lecture 12 Create React App with Vite

Lecture 13 Install Tailwind

Lecture 14 What We Are Building

Lecture 15 Your First Component

Lecture 16 What Just Happened

Lecture 17 Optional Reading – More On Technical Behind the Scenes

Lecture 18 Styling Our First Button

Lecture 19 Running a Parent Function From a Child (Passing Props)

Lecture 20 Monitor State and Handle Side Effects with useEffect

Lecture 21 BetBox Structuring

Lecture 22 Adding BetButton Functionality

Lecture 23 Random Org URL

Lecture 24 Send Axios Fetch Request

Lecture 25 Final Updates and Finishing Touches

Lecture 26 React Learning Next Steps

Section 3: Environment Setup – Frontend and Backend

Lecture 27 VS Code Recommendation and Plugins

Lecture 28 Folder Setup

Lecture 29 Python and Node Version Installation Checks

Lecture 30 FastAPI Python Backend Preparation and Package Installations

Lecture 31 Frontend JSON Script

Lecture 32 React Frontend Preparation and Package Installations

Lecture 33 Tailwind CSS Integration

Lecture 34 API Keys

Lecture 35 Setting Up Environment Variables

Section 4: Backend Build – Working with AI

Lecture 36 Important Note – Google Chrome

Lecture 37 Backend Initialisation with Imports and CORS

Lecture 38 About Docs and Endpoints

Lecture 39 Record Voice Snippet

Lecture 40 Convert Voice to Text with Whisper

Lecture 41 Prompt Engineering ChatGPT

Lecture 42 Receiving ChatGPT Response

Lecture 43 Store and Reset Message Data

Lecture 44 Eleven Labs API Docs Walkthrough

Lecture 45 Giving Rachel a Human Sounding Voice

Lecture 46 Frontend Preparation and Troubleshooting Discussion

Section 5: Frontend – React Web Application

Lecture 47 Important – Please Read

Lecture 48 Structuring Controller Component

Lecture 49 Title Component – Part I (Reset Function)

Lecture 50 Title Component – Part II (Render Completion)

Lecture 51 Controller Recorder Container

Lecture 52 Adding Audio Recording Functionality

Lecture 53 Animating a Record Icon

Lecture 54 Playing Back Audio and Blob Encoding

Lecture 55 Hello Rachel

Lecture 56 Full User Interaction and Tweaking

Lecture 57 Making Production Ready

Section 6: Next Steps

Lecture 58 Further Prompt Engineering and Use Cases

Lecture 59 Discord and Links

Lecture 60 Next Steps

Beginner developer and AI enthusiasts who want to build valuable applications to bring to themselves or to the marketplace.,SAAS developers who want to monetise on the booming trend of AI

Course Information:

Udemy | English | 5h 16m | 2.26 GB
Created by: Shaun McDonogh

You Can See More Courses in the Developer >> Greetings from

New Courses

Scroll to Top