@booklib/skills 1.5.1 โ 1.5.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/docs/index.html +218 -43
- package/package.json +1 -1
package/docs/index.html
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
<meta charset="UTF-8"/>
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
6
6
|
<title>booklib-ai/skills โ Book-grounded AI agent skills</title>
|
|
7
|
-
<meta name="description" content="
|
|
7
|
+
<meta name="description" content="22 AI agent skills grounded in canonical programming books. Give your AI coding assistant expert knowledge from Clean Code, Effective Java, DDD, and more."/>
|
|
8
8
|
<meta property="og:title" content="booklib-ai/skills"/>
|
|
9
9
|
<meta property="og:description" content="Book-grounded AI agent skills for Claude Code, Cursor, Copilot, and Windsurf."/>
|
|
10
10
|
<meta property="og:image" content="https://booklib-ai.github.io/skills/logo.png"/>
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
max-width: 720px;
|
|
29
29
|
margin: 0 auto;
|
|
30
30
|
}
|
|
31
|
-
.hero img { width: 96px; height: 96px; margin-bottom: 24px; }
|
|
31
|
+
.hero img.logo { width: 96px; height: 96px; margin-bottom: 24px; }
|
|
32
32
|
.hero h1 { font-size: 2.5rem; font-weight: 700; color: #f1f5f9; letter-spacing: -0.03em; }
|
|
33
33
|
.hero p {
|
|
34
34
|
font-size: 1.125rem;
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
}
|
|
41
41
|
|
|
42
42
|
/* Install */
|
|
43
|
-
|
|
43
|
+
#install {
|
|
44
44
|
display: flex;
|
|
45
45
|
align-items: center;
|
|
46
46
|
justify-content: center;
|
|
@@ -58,6 +58,11 @@
|
|
|
58
58
|
color: #a5b4fc;
|
|
59
59
|
cursor: pointer;
|
|
60
60
|
user-select: all;
|
|
61
|
+
transition: border-color 0.2s;
|
|
62
|
+
}
|
|
63
|
+
.install-box.highlighted {
|
|
64
|
+
border-color: #6366f1;
|
|
65
|
+
color: #c7d2fe;
|
|
61
66
|
}
|
|
62
67
|
.copy-btn {
|
|
63
68
|
background: #6366f1;
|
|
@@ -84,7 +89,7 @@
|
|
|
84
89
|
|
|
85
90
|
/* Skills grid */
|
|
86
91
|
.skills-section {
|
|
87
|
-
max-width:
|
|
92
|
+
max-width: 1100px;
|
|
88
93
|
margin: 64px auto;
|
|
89
94
|
padding: 0 24px;
|
|
90
95
|
}
|
|
@@ -92,28 +97,117 @@
|
|
|
92
97
|
font-size: 1.5rem;
|
|
93
98
|
font-weight: 700;
|
|
94
99
|
color: #f1f5f9;
|
|
95
|
-
margin-bottom:
|
|
100
|
+
margin-bottom: 8px;
|
|
96
101
|
text-align: center;
|
|
97
102
|
}
|
|
103
|
+
.skills-section .subtitle {
|
|
104
|
+
text-align: center;
|
|
105
|
+
color: #64748b;
|
|
106
|
+
font-size: 0.9rem;
|
|
107
|
+
margin-bottom: 32px;
|
|
108
|
+
}
|
|
98
109
|
.skills-grid {
|
|
99
110
|
display: grid;
|
|
100
|
-
grid-template-columns: repeat(auto-fill, minmax(
|
|
101
|
-
gap:
|
|
111
|
+
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
|
112
|
+
gap: 20px;
|
|
102
113
|
}
|
|
114
|
+
|
|
115
|
+
/* Card */
|
|
103
116
|
.skill-card {
|
|
104
117
|
background: #11111f;
|
|
105
118
|
border: 1px solid #1e1e35;
|
|
106
119
|
border-radius: 12px;
|
|
107
|
-
|
|
108
|
-
|
|
120
|
+
overflow: hidden;
|
|
121
|
+
cursor: pointer;
|
|
122
|
+
transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s;
|
|
123
|
+
display: flex;
|
|
124
|
+
flex-direction: column;
|
|
125
|
+
text-decoration: none;
|
|
126
|
+
color: inherit;
|
|
109
127
|
}
|
|
110
128
|
.skill-card:hover {
|
|
111
129
|
border-color: #6366f1;
|
|
112
|
-
transform: translateY(-
|
|
130
|
+
transform: translateY(-3px);
|
|
131
|
+
box-shadow: 0 8px 24px rgba(99, 102, 241, 0.15);
|
|
132
|
+
text-decoration: none;
|
|
133
|
+
}
|
|
134
|
+
.skill-card.active {
|
|
135
|
+
border-color: #818cf8;
|
|
136
|
+
box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.3);
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/* Book cover area */
|
|
140
|
+
.cover-wrap {
|
|
141
|
+
width: 100%;
|
|
142
|
+
aspect-ratio: 2 / 3;
|
|
143
|
+
background: #161625;
|
|
144
|
+
display: flex;
|
|
145
|
+
align-items: center;
|
|
146
|
+
justify-content: center;
|
|
147
|
+
overflow: hidden;
|
|
148
|
+
position: relative;
|
|
149
|
+
}
|
|
150
|
+
.cover-wrap img {
|
|
151
|
+
width: 100%;
|
|
152
|
+
height: 100%;
|
|
153
|
+
object-fit: cover;
|
|
154
|
+
display: block;
|
|
155
|
+
}
|
|
156
|
+
.cover-fallback {
|
|
157
|
+
width: 100%;
|
|
158
|
+
height: 100%;
|
|
159
|
+
display: flex;
|
|
160
|
+
flex-direction: column;
|
|
161
|
+
align-items: center;
|
|
162
|
+
justify-content: center;
|
|
163
|
+
padding: 16px;
|
|
164
|
+
text-align: center;
|
|
165
|
+
gap: 8px;
|
|
166
|
+
}
|
|
167
|
+
.cover-fallback .initials {
|
|
168
|
+
font-size: 2rem;
|
|
169
|
+
font-weight: 700;
|
|
170
|
+
color: #6366f1;
|
|
171
|
+
line-height: 1;
|
|
172
|
+
}
|
|
173
|
+
.cover-fallback .fallback-title {
|
|
174
|
+
font-size: 0.75rem;
|
|
175
|
+
color: #64748b;
|
|
176
|
+
line-height: 1.3;
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
/* Card body */
|
|
180
|
+
.card-body {
|
|
181
|
+
padding: 14px 16px 16px;
|
|
182
|
+
flex: 1;
|
|
183
|
+
display: flex;
|
|
184
|
+
flex-direction: column;
|
|
185
|
+
gap: 4px;
|
|
186
|
+
}
|
|
187
|
+
.card-body .skill-name {
|
|
188
|
+
font-size: 0.8rem;
|
|
189
|
+
font-weight: 700;
|
|
190
|
+
color: #a5b4fc;
|
|
191
|
+
font-family: "SF Mono", "Fira Code", monospace;
|
|
192
|
+
word-break: break-all;
|
|
193
|
+
}
|
|
194
|
+
.card-body .book-title {
|
|
195
|
+
font-size: 0.82rem;
|
|
196
|
+
font-weight: 600;
|
|
197
|
+
color: #e2e8f0;
|
|
198
|
+
line-height: 1.3;
|
|
199
|
+
margin-top: 2px;
|
|
200
|
+
}
|
|
201
|
+
.card-body .book-author {
|
|
202
|
+
font-size: 0.75rem;
|
|
203
|
+
color: #64748b;
|
|
204
|
+
}
|
|
205
|
+
.card-body .card-desc {
|
|
206
|
+
font-size: 0.775rem;
|
|
207
|
+
color: #475569;
|
|
208
|
+
line-height: 1.45;
|
|
209
|
+
margin-top: 6px;
|
|
113
210
|
}
|
|
114
|
-
.skill-card .icon { font-size: 1.5rem; margin-bottom: 10px; }
|
|
115
|
-
.skill-card h3 { font-size: 0.95rem; font-weight: 600; color: #e2e8f0; margin-bottom: 6px; }
|
|
116
|
-
.skill-card p { font-size: 0.825rem; color: #64748b; line-height: 1.5; }
|
|
117
211
|
|
|
118
212
|
/* Footer */
|
|
119
213
|
footer {
|
|
@@ -129,13 +223,13 @@
|
|
|
129
223
|
<body>
|
|
130
224
|
|
|
131
225
|
<section class="hero">
|
|
132
|
-
<img src="https://raw.githubusercontent.com/booklib-ai/skills/main/assets/logo.svg" alt="booklib-ai skills logo"/>
|
|
226
|
+
<img class="logo" src="https://raw.githubusercontent.com/booklib-ai/skills/main/assets/logo.svg" alt="booklib-ai skills logo"/>
|
|
133
227
|
<h1>Skills</h1>
|
|
134
228
|
<p>Book-grounded AI agent skills โ expert knowledge from canonical programming books, packaged for Claude Code, Cursor, Copilot, and Windsurf.</p>
|
|
135
229
|
|
|
136
|
-
<div
|
|
230
|
+
<div id="install">
|
|
137
231
|
<div class="install-box" id="cmd">npx skills add booklib-ai/skills --all -g</div>
|
|
138
|
-
<button class="copy-btn" onclick="
|
|
232
|
+
<button class="copy-btn" onclick="copyCmd()">Copy</button>
|
|
139
233
|
</div>
|
|
140
234
|
|
|
141
235
|
<div class="badges">
|
|
@@ -147,40 +241,121 @@
|
|
|
147
241
|
</section>
|
|
148
242
|
|
|
149
243
|
<section class="skills-section">
|
|
150
|
-
<h2>
|
|
151
|
-
<
|
|
152
|
-
|
|
153
|
-
<div class="skill-card"><div class="icon">๐งน</div><h3>clean-code-reviewer</h3><p>Code review against Robert C. Martin's Clean Code โ naming, functions, comments, classes.</p></div>
|
|
154
|
-
<div class="skill-card"><div class="icon">๐๏ธ</div><h3>data-intensive-patterns</h3><p>Reliable, scalable systems from Martin Kleppmann โ storage engines, replication, transactions.</p></div>
|
|
155
|
-
<div class="skill-card"><div class="icon">๐</div><h3>data-pipelines</h3><p>Pipeline practices from James Densmore โ ingestion, streaming, transformation, orchestration.</p></div>
|
|
156
|
-
<div class="skill-card"><div class="icon">๐๏ธ</div><h3>design-patterns</h3><p>GoF design patterns from Head First Design Patterns โ creational, structural, behavioral.</p></div>
|
|
157
|
-
<div class="skill-card"><div class="icon">๐งฉ</div><h3>domain-driven-design</h3><p>Eric Evans' DDD โ Aggregates, Value Objects, Bounded Contexts, Ubiquitous Language.</p></div>
|
|
158
|
-
<div class="skill-card"><div class="icon">โ</div><h3>effective-java</h3><p>Joshua Bloch's Effective Java โ object creation, generics, enums, lambdas, concurrency.</p></div>
|
|
159
|
-
<div class="skill-card"><div class="icon">๐ก๏ธ</div><h3>effective-kotlin</h3><p>Marcin Moskaลa's Effective Kotlin โ safety, readability, reusability, abstraction.</p></div>
|
|
160
|
-
<div class="skill-card"><div class="icon">๐</div><h3>effective-python</h3><p>Brett Slatkin's Effective Python โ Pythonic thinking, functions, classes, concurrency.</p></div>
|
|
161
|
-
<div class="skill-card"><div class="icon">โก</div><h3>kotlin-in-action</h3><p>Kotlin in Action โ functions, classes, lambdas, nullability, coroutines, flows.</p></div>
|
|
162
|
-
<div class="skill-card"><div class="icon">๐</div><h3>lean-startup</h3><p>Eric Ries' The Lean Startup โ MVP testing, validated learning, Build-Measure-Learn.</p></div>
|
|
163
|
-
<div class="skill-card"><div class="icon">๐ง</div><h3>microservices-patterns</h3><p>Chris Richardson โ decomposition, sagas, API gateways, event sourcing, CQRS.</p></div>
|
|
164
|
-
<div class="skill-card"><div class="icon">๐จ</div><h3>refactoring-ui</h3><p>Refactoring UI by Wathan & Schoger โ visual hierarchy, layout, typography, color.</p></div>
|
|
165
|
-
<div class="skill-card"><div class="icon">๐บ๏ธ</div><h3>skill-router</h3><p><strong>Meta-skill.</strong> Automatically selects the 1โ2 most relevant skills for any task.</p></div>
|
|
166
|
-
<div class="skill-card"><div class="icon">๐</div><h3>storytelling-with-data</h3><p>Cole Nussbaumer Knaflic โ effective visuals, decluttering, narrative structure.</p></div>
|
|
167
|
-
<div class="skill-card"><div class="icon">๐๏ธ</div><h3>system-design-interview</h3><p>Alex Xu โ scaling, estimation, load balancing, caching, sharding, real-world designs.</p></div>
|
|
168
|
-
<div class="skill-card"><div class="icon">๐</div><h3>using-asyncio-python</h3><p>Caleb Hattingh โ coroutines, event loop, tasks, signal handling, aiohttp.</p></div>
|
|
169
|
-
<div class="skill-card"><div class="icon">๐ท๏ธ</div><h3>web-scraping-python</h3><p>Ryan Mitchell โ BeautifulSoup, Scrapy, Selenium, data storage, anti-detection.</p></div>
|
|
170
|
-
</div>
|
|
244
|
+
<h2>22 skills, 22 books</h2>
|
|
245
|
+
<p class="subtitle">Click any skill to see its install command</p>
|
|
246
|
+
<div class="skills-grid" id="grid"></div>
|
|
171
247
|
</section>
|
|
172
248
|
|
|
173
249
|
<footer>
|
|
174
|
-
<p>MIT License
|
|
250
|
+
<p>MIT License · <a href="https://github.com/booklib-ai/skills">GitHub</a> · <a href="https://github.com/booklib-ai/skills/blob/main/CONTRIBUTING.md">Contributing</a> · <a href="https://github.com/booklib-ai/skills/blob/main/AGENTS.md">Agent Setup</a></p>
|
|
175
251
|
</footer>
|
|
176
252
|
|
|
177
253
|
<script>
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
254
|
+
const SKILLS = [
|
|
255
|
+
{ name: "animation-at-work", book: "Animation at Work", author: "Rachel Nabors", isbn: "9781937557942", desc: "Motion perception, 12 animation principles, CSS transitions, and performance." },
|
|
256
|
+
{ name: "clean-code-reviewer", book: "Clean Code", author: "Robert C. Martin", isbn: "9780132350884", desc: "Naming, functions, comments, classes, and the Boy Scout Rule." },
|
|
257
|
+
{ name: "data-intensive-patterns",book: "Designing Data-Intensive Applications",author: "Martin Kleppmann", isbn: "9781449373320", desc: "Storage engines, replication, transactions, and distributed systems." },
|
|
258
|
+
{ name: "data-pipelines", book: "Data Pipelines Pocket Reference", author: "James Densmore", isbn: "9781492087601", desc: "Ingestion, streaming, transformation, and orchestration." },
|
|
259
|
+
{ name: "design-patterns", book: "Head First Design Patterns", author: "Freeman & Robson", isbn: "9781492078005", desc: "GoF creational, structural, and behavioral patterns in depth." },
|
|
260
|
+
{ name: "domain-driven-design", book: "Domain-Driven Design", author: "Eric Evans", isbn: "9780321125217", desc: "Aggregates, Value Objects, Bounded Contexts, Ubiquitous Language." },
|
|
261
|
+
{ name: "effective-java", book: "Effective Java", author: "Joshua Bloch", isbn: "9780134685991", desc: "Object creation, generics, enums, lambdas, and concurrency." },
|
|
262
|
+
{ name: "effective-kotlin", book: "Effective Kotlin", author: "Marcin Moskala", isbn: "9781803248776", desc: "Safety, readability, reusability, and abstraction." },
|
|
263
|
+
{ name: "effective-python", book: "Effective Python", author: "Brett Slatkin", isbn: "9780134853987", desc: "Pythonic thinking, functions, classes, concurrency, and testing." },
|
|
264
|
+
{ name: "effective-typescript", book: "Effective TypeScript", author: "Dan Vanderkam", isbn: "9781492053743", desc: "Type system, type design, avoiding any, declarations, and migration." },
|
|
265
|
+
{ name: "kotlin-in-action", book: "Kotlin in Action", author: "Elizarov & Isakova", isbn: "9781617293290", desc: "Functions, classes, lambdas, nullability, coroutines, and flows." },
|
|
266
|
+
{ name: "lean-startup", book: "The Lean Startup", author: "Eric Ries", isbn: "9780307887894", desc: "MVP testing, validated learning, Build-Measure-Learn loop." },
|
|
267
|
+
{ name: "microservices-patterns", book: "Microservices Patterns", author: "Chris Richardson", isbn: "9781617294549", desc: "Decomposition, sagas, API gateways, event sourcing, and CQRS." },
|
|
268
|
+
{ name: "programming-with-rust", book: "Programming with Rust", author: "Donis Marshall", isbn: "9780137889655", desc: "Ownership, borrowing, lifetimes, error handling, traits, concurrency." },
|
|
269
|
+
{ name: "refactoring-ui", book: "Refactoring UI", author: "Wathan & Schoger", isbn: null, desc: "Visual hierarchy, layout, typography, color, and spacing." },
|
|
270
|
+
{ name: "rust-in-action", book: "Rust in Action", author: "Tim McNamara", isbn: "9781617294556", desc: "Systems programming โ smart pointers, memory, networking, OS." },
|
|
271
|
+
{ name: "skill-router", book: "Meta-skill", author: "booklib-ai", isbn: null, desc: "Automatically routes to the most relevant skill for any task." },
|
|
272
|
+
{ name: "spring-boot-in-action", book: "Spring Boot in Action", author: "Craig Walls", isbn: "9781617292545", desc: "Auto-configuration, starters, testing, Actuator, and deployment." },
|
|
273
|
+
{ name: "storytelling-with-data", book: "Storytelling with Data", author: "Cole Nussbaumer Knaflic",isbn: "9781119002253", desc: "Effective visuals, decluttering, and narrative structure." },
|
|
274
|
+
{ name: "system-design-interview",book: "System Design Interview", author: "Alex Xu", isbn: "9798664653403", desc: "Scaling, estimation, load balancing, caching, and sharding." },
|
|
275
|
+
{ name: "using-asyncio-python", book: "Using Asyncio in Python", author: "Caleb Hattingh", isbn: "9781492075325", desc: "Coroutines, event loop, tasks, and signal handling." },
|
|
276
|
+
{ name: "web-scraping-python", book: "Web Scraping with Python", author: "Ryan Mitchell", isbn: "9781491985564", desc: "BeautifulSoup, Scrapy, Selenium, and data storage." },
|
|
277
|
+
];
|
|
278
|
+
|
|
279
|
+
const ALL_CMD = "npx skills add booklib-ai/skills --all -g";
|
|
280
|
+
let activeCard = null;
|
|
281
|
+
|
|
282
|
+
function initials(name) {
|
|
283
|
+
return name.split(/[\s-]+/).map(w => w[0]).join("").toUpperCase().slice(0, 3);
|
|
183
284
|
}
|
|
285
|
+
|
|
286
|
+
function buildCard(skill) {
|
|
287
|
+
const card = document.createElement("a");
|
|
288
|
+
card.className = "skill-card";
|
|
289
|
+
card.href = `https://github.com/booklib-ai/skills/tree/main/skills/${skill.name}`;
|
|
290
|
+
card.target = "_blank";
|
|
291
|
+
card.rel = "noopener";
|
|
292
|
+
|
|
293
|
+
const coverHtml = skill.isbn
|
|
294
|
+
? `<img
|
|
295
|
+
src="https://covers.openlibrary.org/b/isbn/${skill.isbn}-M.jpg"
|
|
296
|
+
alt="${skill.book} cover"
|
|
297
|
+
onerror="this.style.display='none';this.nextElementSibling.style.display='flex'"
|
|
298
|
+
/>
|
|
299
|
+
<div class="cover-fallback" style="display:none">
|
|
300
|
+
<div class="initials">${initials(skill.book)}</div>
|
|
301
|
+
<div class="fallback-title">${skill.book}</div>
|
|
302
|
+
</div>`
|
|
303
|
+
: `<div class="cover-fallback">
|
|
304
|
+
<div class="initials">${initials(skill.book)}</div>
|
|
305
|
+
<div class="fallback-title">${skill.book}</div>
|
|
306
|
+
</div>`;
|
|
307
|
+
|
|
308
|
+
card.innerHTML = `
|
|
309
|
+
<div class="cover-wrap">${coverHtml}</div>
|
|
310
|
+
<div class="card-body">
|
|
311
|
+
<div class="skill-name">${skill.name}</div>
|
|
312
|
+
<div class="book-title">${skill.book}</div>
|
|
313
|
+
<div class="book-author">${skill.author}</div>
|
|
314
|
+
<div class="card-desc">${skill.desc}</div>
|
|
315
|
+
</div>
|
|
316
|
+
`;
|
|
317
|
+
|
|
318
|
+
card.addEventListener("click", (e) => {
|
|
319
|
+
e.preventDefault();
|
|
320
|
+
selectSkill(skill, card);
|
|
321
|
+
});
|
|
322
|
+
|
|
323
|
+
return card;
|
|
324
|
+
}
|
|
325
|
+
|
|
326
|
+
function selectSkill(skill, card) {
|
|
327
|
+
// Deactivate previous
|
|
328
|
+
if (activeCard && activeCard !== card) {
|
|
329
|
+
activeCard.classList.remove("active");
|
|
330
|
+
}
|
|
331
|
+
const cmdEl = document.getElementById("cmd");
|
|
332
|
+
|
|
333
|
+
if (activeCard === card) {
|
|
334
|
+
// Deselect โ back to install all
|
|
335
|
+
activeCard.classList.remove("active");
|
|
336
|
+
activeCard = null;
|
|
337
|
+
cmdEl.textContent = ALL_CMD;
|
|
338
|
+
cmdEl.classList.remove("highlighted");
|
|
339
|
+
} else {
|
|
340
|
+
activeCard = card;
|
|
341
|
+
card.classList.add("active");
|
|
342
|
+
cmdEl.textContent = `npx skills add booklib-ai/skills ${skill.name} -g`;
|
|
343
|
+
cmdEl.classList.add("highlighted");
|
|
344
|
+
document.getElementById("install").scrollIntoView({ behavior: "smooth", block: "center" });
|
|
345
|
+
}
|
|
346
|
+
}
|
|
347
|
+
|
|
348
|
+
function copyCmd() {
|
|
349
|
+
const text = document.getElementById("cmd").textContent;
|
|
350
|
+
navigator.clipboard.writeText(text);
|
|
351
|
+
const btn = document.querySelector(".copy-btn");
|
|
352
|
+
btn.textContent = "Copied!";
|
|
353
|
+
setTimeout(() => btn.textContent = "Copy", 2000);
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
// Build grid
|
|
357
|
+
const grid = document.getElementById("grid");
|
|
358
|
+
SKILLS.forEach(skill => grid.appendChild(buildCard(skill)));
|
|
184
359
|
</script>
|
|
185
360
|
|
|
186
361
|
</body>
|