microsoft/learn-ai-native-dev

microsoft/learn-ai-native-dev

Language: TypeScript

License: MIT

Stars: 10

Forks: 1

Open issues: 1

Created: 2026-04-24T11:51:06Z

Pushed: 2026-06-03T22:00:53Z

Default branch: main

Fork: no

Archived: no

README:

🎓 I'm here to learn

no install · no signup · free · open in any browser

microsoft.github.io/learn-ai-native-dev

✍️ I'm here to contribute

this repo is the contribution platform

git clone & npm run dev

---

◢ Quick start

_For contributors running the site locally. Just learning? Open the tutorial above — nothing to install._

git clone https://github.com/microsoft/learn-ai-native-dev.git
cd learn-ai-native-dev && npm install && npm run dev

Open . That's it.

React 19 · TypeScript · Vite 7 · Tailwind v4 · shadcn/ui · Radix

---

◢ What you'll be able to do

This isn't a catalog of skills, agents, or MCP configs. Those are the *medium*; the product is intuition — knowing _which_ to reach for, _when_, and _with what bounds_.

• ☑︎ Tell when a problem wants a one-shot prompt vs. a spec vs. a full agent loop
• ☑︎ Recognize a runaway agent before the token bill does
• ☑︎ Spot the difference between a lazy prompt and a structured one — and feel it in your output
• ☑︎ Move from _vibe-prompting_ → _spec-driven_ → _agentic engineering_ — and know which one a problem calls for
• ☑︎ Pick up MCP, custom agents, and skills as tools you reach for, not lore you memorize

> _Capability is reference. Intuition is curriculum._ — [docs/philosophy.md](docs/philosophy.md) §2

---

◢ Why this exists

Agentic coding is barely three years old. Models change every quarter, tools change every month, and yesterday's "best practice" is tomorrow's antipattern. Nobody has the hindsight yet to publish a durable catalog of patterns — not us, not anyone. Anyone who claims otherwise is selling snapshots as truths.

So we're not writing one. We're building the opposite: a place to get reps on problems you actually care about.

You don't get good at agentic coding by memorizing pattern names. You get good by shipping small things, seeing contrast (the lazy prompt beside the structured one), and accumulating taste. This site is built for that — and it grows when you add the problem you wish someone had taught you on.

text equivalent · accessibility

• ░ vibe coding — vibe-prompting, runaway loops, the "just one more retry".
• ▓ spec-driven — specs, instruction files, bounded context.
• █ agentic engineering — structured prompts, custom agents, the spec that ships.

A spectrum learners move along — not a destination they arrive at.

---

◢ What's inside

Three content kinds, one filter that runs across all of them.

| Kind | The question it answers | Shape | |:--|:--|:--| | Path | _Teach me a coherent body of work._ | Foundation · Agentic · Terminal · Community | | Recipe | _Show me one thing applied to one problem._ | 5–15 min, audience-tagged | | Project Shape | _What problem do I want to apply this to?_ | Iris Lab · Deal Dashboard · Palette Forge · yours next |

Filter everything by audience — researcher · developer · business · creative — and the catalog reshapes around what _you_ build. No pattern-of-the-month. No taxonomy gatekeeping.

> Read the north star: [docs/philosophy.md](docs/philosophy.md).

---

◢ The contribution loop

Every change to this curriculum runs through the same AI-assisted flow — the repo eats its own dogfood.

flowchart LR
A([💡 Idea or fix]) --> B[/slash-prompt
in Copilot Chat/]
B --> C{{Agent scaffolds
the change}}
C --> D[Open PR]
D --> E[["@reviewer
@docs-auditor"]]
E -->|approved| F[Merge to main]
F --> G((Site rebuilds
& deploys))
G -.next learner.-> A

classDef accent fill:#ff5500,stroke:#ff5500,color:#fff;
classDef ink fill:#0a0a0a,stroke:#0a0a0a,color:#fff;
class B,C accent
class E ink

> The slash-prompts: /add-example · /fix-content · /refresh-content · /propose-topic.

---

◢ Contribute

This repo is the contribution platform. The site is the artifact; this repo is the workshop where the curriculum gets shaped — by people learning this in real time, together.

The most valuable thing you can add is the rep you wish you'd had. A recipe that solved a real problem. A project shape from your domain. A diagram that finally made it click. A correction that saves the next person an hour.

╭──────────────────────────────────────────────────────────────╮
│ Got 10 minutes? → Open an issue. Fix a typo. Add a tag. │
│ Got an evening? → Write a recipe. Add a project shape. │
│ Got a weekend? → Propose a module or a community path. │
╰──────────────────────────────────────────────────────────────╯

Run a slash-prompt in Copilot Chat and the matching agent scaffolds the change. Open the PR; @reviewer and @docs-auditor weigh in automatically.

Before you start, the philosophy gives you a 6-question checklist to know if a piece of content is ready: _problem · verbs · feedback · audience · capability+version · (optional) name_ — see [docs/philosophy.md](docs/philosophy.md) §8.

> Start here → [.github/CONTRIBUTING.md](.github/CONTRIBUTING.md) · [.github/AUTHORING.md](.github/AUTHORING.md)

A repo built by the community, where AI helps you contribute to a curriculum about contributing with AI. That's the loop.

Shaped by

---

◢ Repository map

src/content/ ←── ✦ where most contributions live (markdown)
src/components/ ←── React + interactive diagrams
src/data/ ←── paths, project shapes, content mappings
.github/ ←── the build harness: agents · skills · prompts · instructions
docs/ ←── design spec & north-star philosophy

Two surfaces, two homes: [docs/](docs) is _what we teach_, [.github/](.github) is _how we edit it_. See [docs/harness.md](docs/harness.md) for the map.

---

◢ License · Security · Conduct

• Code → [MIT](LICENSE) · Content & docs → [CC BY 4.0](LICENSE-DOCS) · third-party attributions in [NOTICE](NOTICE).
• Security → please don't open public issues for vulnerabilities. See [SECURITY.md](SECURITY.md) and .
• Code of Conduct → Microsoft Open Source Code of Conduct · [CODE_OF_CONDUCT.md](CODE_OF_CONDUCT.md).
• Trademarks → use of Microsoft or third-party marks must follow Microsoft's Trademark & Brand Guidelines.

©…