Build production-quality web apps with AI — without losing control of your codebase. A hands-on, 4-day workshop for frontend and full-stack developers who want to work smarter with AI tools like GitHub Copilot.
Content:
You'll go beyond autocomplete — using AI to plan architecture, scaffold projects, implement features, write tests, document components, and debug real bugs across the full development lifecycle.
Agenda:
What You'll Learn
• SUnderstand the AI landscape — models, agents, MCP, reasoning tiers, and the difference between Ask, Plan, and Agent mode
• Master GitHub Copilot — inline completions, chat, agent mode, memory, and custom instructions
• Prompt effectively — write actionable prompts, manage context, and get consistent results
• Plan before you build — create Architecture Decision Records, code conventions, and phased feature plans with AI assistance
• Build a complete React + TypeScript app — design system, REST API integration, CRUD features, Storybook documentation, and full test coverage
• Debug with confidence — trace frontend bugs and backend issues using AI-assisted workflows
• Write secure code — review AI-generated code for OWASP risks, handle secrets safely, and maintain trust boundaries
Course Modules
01. AI Landscape: Models, tiers, reasoning, Ask/Plan/Agent, MCP
02. Copilot Fundamentals: Inline completions, Ask mode, Plan mode
03. Copilot Chat: Chat sessions, slash commands, context management, prompt engineering
04. Copilot Agents: Autonomous multi-step tasks, tool use, terminal integration
05. Memory & Context: copilot-instructions.md, custom instructions, persistent project context
06. Security: Reviewing AI-generated code, secrets, supply chain risks
07. Prepare Environment: Scaffold Vite + React + TypeScript, Vitest, Cypress, Storybook, GitHub Actions CI/CD
08. Building Plans: ADRs, code conventions, phased feature plans, preventing technical debt
09. Implement Plans: Design system, codebase structure, REST API integration
10. Build a Webapp: Feature development, AI-assisted testing, Storybook documentation
11. Bug Fixes: Frontend bugs, tracing a bug from UI to backend API
Format
Style: Hands-on, prompt-and-build exercises using GitHub Copilot
Outcome: A complete React webapp built with AI, and the judgment to know when to use it, when to override it, and how to stay in control
Vibe coding is not about letting AI write everything for you. It's about staying in control, planning before prompting, and trusting but verifying. Good AI-assisted development leads to faster scaffolding, more consistent code, better test coverage, and more time for architecture and design thinking.
Target audience
Frontend and full-stack developers ready to adopt AI-assisted development workflows.
No prior AI experience needed — solid JavaScript/TypeScript fundamentals are expected