source-driven-development

Name: source-driven-development
Author: addyosmani

12kinstalls8.6kforks

How to install source-driven-development?

addyosmani/agent-skills/source-driven-development

$npx -y skills add addyosmani/agent-skills --skill source-driven-development

Installs into the current project.

Summary

Grounds every implementation decision in official documentation. Use when you want authoritative, source-cited code free from outdated patterns. Use when building with any framework or library where correctness matters.

Files · 1

View on GitHub

SKILL.md

1	# Source-Driven Development
2
3	## Overview
4
5	Every framework-specific code decision must be backed by official documentation. Don't implement from memory — verify, cite, and let the user see your sources. Training data goes stale, APIs get deprecated, best practices evolve. This skill ensures the user gets code they can trust because every pattern traces back to an authoritative source they can check.
6
7	## When to Use
8
9	- The user wants code that follows current best practices for a given framework
10	- Building boilerplate, starter code, or patterns that will be copied across a project
11	- The user explicitly asks for documented, verified, or "correct" implementation
12	- Implementing features where the framework's recommended approach matters (forms, routing, data fetching, state management, auth)
13	- Reviewing or improving code that uses framework-specific patterns
14	- Any time you are about to write framework-specific code from memory
15
16	When NOT to use:
17
18	- Correctness does not depend on a specific version (renaming variables, fixing typos, moving files)
19	- Pure logic that works the same across all versions (loops, conditionals, data structures)
20	- The user explicitly wants speed over verification ("just do it quickly")
21
22	## The Process
23
24	```
25	DETECT ──→ FETCH ──→ IMPLEMENT ──→ CITE
26	│ │ │ │
27	▼ ▼ ▼ ▼
28	What Get the Follow the Show your
29	stack? relevant documented sources
30	docs patterns
31	```
32
33	### Step 1: Detect Stack and Versions
34
35	Read the project's dependency file to identify exact versions:
36
37	```
38	package.json → Node/React/Vue/Angular/Svelte
39	composer.json → PHP/Symfony/Laravel
40	requirements.txt / pyproject.toml → Python/Django/Flask
41	go.mod → Go
42	Cargo.toml → Rust
43	Gemfile → Ruby/Rails
44	```
45
46	State what you found explicitly:
47
48	```
49	STACK DETECTED:
50	- React 19.1.0 (from package.json)
51	- Vite 6.2.0
52	- Tailwind CSS 4.0.3
53	→ Fetching official docs for the relevant patterns.
54	```
55
56	If versions are missing or ambiguous, ask the user. Don't guess — the version determines which patterns are correct.
57
58	### Step 2: Fetch Official Documentation
59
60	Fetch the specific documentation page for the feature you're implementing. Not the homepage, not the full docs — the relevant page.
61
62	Source hierarchy (in order of authority):
63
64	\| Priority \| Source \| Example \|
65	\|----------\|--------\|---------\|
66	\| 1 \| Official documentation \| react.dev, docs.djangoproject.com, symfony.com/doc \|
67	\| 2 \| Official blog / changelog \| react.dev/blog, nextjs.org/blog \|
68	\| 3 \| Web standards references \| MDN, web.dev, html.spec.whatwg.org \|
69	\| 4 \| Browser/runtime compatibility \| caniuse.com, node.green \|
70
71	Not authoritative — never cite as primary sources:
72
73	- Stack Overflow answers
74	- Blog posts or tutorials (even popular ones)
75	- AI-generated documentation or summaries
76	- Your own training data (that is the whole point — verify it)
77
78	Be precise with what you fetch:
79
80	```
81	BAD: Fetch the React homepage
82	GOOD: Fetch react.dev/reference/react/useActionState
83
84	BAD: Search "django authentication best practices"
85	GOOD: Fetch docs.djangoproject.com/en/6.0/topics/auth/
86	```
87
88	After fetching, extract the key patterns and note any deprecation warnings or migration guidance.
89
90	When official sources conflict with each other (e.g. a migration guide contradicts the API reference), surface the discrepancy to the user and verify which pattern actually works against the detected version.
91
92	### Step 3: Implement Following Documented Patterns
93
94	Write code that matches what the documentation shows:
95
96	- Use the API signatures from the docs, not from memory
97	- If the docs show a new way to do something, use the new way
98	- If the docs deprecate a pattern, don't use the deprecated version
99	- If the docs don't cover something, flag it as unverified
100
101	When docs conflict with existing project code:
102
103	```
104	CONFLICT DETECTED:
105	The existing codebase uses useState for form loading state,
106	but React 19 docs recommend useActionState for this pattern.
107	(Source: react.dev/reference/react/useActionState)
108
109	Options:
110	A) Use the modern pattern (useActionState) — consistent with current docs
111	B) Match existing code (useState) — consistent with codebase
112	→ Which approach do you prefer?
113	```
114
115	Surface the conflict. Don't silently pick one.
116
117	### Step 4: Cite Your Sources
118
119	Every framework-specific pattern gets a citation. The user must be able to verify every decision.
120
121	In code comments:
122
123	```typescript
124	// React 19 form handling with useActionState
125	// Source: https://react.dev/reference/react/useActionState#usage
126	const [state, formAction, isPending] = useActionState(submitOrder, initialState);
127	```
128
129	In conversation:
130
131	```
132	I'm using useActionState i

People who liked this also viewed

6 picks

Type

source-driven-development

12kinstalls8.6kforks

View on GitHub

How to install source-driven-development?

addyosmani/agent-skills/source-driven-development

$npx -y skills add addyosmani/agent-skills --skill source-driven-development

Installs into the current project.

Summary

Files · 1

View on GitHub

SKILL.md

1	# Source-Driven Development
2
3	## Overview
4
5	Every framework-specific code decision must be backed by official documentation. Don't implement from memory — verify, cite, and let the user see your sources. Training data goes stale, APIs get deprecated, best practices evolve. This skill ensures the user gets code they can trust because every pattern traces back to an authoritative source they can check.
6
7	## When to Use
8
9	- The user wants code that follows current best practices for a given framework
10	- Building boilerplate, starter code, or patterns that will be copied across a project
11	- The user explicitly asks for documented, verified, or "correct" implementation
12	- Implementing features where the framework's recommended approach matters (forms, routing, data fetching, state management, auth)
13	- Reviewing or improving code that uses framework-specific patterns
14	- Any time you are about to write framework-specific code from memory
15
16	When NOT to use:
17
18	- Correctness does not depend on a specific version (renaming variables, fixing typos, moving files)
19	- Pure logic that works the same across all versions (loops, conditionals, data structures)
20	- The user explicitly wants speed over verification ("just do it quickly")
21
22	## The Process
23
24	```
25	DETECT ──→ FETCH ──→ IMPLEMENT ──→ CITE
26	│ │ │ │
27	▼ ▼ ▼ ▼
28	What Get the Follow the Show your
29	stack? relevant documented sources
30	docs patterns
31	```
32
33	### Step 1: Detect Stack and Versions
34
35	Read the project's dependency file to identify exact versions:
36
37	```
38	package.json → Node/React/Vue/Angular/Svelte
39	composer.json → PHP/Symfony/Laravel
40	requirements.txt / pyproject.toml → Python/Django/Flask
41	go.mod → Go
42	Cargo.toml → Rust
43	Gemfile → Ruby/Rails
44	```
45
46	State what you found explicitly:
47
48	```
49	STACK DETECTED:
50	- React 19.1.0 (from package.json)
51	- Vite 6.2.0
52	- Tailwind CSS 4.0.3
53	→ Fetching official docs for the relevant patterns.
54	```
55
56	If versions are missing or ambiguous, ask the user. Don't guess — the version determines which patterns are correct.
57
58	### Step 2: Fetch Official Documentation
59
60	Fetch the specific documentation page for the feature you're implementing. Not the homepage, not the full docs — the relevant page.
61
62	Source hierarchy (in order of authority):
63
64	\| Priority \| Source \| Example \|
65	\|----------\|--------\|---------\|
66	\| 1 \| Official documentation \| react.dev, docs.djangoproject.com, symfony.com/doc \|
67	\| 2 \| Official blog / changelog \| react.dev/blog, nextjs.org/blog \|
68	\| 3 \| Web standards references \| MDN, web.dev, html.spec.whatwg.org \|
69	\| 4 \| Browser/runtime compatibility \| caniuse.com, node.green \|
70
71	Not authoritative — never cite as primary sources:
72
73	- Stack Overflow answers
74	- Blog posts or tutorials (even popular ones)
75	- AI-generated documentation or summaries
76	- Your own training data (that is the whole point — verify it)
77
78	Be precise with what you fetch:
79
80	```
81	BAD: Fetch the React homepage
82	GOOD: Fetch react.dev/reference/react/useActionState
83
84	BAD: Search "django authentication best practices"
85	GOOD: Fetch docs.djangoproject.com/en/6.0/topics/auth/
86	```
87
88	After fetching, extract the key patterns and note any deprecation warnings or migration guidance.
89
90	When official sources conflict with each other (e.g. a migration guide contradicts the API reference), surface the discrepancy to the user and verify which pattern actually works against the detected version.
91
92	### Step 3: Implement Following Documented Patterns
93
94	Write code that matches what the documentation shows:
95
96	- Use the API signatures from the docs, not from memory
97	- If the docs show a new way to do something, use the new way
98	- If the docs deprecate a pattern, don't use the deprecated version
99	- If the docs don't cover something, flag it as unverified
100
101	When docs conflict with existing project code:
102
103	```
104	CONFLICT DETECTED:
105	The existing codebase uses useState for form loading state,
106	but React 19 docs recommend useActionState for this pattern.
107	(Source: react.dev/reference/react/useActionState)
108
109	Options:
110	A) Use the modern pattern (useActionState) — consistent with current docs
111	B) Match existing code (useState) — consistent with codebase
112	→ Which approach do you prefer?
113	```
114
115	Surface the conflict. Don't silently pick one.
116
117	### Step 4: Cite Your Sources
118
119	Every framework-specific pattern gets a citation. The user must be able to verify every decision.
120
121	In code comments:
122
123	```typescript
124	// React 19 form handling with useActionState
125	// Source: https://react.dev/reference/react/useActionState#usage
126	const [state, formAction, isPending] = useActionState(submitOrder, initialState);
127	```
128
129	In conversation:
130
131	```
132	I'm using useActionState i

People who liked this also viewed

6 picks

Type