← 开源
microsoft

generative-ai-with-javascript

Join a time-traveling adventure where you meet history’s legends while learning Generative AI technologies! ✨

TutorialsGetting startedJavaScript
在 GitHub 打开
增长势头
+224 小时新增 Star+0.2%
1.27k
Star
843
Fork
—
本周
18
贡献者
创建于 2024-07-22 · 更新于 2026-10-05 · 今日第 2859 名
主要开发者
README

Generative AI for beginners with JavaScript

License PRs Welcome

Azure AI Discord

Microsoft Foundry Developer Forum

⭐ If you like this repo, star it on GitHub — it helps a lot!

Getting Started • Lessons • Keep Learning

Ready to integrate Generative AI into your JavaScript apps?

This course throws you into a time-traveling adventure—meet history’s legends with a fun twist, while learning Generative AI technologies ✨

[!IMPORTANT]
Open-source vibes! Reuse, tweak, and share this content freely.

Character App Sneak Peek

NEW - MCP lessons just added

Step into history with AI magic!

Dive into an immersive learning experience powered by Generative AI:

  • Learn about Generative AI technologies. If you've wanted to understand Generative AI and the potential for your applications, you're in the right place!

  • Epic Time-Travel Stories. Dive into a fun tale, chatting with icons like Leonardo da Vinci, Ada Lovelace, or Montezuma in every lesson.

  • Companion App. Interact with historical figures using Generative AI technologies (see our Responsible AI disclaimer).

    Interact with History through conversation

    Check the app directory to run the app locally or use GitHub Codespaces to run it online.

  • Accessibility FTW. Read it, hear it—audio tags bring it to life.

“It’s like a comic book with code!” — Happy User

Getting started

Throughout this course you'll find many code examples and exercises, so we encourage you to run and experiment with the code in your own copy of this repository:

  1. Select the Fork button in the upper right-hand corner of the repository or select this button: Fork

  2. Click the Code button in your forked repository, go to the Codespaces tab, and then choose Create codespace.

    This creates an online environment for the code examples. Continue with the course setup guide to create a Microsoft Foundry project, deploy a chat model, and configure your endpoint and API key.

[!NOTE]

While GitHub Codespaces provides a quick and easy starting point you can also run the code samples locally.

Both local development and Codespaces require model configuration. The course setup guide covers Microsoft Foundry, the repository-root .env, and a live companion app check.

The packages in the repository root and the companion app require Node.js LTS. Each lesson package has its own requirements.

Lesson description

📦 Each lesson includes:

  • A written lesson with an assignment and quiz.

  • Solutions for each assignment and quiz.

  • Characters you can interact with using our companion app, demonstrating Generative AI.

Lessons

🗃️ Table of contents

# Lesson Link Description
1 Introduction to Generative AI and LLMs for JavaScript Developers Understand Generative AI and LLM fundamentals, their applications and limits in JavaScript, and how to use AI to enhance user experiences.
2 Build your first AI app Set up your development environment, write a basic app, and understand system prompts.
3 Prompt engineering Learn Prompt engineering fundamentals, techniques, and meta-prompts for better AI outcomes.
4 Structured output Learn structured output, how to extract data from prompts, and present it in various formats, such as JSON, for easier consumption.
5 Retrieval augmented generation (RAG) Learn the basics of RAG, how to integrate external data, and how to leverage it for more relevant, accurate AI responses.
6 Tool calling/Function calling Learn how to give your LLM extra capabilities, bring your own functions
7 MCP, Model Context Protocol Teaches how to get started with MCP to standardize how to expose prompts, resources and tools
8 Enhancing MCP Clients with Large Language Models Learn how to improve your MCP app by improving clients with LLM and more

New lessons will be added to the course over time, so stay tuned!

Keep learning

🙌 After completing this course, you can continue learning by exploring our additional resources.

You'll also find additional resources in the form of tutorials, code samples and more.

Responsible AI Disclaimer

[!IMPORTANT] DISCLAIMER: This repository contains fictional content generated by AI. The historical characters depicted here are generating responses thanks to generative AI, which is based on training data. Any responses generated by these characters do not represent their actual views or quotes. This content is intended solely for entertainment purposes. Microsoft Responsible AI principles here

🎒 Other Courses

Azure, Edge, MCP, and Agents

AZD for Beginners Edge AI for Beginners MCP for Beginners AI Agents for Beginners

Generative AI Series

Generative AI for Beginners Generative AI (.NET) Generative AI (Java) Generative AI (JavaScript)

Core Learning

ML for Beginners Data Science for Beginners AI for Beginners Cybersecurity for Beginners Web Dev for Beginners IoT for Beginners XR Development for Beginners

Copilot Series

Copilot for AI Paired Programming Copilot for C#/.NET Copilot Adventure

Getting Help

If you get stuck or have any questions about building AI apps, join:

Microsoft Foundry Discord

If you have product feedback or errors while building visit:

Microsoft Foundry Developer Forum