Build AI Apps with ChatGPT, DALL-E, and GPT-4 โ€“ Full Course for Beginners

freeCodeCamp.org

This course will teach you how to build AI-powered apps with the ChatGPT, Dall-E and GPT-4 APIs. Go here to try the interactive browser-version: https://scrimba.com/learn/buildaiapps

โœ๏ธ This course was created by Tom Chant, a teacher at Scrimba. If you have any feedback to Tom, please reach out to him on Twitter here:
https://twitter.com/tpchant

Also, follow Scrimba on YouTube here: https://www.youtube.com/c/Scrimba

We recommend that you learn basic HTML, CSS, and JavaScript before taking this course. Here are two free courses that will get you up to speed:
๐Ÿ”— HTML & CSS: https://scrimba.com/learn/htmlandcss
๐Ÿ”— JavaScript: https://scrimba.com/learn/learnjavascript

โญ๏ธ Code โญ๏ธ
๐Ÿ”— Download via Scrimba: https://scrimba.com/learn/buildaiapps

๐Ÿ’ซ Links mentioned in course:
๐Ÿ”— GPT-4 waiting list: https://scrimba.com/links/gpt4-waitlist-openai
๐Ÿ”— OpenAI Home: https://scrimba.com/links/openai
๐Ÿ”— OpenAI Docs: https://scrimba.com/links/openai-docs-intro
๐Ÿ”— OpenAI Completions endpoint docs: https://scrimba.com/links/openai-completions-docs
๐Ÿ”— GPTTools.com model comparison: https://scrimba.com/links/open-ai-comparison-tool
๐Ÿ”— OpenAI Playground: https://scrimba.com/links/open-ai-playground
๐Ÿ”— Dall-E: https://scrimba.com/links/dall-e-openai
๐Ÿ”— OpenAI endpoint compatibility table: https://scrimba.com/links/chatgpt-endpoint-compatibility
๐Ÿ”— GPT-4 Chatbot conversation object format: https://scrimba.com/links/chatgpt-object-format
๐Ÿ”— Data used to fine-tune We-Wingit Chatbot: https://scrimba.com/links/we-wingit-data-csv
๐Ÿ”— Firebase home: https://scrimba.com/links/firebase-home
๐Ÿ”— Firebase .val() method: https://scrimba.com/links/firebase-val-method
๐Ÿ”— Object.values MDN: https://scrimba.com/links/object-dot-values
๐Ÿ”— Netlify: https://scrimba.com/links/netlify-home

โญ๏ธ Contents โญ๏ธ
0:00:00 Introduction
0:01:19 Course Intro
0:04:56 MoviePitch intro
0:07:53 The Boilerplate
0:11:26 Getting an OpenAI API Key
0:13:32 Getting info for fetch request
0:15:14 Building an OpenAI fetch request
0:20:23 The first AI fetch request
0:26:41 Models
0:30:18 Tools
0:34:03 Refactor to use dependency l – env variable
0:38:11 Refactor to use dependency ll – The dependency
0:41:07 Refactor to use dependency lll – update fetchReply
0:44:40 Take out of Scrimba
0:46:45 Personalising the message
0:53:04 Tokens
0:57:09 fetchSynopsis
1:03:44 Aside – few shot approach
1:10:45 Aside – few shot approach ll
1:13:42 Refactor fetchSynopsis
1:21:00 Architecture
1:23:23 Title and Temperature
1:31:52 Reaching for the stars
1:37:52 Aside – createImage
1:46:56 fetchImagePrompt
1:54:21 Displaying the image and finishing off the UX
2:03:16 OutroKnowItAll: GPT-4 Chatbox2:06:47 KnowItAll Intro
2:09:40 Starter Code
2:13:10 Aside: How ChatGPT models work for chatbots
2:18:24 Conversation and instructions
2:20:21 Add user input to conversation array
2:23:06 The createChatCompletion endpoint
2:24:38 The model and object
2:28:46 Render the output, update the array
2:33:37 Aside: Theory: Frequency and presence penalties
2:37:07 presence_penalty practice
2:38:36 frequency_penalty practice
2:44:54 The chatbotโ€™s personality
2:47:06 Firebase Intro
2:48:27 Firebase Account and database set up
2:50:43 Firebase dependency and database set up
2:55:53 Push method and instructions object
2:58:33 Update fetch Reply
3:02:24 Update fetchReply 2
3:04:49 Update the database
3:07:19 Render the conversation from the DB
3:12:02 The โ€œstart overโ€ button
3:15:20 OutroWe-Wingit: Fine-tuned chatbot3:17:28 Intro to fine-tuning
3:20:04 Convert the Chatbot to We-Wingit
3:22:15 An Overview of the AI
3:23:52 Data for fine-tuning
3:26:34 The data weโ€™re using
3:30:05 CLI 1 – Setting up the environment
3:33:03 CLI 2 – Data Preparation Tool
3:37:03 CLI 3 – Tuning the model
3:38:55 Updating the JS 1
3:41:33 Updating the JS 2
3:44:15 Updating the JS 3
3:47:01 The Separator
3:52:32 Aside – Stop Sequence
3:55:50 Adding the stop sequence
4:00:36 n_epochs
4:07:24 Intro to deployment
4:09:46 Download and GitHub
4:12:07 Netlify sign-up
4:13:56 Add Netlify env var
4:15:54 Netlify CLI
4:17:30 Netlify serverless function 1
4:19:52 Update fetchReply
4:24:28 Serverless function 2
4:27:30 Serverless function 3
4:29:21 Serverless function 4
4:32:32 Outro

๐ŸŽ‰ Thanks to our Champion and Sponsor supporters:
๐Ÿ‘พ davthecoder
๐Ÿ‘พ jedi-or-sith
๐Ÿ‘พ ๅ—ๅฎฎๅƒๅฝฑ
๐Ÿ‘พ Agustรญn Kussrow
๐Ÿ‘พ Nattira Maneerat
๐Ÿ‘พ Heather Wcislo
๐Ÿ‘พ Serhiy Kalinets
๐Ÿ‘พ Justin Hual
๐Ÿ‘พ Otis Morgan

—

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://freecodecamp.org/news