CF

AI Chat Bot with Vue.js and GPT-4

1h 46m 30s
English
Paid

AI is a powerful tool of the future. With Open AI's Chat Completions API (GPT-3.5 Turbo and GPT-4), adopting it in your applications is as easy as a REST request. Learn how to interact with this powerful API in the context of a Vue 3 application by building:

  • A Vue.js powered ChatGPT clone
  • A trained Custom Support Chat Bot
  • An app that automatically generates Social Media Posts when given an article URL

Additional

https://github.com/vueschool/ai-chatbot-course/

About the Author: Vue School

Vue School thumbnail

Vue School (vueschool.io) is a Greece-based Vue.js training platform founded by Alex Kyriakidis, an early Vue community member and one of the longest-running independent Vue educators. Vue School operates as both an on-demand course platform and a Vue / Nuxt consulting business, with course material that often emerges from real client engagements.

Course material covers the full Vue ecosystem: Vue 3 fundamentals through advanced Composition API patterns, Nuxt 3 production deployment, Pinia state management, Vue Router, the testing track with Vitest, TypeScript with Vue, real-time features with Pusher / WebSockets, and the broader full-stack Vue work. Vue School also publishes the popular Mastering Pinia course in collaboration with Pinia's author Eduardo San Martín Morote.

The CourseFlix listing under this source carries over 30 Vue School courses spanning that range. Material is paid; Vue School runs on per-course or membership pricing on the original platform. Courses are aimed at Vue developers from beginner through senior level building production Vue applications.

Watch Online 17 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 17 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Intro to Open AI and GPT-3 & 4
All Course Lessons (17)
#Lesson TitleDurationAccess
1
Intro to Open AI and GPT-3 & 4 Demo
05:18
2
Create Your Open AI Account
03:16
3
Your First Request to OpenAI API
09:07
4
Explore the Project Boilerplate
08:45
5
Secure Your Token with a Nuxt API Endpoint
06:18
6
Accept Messages in the AI Endpoint
02:50
7
Build Your Own Vue.js Powered ChatGPT
08:15
8
Give Your ChatBot the Context of the Full Conversation
06:36
9
Train The Bot as a Customer Support Assistant
06:43
10
Train The Bot as a Customer Support Assistant (Part 2)
03:20
11
Use Markdown and Placeholders in Training Messages
04:19
12
Explore More Creative Possibilities
06:39
13
Train the Bots for Facebook and Twitter
08:13
14
Twitter and Facebook Cards + the useChatAi Composable
10:57
15
Hookup the App UI to the AI Endpoint
08:41
16
Make Posting a Click Away
05:42
17
Course Conclusion
01:31
Unlock unlimited learning

Get instant access to all 16 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Related courses

  • Test with Jest thumbnailUpdated 3y ago

    Test with Jest

    By: Vue School
    Jest is an industry leading test suite for JavaScript used by big and small projects around the globe. Get up and running with Jest in this course! In this cour
    52m
  • TypeScript with Vue.js 3 thumbnailUpdated 2y ago

    TypeScript with Vue.js 3

    By: Vue School
    TypeScript is a super set of the JavaScript language that introduces static typing. In recent years, it's taken the JavaScript community by storm due to it's ab
    1h 37m
  • The Complete Guide to Django REST Framework and Vue JS thumbnailUpdated 2y ago

    The Complete Guide to Django REST Framework and Vue JS

    By: Udemy
    Hi! Welcome to The Complete Guide to Django REST Framework and Vue JS course! In this course you will learn how to create professional REST APIs with Python and
    13h 40m

Frequently asked questions

What are the prerequisites for enrolling in this course?
Before enrolling in this course, you should have a basic understanding of Vue.js, as the course focuses on building applications using Vue 3. Familiarity with RESTful APIs will also be beneficial since the course involves making requests to OpenAI's API. No prior knowledge of AI or machine learning is necessary, as the course provides an introduction to OpenAI and its capabilities.
What projects will I build during the course?
During the course, you will build three main projects: a Vue.js powered ChatGPT clone, a custom support chatbot trained specifically for customer service tasks, and an application that generates social media posts from an article URL. These projects are designed to give you practical experience in integrating OpenAI's API with Vue.js applications.
Who is the target audience for this course?
This course is ideal for developers interested in integrating AI capabilities into their Vue.js applications. It's suitable for those who have experience with Vue.js and want to explore how AI can enhance user interaction. The course is also beneficial for developers looking to understand how to work with OpenAI's API, specifically GPT-3.5 Turbo and GPT-4.
What specific tools and platforms are used in this course?
The course uses Vue 3 for building applications and integrates with OpenAI's Chat Completions API, specifically GPT-3.5 Turbo and GPT-4. The course also utilizes Nuxt.js for securing tokens via an API endpoint. These tools are crucial for developing the AI-powered applications featured in the course.
What topics are not covered in this course?
This course does not cover the fundamentals of Vue.js or basic web development skills, as it assumes that participants are already familiar with these topics. It also does not delve into the specifics of AI model training or advanced machine learning concepts beyond the practical use of GPT-3.5 Turbo and GPT-4 for chat applications.
How much time should I expect to dedicate to this course?
The course consists of 17 lessons, but the total runtime is not specified. Students should plan to spend additional time on coding exercises and projects, which will vary based on their existing knowledge and experience level. Allocating several hours per week to work through the lessons and projects is recommended.
How will the skills learned in this course benefit my career?
The skills acquired in this course will enhance your ability to integrate AI functionalities into web applications, which is increasingly valuable in the tech industry. Understanding how to leverage OpenAI's API with Vue.js can set you apart in roles focused on front-end development, AI integration, and innovative application design. These skills are transferable across various projects that involve user interaction and automation.