microsoft/generative-ai-with-javascript
Join a time-traveling adventure where you meet history’s legends while learning Generative AI technologies! ✨
개요
JavaScript로 생성형 AI는 JavaScript와 마이크로소프트의 생성형 AI 서비스(Foundry)를 사용하여 AI 기반 웹 애플리케이션을 개발하는 방법을 인터랙티브하고 초보자 친화적으로 가르쳐주는 과정입니다. 리포지토리는 각 수업의 콘텐츠, 코드 샘플, 퀴즈, 그리고 대규모 언어 모델(Large Language Models)로 구동되는 역사적 인물들과 대화할 수 있는 보조 챗 앱을 포함하고 있습니다.
대상자
- 대규모 언어 모델(LLMs)에 처음 접하는 JavaScript 개발자로, 실습 경험을 원하는 분들.
- 스토리 중심 학습 방식을 선호하는 분들 — 각 수업은 레오나르도 다 빈치나 아다 러브레스 같은 인물들과의 '시간여행' 대화 형식으로 구성되어 있습니다.
- 로컬 또는 GitHub Codespaces에서 바로 실행 가능한 예제를 찾는 분들.
제공되는 내용
| 항목 | 설명 |
|---|---|
| 수업 모듈 | 기초(생성형 AI란 무엇인가, 프롬프트 엔지니어링), 실용 기술(구조화된 출력, RAG, 도구/함수 호출), Model Context Protocol(MCP)를 다루는 8개의 구조화된 수업. 각 수업에는 설명서, 과제, 퀴즈, 솔루션 코드가 포함됩니다. |
| 보조 앱 | Node.js 웹 앱(/app)으로, Microsoft Foundry에 배포한 LLM을 사용해 역사적 인물들과 대화할 수 있습니다. 오디오 태그를 통해 접근성도 고려되었습니다. |
| 코드 샘플 | 각 수업마다 독립된 npm 패키지로, 각각 고유한 종속성과 함께 제공됩니다. |
| 설치 가이드 | GitHub Codespaces 또는 로컬 개발 환경 사용 방법, Foundry 프로젝트 생성, 챗 모델 배포, .env 파일에 엔드포인트와 API 키 설정에 대한 단계별 안내. |
| 추가 자료 | 관련 초보자 과정(Azure, Edge AI, MCP, AI 에이전트) 및 AI/ML 학습 경로에 대한 링크. |
작동 방식
- Foundry 모델 생성 — 설치 가이드에 따라 Microsoft Foundry에서 챗 모델을 프로비저닝하고 엔드포인트/API 키를 획득합니다.
- 리포지토리 구성 — 리포지토리 루트에 있는
.env파일에 엔드포인트와 키를 저장합니다. - 보조 앱 실행 —
npm install && npm start(또는 제공된 Codespaces 설정 사용)로 로컬 웹 UI가 시작되며, 역사적 인물들에게 질문을 입력할 수 있습니다. 앱은 프롬프트를 당신의 Foundry 모델로 전송하고, LLM의 응답을 받아 화면에 표시합니다. - 수업 진행 — 각 수업은 이전 수업을 기반으로 하며, 다음과 같은 개념을 소개합니다:
- 프롬프트 엔지니어링 — 시스템 프롬프트와 메타 프롬프트 작성.
- 구조화된 출력 — JSON 형식으로 출력을 요청하여 후속 처리를 용이하게 함.
- 검색 기반 생성(RAG) — 외부 데이터 소스를 프롬프트에 연결.
- 도구/함수 호출 — 모델이 호출할 수 있는 사용자 정의 JavaScript 함수 노출.
- Model Context Protocol(MCP) — 프롬프트, 리소스, 도구를 설명하는 표준으로, 재사용 가능한 AI 컴포넌트를 가능하게 함.
- 실험 — 리포지토리는 코드를 포크하고 수정, 확장하는 것을 장려하며, PR도 환영합니다.
왜 중요한가
- 낮은 진입 장벽 — 모든 예제는 Node.js LTS에서 실행되며, 고성능 GPU 설정이 필요하지 않습니다.
- 실습 중심 학습 — 챗 UI에서 즉각적인 결과를 확인할 수 있어 추상적 개념을 강화합니다.
- 마이크로소프트 생태계 통합 — Azure/Foundry 서비스의 워크플로우를 배우며, 많은 기업에서 이미 사용하는 기술을 익힐 수 있습니다.
- 책임 있는 AI 인식 — README에 면책 조항과 마이크로소프트의 책임 있는 AI 원칙 링크가 포함되어 있어, 초보자에게 좋은 실천 예를 보여줍니다.
시작 팁
- GitHub Codespaces 버튼을 사용하면 세팅 없이 바로 사용 가능한 환경을 제공합니다. Node.js가 사전 설치되어 있으며, 리포지토리가 다운로드되고 튜토리얼이 열립니다.
.env파일은 버전 관리에서 제외하세요. 리포지토리의.gitignore는 이미 이를 보호하고 있습니다.- MCP나 도구 호출 수업에 들어가기 전에 Lesson 1부터 시작하여 전체 아키텍처를 이해하세요.
- 핵심 커리큘럼을 마친 후에는 추가 자료 섹션에서 Azure AI, Edge AI, AI 에이전트에 대해 더 깊이 탐구해보세요.
위 정보는 리포지토리의 README에서 직접 가져온 것이며, 외부 가정은 전혀 추가되지 않았습니다.
관련
- 프로젝트
- 프로젝트
- 프로젝트
- 프로젝트
- 프로젝트