In the vast digital realm, repositories stand as ancient fortresses containing powerful technological artifacts. Within their walls lie complex stacks of technologiesโlayered like the floors of a mystical tower, each serving a purpose, each connected in intricate ways. Most developers wander these halls without truly understanding the architecture that surrounds them. But you, brave adventurer, are about to become a Stack Detective, wielding the power of AI to illuminate every corner of these digital strongholds.
The legendary /stackattack command is your keyโa magical incantation that summons an AI companion trained in the ancient art of repository analysis. Together, you will systematically dissect and document entire technology stacks, transforming confusion into clarity and chaos into organized knowledge.
In the modern era of software development, understanding a repositoryโs technology stack is like possessing a master key to a fortress. Whether youโre:
โฆthe ability to systematically analyze and document a technology stack is an invaluable superpower. This quest teaches you to combine human insight with AI assistance to achieve mastery over any repository you encounter.
By the time you complete this epic journey, you will have mastered:
/stackattack AI Prompt - Install and configure the AI analysis toolYouโll know youโve truly mastered this quest when you can:
graph TB
subgraph "Prerequisites"
Hello[๐ฑ Hello n00b]
Terminal[๐ฐ Terminal Fundamentals]
end
subgraph "Current Quest"
Main[๐ Stack Attack Quest]
Side1[โ๏ธ Frontend Stack Analysis]
Side2[โ๏ธ Backend Stack Analysis]
Side3[โ๏ธ Infrastructure Analysis]
end
subgraph "Unlocked Adventures"
Arch[๐ฐ Architecture Documentation]
Dep[๐ฐ Dependency Security]
Migration[๐ Technology Migration Epic]
end
Hello --> Main
Terminal --> Main
Main --> Side1
Main --> Side2
Main --> Side3
Main --> Arch
Main --> Dep
Arch --> Migration
Dep --> Migration
style Main fill:#ffd700
style Side1 fill:#87ceeb
style Side2 fill:#87ceeb
style Side3 fill:#87ceeb
style Arch fill:#98fb98
style Dep fill:#98fb98
style Migration fill:#ff69b4
Before you can analyze the ancient repositories, you must first acquire the /stackattack commandโa powerful AI prompt that serves as your guide through the technology maze.
The /stackattack prompt is a specialized AI agent designed to systematically analyze repositories. Letโs summon it into your VS Code environment.
First, navigate to your VS Code User Data prompts folder:
๐ macOS Path:
cd ~/Library/Application\ Support/Code/User/prompts/
๐ช Windows Path:
cd $env:APPDATA\Code\User\prompts\
๐ง Linux Path:
cd ~/.config/Code/User/prompts/
Create a new file called stackattack.prompt.md with the following content:
---
mode: agent
title: Stack Attack - Repository Analysis Agent
description: Systematic technology stack analysis and documentation
---
# Stack Attack: Repository Analysis Protocol
You are a specialized repository analysis agent focused on identifying, documenting, and explaining technology stacks. Your mission is to help developers understand the complete technology landscape of any repository.
## Analysis Framework
When analyzing a repository, follow this systematic approach:
### 1. Initial Repository Reconnaissance
- Identify repository type (web app, library, tool, mobile app, etc.)
- Determine primary programming language(s)
- Locate configuration and manifest files
- Identify the project's purpose and domain
### 2. Technology Stack Layers
Analyze and document each layer of the stack:
#### **Frontend Technologies**
- Frameworks (React, Vue, Angular, etc.)
- UI Libraries and Component Systems
- Styling Solutions (CSS frameworks, preprocessors, CSS-in-JS)
- Build Tools and Bundlers
- State Management Solutions
#### **Backend Technologies**
- Server Framework (Express, Django, Rails, etc.)
- API Design (REST, GraphQL, gRPC)
- Authentication/Authorization Systems
- Server Runtime Environment
#### **Database Layer**
- Primary Database(s) (PostgreSQL, MongoDB, etc.)
- Caching Solutions (Redis, Memcached)
- Search Engines (Elasticsearch, Algolia)
- Data Migration Tools
#### **Infrastructure & DevOps**
- Containerization (Docker, Podman)
- Orchestration (Kubernetes, Docker Compose)
- CI/CD Pipelines (GitHub Actions, Jenkins, GitLab CI)
- Cloud Platforms (AWS, Azure, GCP)
- Monitoring and Logging Tools
#### **Development Tools**
- Package Managers
- Testing Frameworks
- Linting and Formatting Tools
- Documentation Generators
- Development Environment Configuration
### 3. Dependency Analysis
For each major technology, document:
- **Purpose**: Why is this technology used?
- **Version**: Current version in use
- **Dependencies**: What other technologies does it require?
- **Configuration**: Where and how is it configured?
- **Alternatives**: What alternatives exist?
### 4. Architecture Patterns
Identify and document:
- Architectural style (MVC, microservices, serverless, etc.)
- Design patterns in use
- Data flow and communication patterns
- Security implementations
- Scalability considerations
### 5. File Structure Analysis
Map the repository organization:
- Configuration file locations and purposes
- Source code organization
- Asset management
- Documentation structure
- Test file organization
## Output Format
Provide analysis in the following structured format:
```markdown
# Technology Stack Analysis: [Repository Name]
## Executive Summary
[Brief overview of the repository and its technology choices]
## Stack Overview
### Frontend Stack
| Technology | Version | Purpose | Configuration |
|------------|---------|---------|---------------|
| ... | ... | ... | ... |
### Backend Stack
| Technology | Version | Purpose | Configuration |
|------------|---------|---------|---------------|
| ... | ... | ... | ... |
### Database & Data Layer
| Technology | Version | Purpose | Configuration |
|------------|---------|---------|---------------|
| ... | ... | ... | ... |
### Infrastructure & DevOps
| Technology | Version | Purpose | Configuration |
|------------|---------|---------|---------------|
| ... | ... | ... | ... |
### Development Tools
| Technology | Version | Purpose | Configuration |
|------------|---------|---------|---------------|
| ... | ... | ... | ... |
## Architecture Overview
### System Architecture
[Describe the overall architecture pattern and design]
### Data Flow
[Explain how data moves through the system]
### Key Design Patterns
[List and explain major design patterns in use]
## Technology Relationships
```mermaid
graph TB
subgraph "Frontend"
UI[UI Framework]
State[State Management]
Styling[Styling Solution]
end
subgraph "Backend"
Server[Server Framework]
API[API Layer]
Auth[Authentication]
end
subgraph "Data"
DB[(Database)]
Cache[(Cache)]
end
UI --> API
State --> UI
Styling --> UI
API --> Server
Auth --> Server
Server --> DB
Server --> Cache
repository/
โโโ configuration/
โโโ source/
โโโ tests/
โโโ documentation/
โโโ infrastructure/
[List and explain critical production dependencies]
[List and explain development tooling]
[What developers need to run this project]
[Quick setup instructions based on stack analysis]
[Key commands for working with this stack]
[Advice for developers joining the project]
[Suggestions for keeping the stack healthy]
[Ideas for future technology updates]
## Analysis Guidelines
1. **Be Thorough**: Check all configuration files, dependencies, and documentation
2. **Be Accurate**: Verify version numbers and confirm technology usage
3. **Be Contextual**: Explain WHY technologies were likely chosen
4. **Be Practical**: Provide actionable insights and recommendations
5. **Be Visual**: Use diagrams to illustrate relationships when helpful
## Key Files to Analyze
Always check these files when present:
- `package.json` / `package-lock.json` (Node.js)
- `requirements.txt` / `Pipfile` / `pyproject.toml` (Python)
- `Gemfile` / `Gemfile.lock` (Ruby)
- `pom.xml` / `build.gradle` (Java)
- `Cargo.toml` (Rust)
- `go.mod` (Go)
- `composer.json` (PHP)
- `Dockerfile` / `docker-compose.yml` (Containerization)
- `.github/workflows/` (CI/CD)
- Configuration files (`*.config.js`, `*.yml`, etc.)
- README.md and other documentation
## Begin Analysis
When the user invokes `/stackattack`, ask:
1. "Which repository would you like me to analyze?"
2. "Do you have specific aspects of the stack you're most interested in?"
3. "Would you like a quick overview or comprehensive deep-dive analysis?"
Then proceed with systematic analysis based on the guidelines above.
Restart VS Code, then verify the prompt is available:
Cmd+Shift+P on macOS, Ctrl+Shift+P on Windows/Linux)/ and you should see stackattack in the list/stackattack prompt different from regular Copilot chat?Test your newly deployed Stack Attack spell:
In VS Code Chat:
/stackattack Let's analyze the it-journey repository
Watch as your AI assistant begins the systematic analysis!
Now that youโve summoned your AI Stack Detective, itโs time to put it to work analyzing a real repository.
For your first analysis, letโs use one of the repositories in your workspace. I recommend starting with:
๐ฏ Recommended Starter Repository: it-journey
Alternative Options:
barodybroject - Django/Python backend with OpenAI integrationzer0-mistakes - Jekyll theme developmentposthog - Complex production application with multiple technologiesBefore invoking /stackattack, do a manual reconnaissance:
# Navigate to the repository
cd ~/github/it-journey
# List root-level files
ls -la
# Look for key configuration files
ls -la | grep -E "\.(json|yml|yaml|toml|lock|txt)$"
# Check for container configuration
ls -la | grep -i docker
# Examine package managers
ls -la | grep -E "(package|Gemfile|requirements|go\.)"
๐ What to Look For:
package.json โ Node.js/JavaScript projectGemfile โ Ruby projectrequirements.txt or Pipfile โ Python projectdocker-compose.yml โ Containerized application_config.yml โ Jekyll or similar static site generator.github/workflows/ โ CI/CD automationOpen VS Code in the repository directory and start the analysis:
In VS Code Chat:
/stackattack Please analyze the it-journey repository in /Users/bamr87/github/it-journey.
I'm interested in understanding the complete stack for this Jekyll-based educational platform.
Provide a comprehensive analysis including:
1. All technologies and their versions
2. How they work together
3. The development workflow
4. Infrastructure and deployment setup
As the AI analyzes, you can ask follow-up questions:
Follow-up questions you might ask:
- "What is the purpose of the frontmatter.json file?"
- "Explain the Docker setup in docker-compose.yml"
- "What Jekyll plugins are being used and why?"
- "How does the CI/CD pipeline work in .github/workflows?"
- "What are the dependencies in the Gemfile used for?"
Objective: Analyze and compare two different repositories
Requirements:
/stackattack to analyze it-journey (Jekyll-based)/stackattack to analyze barodybroject (Django-based)Success Criteria:
Raw analysis data is valuable, but organized documentation is powerful. In this chapter, youโll learn to transform AI-generated analysis into professional, actionable documentation.
Create a new file: STACK_ANALYSIS.md in the root of the repository youโre analyzing.
# Technology Stack Analysis: [Repository Name]
> **Analysis Date**: [Current Date]
> **Analyst**: [Your Name]
> **Analysis Method**: AI-Assisted Stack Attack Protocol
> **Repository**: [GitHub URL]
## Table of Contents
1. [Executive Summary](#executive-summary)
2. [Technology Overview](#technology-overview)
3. [Stack Layers](#stack-layers)
4. [Architecture & Patterns](#architecture--patterns)
5. [Development Workflow](#development-workflow)
6. [Infrastructure & Deployment](#infrastructure--deployment)
7. [Dependencies](#dependencies)
8. [Recommendations](#recommendations)
## Executive Summary
[2-3 paragraph overview of the repository and its purpose, highlighting key technology choices]
### Quick Stats
- **Primary Language**: [Language]
- **Framework**: [Main Framework]
- **Lines of Code**: [Approximate count]
- **Contributors**: [Number]
- **Last Updated**: [Date]
## Technology Overview
### Stack Diagram
```mermaid
graph TB
subgraph "User Interface"
Browser[Web Browser]
end
subgraph "Frontend Layer"
Jekyll[Jekyll Static Generator]
Markdown[Markdown Content]
Liquid[Liquid Templates]
end
subgraph "Development Environment"
Docker[Docker Container]
Ruby[Ruby Environment]
Gems[Ruby Gems]
end
subgraph "Deployment"
GitHub[GitHub Pages]
Actions[GitHub Actions]
end
Browser --> Jekyll
Jekyll --> Markdown
Jekyll --> Liquid
Jekyll --> Ruby
Ruby --> Gems
Docker --> Ruby
Actions --> GitHub
Jekyll --> GitHub
| Technology | Version | Purpose | Configuration |
|---|---|---|---|
| Jekyll | 4.3.x | Static site generator | _config.yml |
| Bootstrap | 5.x | CSS framework | CDN links in templates |
| Liquid | Built-in | Templating engine | .html files in _layouts/ |
| Markdown | CommonMark | Content authoring | .md files throughout |
Key Features:
[Note: For static sites, this may be minimal or focused on build process]
| Technology | Version | Purpose | Configuration |
|---|---|---|---|
| Ruby | 2.7+ | Runtime environment | .ruby-version |
| Bundler | Latest | Dependency management | Gemfile, Gemfile.lock |
| Technology | Version | Purpose | Configuration |
|---|---|---|---|
| Docker | Latest | Containerization | Dockerfile, docker-compose.yml |
| VS Code | Latest | Development environment | .vscode/ settings |
| Git | Latest | Version control | .gitignore |
| Technology | Version | Purpose | Configuration |
|---|---|---|---|
| GitHub Actions | N/A | Continuous integration | .github/workflows/ |
| GitHub Pages | N/A | Static hosting | Repository settings |
Content Structure:
โโโ Pages (Markdown files)
โ โโโ Collections (_posts, _quests, _docs)
โ โโโ Standalone pages
โโโ Layouts (HTML + Liquid templates)
โ โโโ Inheritance hierarchy
โโโ Includes (Reusable components)
โ โโโ Modular template pieces
โโโ Data Files (_data/)
โ โโโ Structured content (YAML, JSON)
โโโ Assets (Static files)
โโโ CSS stylesheets
โโโ JavaScript
โโโ Images
# 1. Clone repository
git clone https://github.com/bamr87/it-journey.git
cd it-journey
# 2. Start Docker environment
docker-compose up -d
# 3. Access local site
open http://localhost:4000
Development Container (docker-compose.yml):
services:
jekyll:
image: jekyll/jekyll:latest
ports:
- "4000:4000"
volumes:
- ./:/app
environment:
- JEKYLL_ENV=development
Benefits:
graph LR
A[Git Push] --> B[GitHub Actions]
B --> C[Build Jekyll Site]
C --> D{Tests Pass?}
D -->|Yes| E[Deploy to GitHub Pages]
D -->|No| F[Notify Developer]
E --> G[Live Site]
Deployment Steps:
main branch# Core Jekyll
gem "jekyll", "~> 4.3"
# Jekyll Plugins
gem "jekyll-feed", "~> 0.17" # RSS feed generation
gem "jekyll-seo-tag", "~> 2.8" # SEO optimization
gem "jekyll-sitemap", "~> 1.4" # Sitemap generation
gem "jekyll-paginate", "~> 1.1" # Pagination support
# Theme
gem "jekyll-theme-zer0", "~> 1.0" # Custom theme
# Testing and quality
gem "rspec", "~> 3.12" # Testing framework
gem "rubocop", "~> 1.57" # Ruby linter
# Development tools
gem "webrick", "~> 1.8" # Local web server
bundle outdated]README.md for project overviewCONTRIBUTING.md for contribution guidelinespages/_quests/ for example contentfrontmatter.jsonCONTRIBUTING.mdThis analysis was generated using the Stack Attack protocol, combining AI-assisted investigation with manual verification and domain expertise.
#### Step 4: Enhance with Visual Diagrams
Add Mermaid diagrams to visualize complex relationships:
**Technology Stack Layers:**
```mermaid
graph TB
subgraph "Presentation Layer"
HTML[HTML Templates]
CSS[CSS Styling]
JS[JavaScript]
end
subgraph "Content Layer"
MD[Markdown Files]
FM[Frontmatter Data]
DATA[Data Files]
end
subgraph "Processing Layer"
Jekyll[Jekyll Engine]
Liquid[Liquid Processor]
Plugins[Jekyll Plugins]
end
subgraph "Infrastructure"
Docker[Docker]
GitHub[GitHub Pages]
Actions[CI/CD]
end
MD --> Jekyll
FM --> Jekyll
DATA --> Jekyll
Jekyll --> Liquid
Liquid --> HTML
HTML --> CSS
HTML --> JS
Docker --> Jekyll
Jekyll --> GitHub
Actions --> GitHub
Data Flow Diagram:
sequenceDiagram
participant Dev as Developer
participant Local as Local Environment
participant Git as Git Repository
participant CI as GitHub Actions
participant Prod as GitHub Pages
Dev->>Local: Edit content
Local->>Local: Jekyll builds site
Dev->>Local: Preview changes
Dev->>Git: Commit & push
Git->>CI: Trigger workflow
CI->>CI: Run tests
CI->>CI: Build site
CI->>Prod: Deploy
Prod->>Prod: Site live
Objective: Create a comprehensive stack analysis document for your chosen repository
Requirements:
Success Criteria:
Youโve mastered the basics of stack analysis. Now letโs explore advanced techniques for deeper insights.
Understand the full depth of your dependency chain:
For Node.js Projects:
# Generate dependency tree
npm list --all > dependency-tree.txt
# Visual tree (limited depth)
npm list --depth=2
# Find specific dependency path
npm why package-name
# Check for circular dependencies
npm ls --parseable | awk '{print}' | xargs -I{} sh -c 'npm list --depth=0 | grep {}'
For Ruby Projects:
# Show dependency tree
bundle list --verbose
# Check dependency versions
bundle outdated
# Analyze dependency graph
bundle viz --format=png --requirements
For Python Projects:
# Generate dependency tree
pip install pipdeptree
pipdeptree
# Show reverse dependencies
pipdeptree --reverse
# Check for conflicts
pipdeptree --warn conflict
GitHub Dependabot:
# .github/dependabot.yml
version: 2
updates:
- package-ecosystem: "npm"
directory: "/"
schedule:
interval: "weekly"
open-pull-requests-limit: 10
Manual Security Audits:
# Node.js
npm audit
npm audit fix
# Ruby
bundle audit check
bundle audit update
# Python
pip install safety
safety check
# General tool (any language)
# Install Snyk CLI
snyk test
snyk monitor
Analyze codebase characteristics:
# Count lines of code by language
cloc .
# Find large files
find . -type f -name "*.py" -exec wc -l {} + | sort -rn | head -20
# Identify complex files (high cyclomatic complexity)
# For Python
radon cc . -a -nb
# For JavaScript
npx plato -r -d report src/
Automated configuration file finder:
# Find all configuration files
find . -type f \( \
-name "*.config.js" -o \
-name "*.config.ts" -o \
-name "*.json" -o \
-name "*.yml" -o \
-name "*.yaml" -o \
-name ".env*" -o \
-name "Dockerfile*" -o \
-name "*file" \
) ! -path "*/node_modules/*" ! -path "*/.git/*"
# Extract configuration insights
for file in $(find . -name "*.config.js" ! -path "*/node_modules/*"); do
echo "=== $file ==="
head -20 "$file"
echo ""
done
Objective: Conduct a comprehensive security and dependency audit
Requirements:
Deliverables:
Objective: Conduct a comprehensive comparative analysis of three repositories from your workspace
The Challenge: Choose three repositories with different technology approaches (e.g., it-journey, barodybroject, zer0-mistakes) and create a detailed comparative analysis.
Requirements:
/stackattack to analyze all three repositoriesSTACK_ANALYSIS.md for eachSTACK_COMPARISON.md comparing the threeSuccess Criteria:
Bonus Points:
Before declaring victory over the Stack Attack quest, verify youโve achieved all objectives:
/stackattack prompt successfully deployed in VS CodeSTACK_ANALYSIS.md created with all required sectionsAnswer these questions to verify your mastery:
Ensure youโve created these artifacts for your portfolio:
STACK_ANALYSIS.md documentYour Stack Attack mastery connects to:
cloc - Count lines of codetokei - Code statisticsnpm-check-updates - Dependency updatesbundle-audit - Ruby security scannersafety - Python security scannerPackage Manager Commands:
# npm (Node.js)
npm list --all # Full dependency tree
npm outdated # Check for updates
npm audit # Security audit
# bundler (Ruby)
bundle list # List all gems
bundle outdated # Check for updates
bundle audit # Security audit
# pip (Python)
pip list # List packages
pip list --outdated # Check for updates
pipdeptree # Dependency tree
Git Repository Analysis:
# Repository statistics
git log --pretty=format: --name-only | sort | uniq -c | sort -rg | head -20
# Find large files
git rev-list --objects --all | \
git cat-file --batch-check='%(objecttype) %(objectname) %(objectsize) %(rest)' | \
awk '/^blob/ {print substr($0,6)}' | sort --numeric-sort --key=2 | tail -20
# Contributor statistics
git shortlog -sn
# Recent activity
git log --since="1 month ago" --oneline --all
Youโve completed the Stack Attack quest and earned the title of Repository Analysis Master. You now possess the power to:
โจ Systematically analyze any technology stack
๐ Create professional documentation that guides teams
๐ก๏ธ Identify security vulnerabilities and technical debt
๐ฏ Make informed recommendations about technology choices
๐ค Leverage AI to enhance your investigation capabilities
Your journey through the digital realm has taught you to see beyond the surface of repositories, understanding the intricate web of technologies that power modern software. This knowledge will serve you in every project you encounter, making you a valuable asset to any development team.
Remember: Technology stacks evolve constantly. Return to this quest periodically to refresh your skills and learn new analysis techniques as tools and best practices advance.
Share your victory:
May your code be clean, your stacks be documented, and your repositories be forever understandable! ๐
Quest Completed: {date}
Stack Detective Level: Master
Repositories Analyzed: {count}
Documentation Created: {artifacts}
Achievement Unlocked: You are now a Guardian of Technical Knowledge ๐