β¨ INTRODUCTION
π§βπ» Meet Course Instructor
π Course Prerequisites
π·οΈ Recommended VSCode Extensions
π· Recommended OS
π· DEMO: ChatGPT Clone AI ChatBot Demo
β
Intro To The AiHiPUniversity Platform
π½οΈ Recommended - CODING AI Support Tools
π Become A Successful Developer Tips
π Course Target Audience
βͺοΈ VIDEO
π Lesson 1: Planning and Designing
π 1. Planning the Layout & Functionality
π DONE FEATURES
π PENDING FEATURES
π 2. Designing the UI and UX
π 3. Understand Best Practices for Building AI Chatbot
π 4. Planning Project Folder Structure
π 5. Decide on Web Development Techstack To Use
π Exercise 1
π¬ STUCK? GET SUPPORT HERE 1
π¨ Lesson 2: Setup Project with Git
π¨ 1. Create Project in Git using Github
π¨ 2. Clone GitHub Repo to PC
π¨ 3. Setting up Project Folder in IDE(VSCode)
π¨ Exercise 2
π¬ STUCK? GET SUPPORT HERE 2
π Lesson 3: Backend (ExpressJs) With OpenAI API
π 1. Setting up an OpenAi API key
π 2. Setting up ExpressJs Server
π§ Create Server folder
π§ Inside the Server folder
π§ Create package.json in Server folder
π§ Install Node Packages in package.json
π©Quick Sidenote 2
π§ Next step
π 3. Using ExpressJs to make API Request
π 4. Creating API Endpoint for SveltKit Frontend
π 5. Run Server to Test ExpressJs Backend
π My Coding Questions to ChatGPT AI
β
ChatGPT Response to My Coding Questions
βοΈ Testing the Express.js backend server
π Exercise 3
π¬ STUCK? GET SUPPORT HERE 3
π₯ Lesson 4: Frontend (SvelteKit)- Build Chatbot UI
π₯ 1. Setting up Sveltekit for frontend
π₯ 2. Create ChatGPT UI with Svelte Components
π What Is Prompt Engineering in AI Development
π SvelteKit Question1 to ChatGPT AI
β
ChatGPT Response to SvelteKit Question1
π½οΈ Using the AI Code 1
π₯ 3. Connecting SvelteKit to ExpressJs Backend
π SvelteKit Question2 to ChatGPT AI
β
ChatGPT Response to SvelteKit Question2
π SvelteKit Question3 to ChatGPT AI
β
ChatGPT Response to SvelteKit Question3
π₯ 4. Send User Input to Openai GTP-3 AI API
π₯ 5. Display User Questions/AI Chatbot Responses
π₯ 6. Store User/AI chatbot's Chats in Local Storage
π₯ 7. ReDesigning ChatGPT Clone AI Chatbot UI
π₯ 8. Testing the Sveltekit Frontend in localhost
π₯ Exercise 4
π¬ STUCK? GET SUPPORT HERE 4
ποΈ Lesson 5: Adding Security Features to AI ChatBot
ποΈ 1. Discuss Vulnerabilities in the AI ChatBot
ποΈ 2. Implement error handling and debugging
ποΈ 3. Fix security loopholes in the AI ChatBot
ποΈπ Fixed Security Patches 1
ποΈπ Fixed Security Patches 2
ποΈπ Fixed Security Patches 3
ποΈπ Additional Security Features To Add
ποΈ 4. Test Security features added to the AI ChatBot
ποΈ Exercise 5
π¬ STUCK? GET SUPPORT HERE 5
π Lesson 6: Deployment of ChatGPT-like Ai Chatbot
π 1. Preparing project for deployment
π 2. Deploy ExpressJs Backend server to a web server
π 3. Deploy Sveltekit Frontend to a web server
π 4. Final Test and debug the AI ChatBot Website
π Exercise 6
π¬ STUCK? GET SUPPORT HERE 6
π¨ FINAL PROJECT
π¦Ί CERTIFICATION
π₯ Course Git Repository
π¬ STUCK? GET SUPPORT HERE 7
π Credit & Referencies
π SUB-REFERENCES - Openai API Updates
ποΈπ Behind-The-Scene Dev Fun Facts
ποΈ Fun Course Stats
ποΈ Phase 1
π§ Phase 2