Build a JavaScript AI App with React and the OpenAI API

Focused View

Morten Rand-Hendriksen

1:59:57

110 View

01 - Introduction

01 - Build a JavaScript AI app with React and the OpenAI API.mp4

00:41

02 - Use the exercise files on GitHub Codespaces.mp4

00:24

03 - Using GitHub Codespaces with this course.mp4

06:01

02 - 1. Building a Weather App with AI Power

01 - Beyond ChatGPT What AI can do for you.mp4

02:31

02 - Real-world challenge A more useful weather app.mp4

03:42

03 - Ideating with ChatGPT as a base.mp4

06:22

03 - 2. The Core App

01 - Sidebar Build a React app using Vite and GitHub Codespaces.mp4

04:46

02 - Boot up the app in GitHub Codespaces.mp4

02:59

03 - Work with the OpenWeatherMap API.mp4

03:30

04 - App walk-through.mp4

06:12

04 - 3. Connecting to the OpenAI API

01 - What is the OpenAI API, and how does it relate to ChatGPT.mp4

02:53

02 - Test the API in the OpenAI Playground.mp4

07:25

03 - Generate secret keys.mp4

03:21

04 - Test the API with a REST client.mp4

05:11

05 - 4. Using AI as a Human-to-Machine Translator

01 - Create a location string from a prompt.mp4

03:08

02 - The challenge of non-deterministic APIs.mp4

03:20

03 - Function calling in the OpenAI API.mp4

03:49

04 - Create a custom function call for the OpenAI API.mp4

03:54

06 - 5. Integrating AI into the Weather App

01 - Sequence API calls in an app.mp4

03:02

02 - Create a fetch request to the OpenAI API.mp4

07:04

03 - Add a function call to the request.mp4

05:48

04 - Parse the response.mp4

04:01

05 - Pass the response to the weather data request.mp4

02:57

06 - Update the weather data display.mp4

05:08

07 - 6. Creating Rich AI Outputs

01 - Prompt engineering for developers.mp4

03:59

02 - Advanced calls to the OpenAI API.mp4

06:45

03 - Integrate the AI API response.mp4

03:46

04 - Provide good UX with independent loaders.mp4

05:49

08 - Conclusion

01 - Go further.mp4

01:29

Description

In this course, learn how to integrate the OpenAI API into a JavaScript-based web app. Join instructor Morten Rand-Hendriksen as he takes a React-based weather app, adds a heavy dose of AI, and creates an interactive experience that knows what location you want weather information from, explains the weather data in simple language, and even suggests what to wear. Through this project-based course, Morten teaches you about API integration, user-based authentication, storing user tokens in a ServiceWorker, task-based API configuration, and sending and receiving requests to the API.

More details

User Reviews

Rating

average 0

Total votes0

Focused display

JavaScript

React

Artificial Intelligence

Morten Rand-Hendriksen

Instructor's Courses

Since joining forces with lynda.com (now LinkedIn Learning) in 2010, I've 60+ published courses on WordPress, front end web design and development, and web standards, reaching hundreds of thousands of viewers from all over the world. I also contribute to the web community as a public speaker, author, educator, web developer, and design philosopher. I help the web make sense by helping people understand and get the most out of the web, and contribute to the debates about ownership and democratization of information, design philosophy, and the open web.

Linkedin Learning

View courses Linkedin Learning

LinkedIn Learning is an American online learning provider. It provides video courses taught by industry experts in software, creative, and business skills. It is a subsidiary of LinkedIn. All the courses on LinkedIn fall into four categories: Business, Creative, Technology and Certifications. It was founded in 1995 by Lynda Weinman as Lynda.com before being acquired by LinkedIn in 2015. Microsoft acquired LinkedIn in December 2016.