{ "name": "Claude Code Developer Tools URL Strategy", "description": "Progressive web learning resources for building Claude Code observability, search, and coordination tools", "progression": "foundation → intermediate → advanced → expert", "priming_urls": [ { "url": "https://developer.mozilla.org/en-US/docs/Web/API/File_API/Using_files_from_web_applications", "topic": "File API fundamentals for reading local transcript files", "key_concepts": ["FileReader", "Blob", "File handling", "JSONL parsing"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API/Using_IndexedDB", "topic": "IndexedDB for storing and querying large transcript datasets", "key_concepts": ["Object stores", "Indexes", "Transactions", "Cursors"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial", "topic": "Canvas API for data visualization", "key_concepts": ["2D context", "Drawing shapes", "Animations", "Interactions"] } ], "foundation": { "description": "Basic file handling, storage, and simple visualizations (Iterations 1-5)", "urls": [ { "url": "https://developer.mozilla.org/en-US/docs/Web/API/FileReader", "topic": "FileReader API for loading transcript files", "iteration_range": "1-2", "techniques": ["readAsText", "onload events", "error handling", "progress tracking"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API", "topic": "LocalStorage for caching search results and preferences", "iteration_range": "1-3", "techniques": ["setItem/getItem", "JSON serialization", "storage events", "quota management"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas", "topic": "Canvas basics for timeline visualizations", "iteration_range": "2-4", "techniques": ["fillRect", "strokeStyle", "text rendering", "coordinate systems"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout", "topic": "CSS Grid for responsive tool layouts", "iteration_range": "1-5", "techniques": ["grid-template-areas", "auto-fit", "minmax", "gap"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse", "topic": "JSON parsing for JSONL transcript processing", "iteration_range": "1-2", "techniques": ["parse", "stringify", "reviver functions", "error handling"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial", "topic": "SVG for scalable charts and graphs", "iteration_range": "3-5", "techniques": ["path elements", "viewBox", "transforms", "CSS styling"] } ] }, "intermediate": { "description": "Advanced search, analytics, interactive visualizations (Iterations 6-12)", "urls": [ { "url": "https://d3js.org/getting-started", "topic": "D3.js fundamentals for data visualization", "iteration_range": "6-8", "techniques": ["data binding", "scales", "axes", "transitions"] }, { "url": "https://observablehq.com/@d3/force-directed-graph", "topic": "Force-directed graphs for conversation relationships", "iteration_range": "7-9", "techniques": ["force simulation", "node dragging", "link rendering", "zoom behavior"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers", "topic": "Web Workers for background search processing", "iteration_range": "8-10", "techniques": ["postMessage", "onmessage", "transferable objects", "shared workers"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions", "topic": "Advanced regex for pattern searching", "iteration_range": "6-8", "techniques": ["lookahead/lookbehind", "capturing groups", "flags", "Unicode support"] }, { "url": "https://observablehq.com/@d3/bar-chart", "topic": "Interactive bar charts for tool usage analytics", "iteration_range": "6-7", "techniques": ["ordinal scales", "tooltips", "hover effects", "sorting"] }, { "url": "https://observablehq.com/@d3/zoomable-sunburst", "topic": "Hierarchical sunburst for nested data", "iteration_range": "9-11", "techniques": ["hierarchical data", "partition layout", "arc generation", "zoom transitions"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API", "topic": "Advanced IndexedDB queries and indexes", "iteration_range": "10-12", "techniques": ["compound indexes", "key ranges", "cursors", "versioning"] } ] }, "advanced": { "description": "Real-time coordination, cross-instance communication, shared state (Iterations 13-20)", "urls": [ { "url": "https://developer.mozilla.org/en-US/docs/Web/API/Broadcast_Channel_API", "topic": "Broadcast Channel for cross-tab communication", "iteration_range": "13-15", "techniques": ["postMessage", "onmessage", "same-origin communication", "close"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API", "topic": "WebSocket for real-time multi-instance coordination", "iteration_range": "14-16", "techniques": ["connect", "send", "onmessage", "reconnection strategies"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API", "topic": "Service Workers for background sync", "iteration_range": "15-17", "techniques": ["registration", "fetch events", "cache API", "background sync"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events", "topic": "Server-Sent Events for live updates", "iteration_range": "14-16", "techniques": ["EventSource", "event listeners", "reconnection", "custom events"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API", "topic": "WebRTC for peer-to-peer data sharing", "iteration_range": "17-19", "techniques": ["RTCPeerConnection", "data channels", "signaling", "NAT traversal"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/SharedArrayBuffer", "topic": "SharedArrayBuffer for shared memory", "iteration_range": "18-20", "techniques": ["Atomics", "memory sharing", "synchronization", "race conditions"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/Notification", "topic": "Notifications API for cross-instance alerts", "iteration_range": "15-17", "techniques": ["requestPermission", "notification options", "click events", "persistence"] } ] }, "expert": { "description": "ML-powered features, semantic search, predictive analytics (Iterations 21+)", "urls": [ { "url": "https://www.tensorflow.org/js/tutorials", "topic": "TensorFlow.js for in-browser machine learning", "iteration_range": "21-23", "techniques": ["model loading", "inference", "training", "optimization"] }, { "url": "https://www.tensorflow.org/js/tutorials/conversion/import_saved_model", "topic": "Using pre-trained models for text classification", "iteration_range": "22-24", "techniques": ["model conversion", "inference", "preprocessing", "postprocessing"] }, { "url": "https://github.com/tensorflow/tfjs-models/tree/master/universal-sentence-encoder", "topic": "Universal Sentence Encoder for semantic search", "iteration_range": "23-25", "techniques": ["embeddings", "cosine similarity", "vector search", "caching"] }, { "url": "https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial", "topic": "WebGL for GPU-accelerated visualizations", "iteration_range": "24-26", "techniques": ["shaders", "buffers", "textures", "rendering pipeline"] }, { "url": "https://github.com/tensorflow/tfjs-examples", "topic": "TensorFlow.js examples for pattern recognition", "iteration_range": "21-25", "techniques": ["classification", "clustering", "anomaly detection", "time series"] } ] }, "dynamic_search_templates": [ "Claude Code transcript parsing site:stackoverflow.com", "IndexedDB full-text search implementation site:github.com", "JavaScript fuzzy string matching algorithms", "D3.js interactive timeline visualization", "WebSocket real-time coordination patterns", "Browser-based vector similarity search", "TensorFlow.js text classification tutorial", "Service Worker background sync patterns", "Canvas performance optimization techniques", "LocalStorage vs IndexedDB comparison" ], "fallback_resources": [ { "category": "General Web APIs", "url": "https://developer.mozilla.org/en-US/docs/Web/API", "use_when": "Specific API documentation needed" }, { "category": "JavaScript Patterns", "url": "https://javascript.info", "use_when": "Modern JavaScript techniques needed" }, { "category": "Data Visualization", "url": "https://observablehq.com/@d3", "use_when": "D3.js examples and patterns needed" }, { "category": "Machine Learning", "url": "https://www.tensorflow.org/js", "use_when": "ML implementation guidance needed" } ], "notes": [ "URLs progress from basic web APIs to advanced coordination and ML", "Each iteration should demonstrate specific techniques from assigned URL", "Foundation iterations establish core patterns that advanced iterations build upon", "Expert iterations combine multiple techniques from earlier learnings", "All tools must remain self-contained single HTML files", "Focus on developer tools that solve real Claude Code workflow challenges" ] }