@jarrodmedrano/claude-skills 1.0.0

package/README.md

@@ -0,0 +1,186 @@
+# Claude Code Skills
+
+Reusable Claude Code skills for web development projects. This package provides a collection of powerful skills for scaffolding and managing projects with Claude Code.
+
+## Installation
+
+### Install as npm package (recommended)
+
+In any project where you want to use these skills:
+
+```bash
+npm install @jarrodmedrano/claude-skills
+```
+
+The skills will automatically be copied to your project's `.claude/skills/` directory during installation.
+
+### Use as local directory
+
+Alternatively, you can use this directory directly as your Claude Code projects hub.
+
+## Quick Start
+
+Once installed, you can use custom skills to quickly scaffold new projects:
+
+### Available Skills
+
+#### `/new-website [project-name]`
+Create a new frontend web project with your choice of:
+- Next.js (App Router + TypeScript + Tailwind)
+- React + Vite
+- Vue 3 + Vite
+- Vanilla JS/TS
+
+**Example:**
+```
+/new-website my-portfolio
+```
+
+#### `/new-backend [project-name]`
+Create a new backend/API project with:
+- Express.js + TypeScript
+- Fastify + TypeScript
+- NestJS
+- Hono
+
+**Example:**
+```
+/new-backend my-api
+```
+
+#### `/new-fullstack [project-name]`
+Create a full-stack application with:
+- Next.js (with API routes)
+- T3 Stack (Next.js + tRPC + Prisma)
+- MERN Stack
+- Monorepo (separate frontend/backend)
+
+**Example:**
+```
+/new-fullstack my-saas-app
+```
+
+#### `/project-setup [project-name]`
+Initialize any type of project with tooling:
+- Libraries
+- CLI tools
+- Static sites
+- Browser extensions
+- Electron apps
+- Component libraries
+
+**Example:**
+```
+/project-setup my-tool
+```
+
+## Directory Structure
+
+```
+jarrod-claude/
+├── .claude/
+│   └── skills/          # Custom Claude Code skills
+├── project-1/           # Your projects will be created here
+├── project-2/
+└── README.md           # This file
+```
+
+## Usage Tips
+
+1. **Starting a new project**: Use one of the skills above
+2. **Working on existing project**: Navigate to the project directory or specify the path
+3. **Custom skills**: Add new skills in `.claude/skills/` as markdown files
+
+## What Gets Created
+
+When you use these skills, Claude will:
+- Create the project directory
+- Initialize with the chosen framework/stack
+- Install dependencies
+- Set up TypeScript configuration
+- Create basic project structure
+- Initialize git repository
+- Generate README with getting started instructions
+
+## Next Steps
+
+1. Navigate to this directory in your terminal
+2. Run `claude` to start Claude Code
+3. Use `/new-website my-first-site` (or any skill) to create your first project
+4. Claude will guide you through setup options
+
+## Updating Skills
+
+To get the latest skills after updating the package:
+
+```bash
+npm update @jarrodmedrano/claude-skills
+npm run update-skills
+```
+
+Or use the CLI:
+
+```bash
+npx claude-skills update
+```
+
+## CLI Commands
+
+The package includes a CLI for managing skills:
+
+```bash
+npx claude-skills install   # Install/reinstall skills
+npx claude-skills update    # Update skills to latest
+npx claude-skills list      # List all available skills
+npx claude-skills help      # Show help
+```
+
+## Publishing Your Own Version
+
+If you want to publish your own version of these skills:
+
+1. Update the package name in [package.json](package.json):
+   ```json
+   {
+     "name": "@yourusername/claude-skills"
+   }
+   ```
+
+2. Publish to npm:
+   ```bash
+   npm login
+   npm publish --access public
+   ```
+
+3. Others can install with:
+   ```bash
+   npm install @yourusername/claude-skills
+   ```
+
+## Development
+
+To add new skills:
+
+1. Create a `.md` file in [.claude/skills/](.claude/skills/) or a directory for complex skills
+2. Follow the existing skill format
+3. Update the version in [package.json](package.json)
+4. Publish the new version
+
+## Customization
+
+You can modify the skills in [.claude/skills/](.claude/skills/) to match your preferred setup, add new frameworks, or change default configurations.
+
+## Requirements
+
+- Node.js (v18+ recommended)
+- npm or pnpm
+- Git
+- Claude Code CLI
+
+## License
+
+MIT
+
+---
+
+Happy coding!

package/bin/cli.js

@@ -0,0 +1,44 @@
+#!/usr/bin/env node
+
+const { copySkills } = require('../scripts/install');
+
+const args = process.argv.slice(2);
+const command = args[0];
+
+switch (command) {
+  case 'install':
+    console.log('Installing Claude Code skills...');
+    copySkills();
+    break;
+
+  case 'update':
+    console.log('Updating Claude Code skills...');
+    copySkills();
+    break;
+
+  case 'list':
+    console.log('Available Claude Code Skills:\n');
+    console.log('Web Development:');
+    console.log('  /new-website    - Create frontend projects (React, Next.js, Vue, Vanilla)');
+    console.log('  /new-backend    - Create backend APIs (Express, Fastify, NestJS, Hono)');
+    console.log('  /new-fullstack  - Create full-stack apps (Next.js, T3, MERN, Monorepo)');
+    console.log('  /project-setup  - Initialize any project with tooling\n');
+    console.log('Code Quality:');
+    console.log('  /code-review    - Code review workflows');
+    console.log('  /design-review  - Design review workflows');
+    console.log('  /security-review - Security review workflows\n');
+    break;
+
+  case 'help':
+  default:
+    console.log('Claude Code Skills CLI\n');
+    console.log('Usage: claude-skills <command>\n');
+    console.log('Commands:');
+    console.log('  install  - Install skills to current project');
+    console.log('  update   - Update skills to latest version');
+    console.log('  list     - List all available skills');
+    console.log('  help     - Show this help message\n');
+    console.log('After installation, use skills in Claude Code:');
+    console.log('  Example: /new-website my-app');
+    break;
+}

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@jarrodmedrano/claude-skills",
+  "version": "1.0.0",
+  "description": "Reusable Claude Code skills for web development projects",
+  "main": "index.js",
+  "bin": {
+    "claude-skills": "./bin/cli.js"
+  },
+  "scripts": {
+    "postinstall": "node scripts/install.js",
+    "update-skills": "node scripts/update.js"
+  },
+  "keywords": [
+    "claude-code",
+    "claude",
+    "skills",
+    "web-development",
+    "scaffolding",
+    "project-setup"
+  ],
+  "author": "Jarrod Medrano",
+  "license": "MIT",
+  "files": [
+    ".claude/skills/**/*",
+    "scripts/**/*",
+    "bin/**/*",
+    "README.md"
+  ],
+  "engines": {
+    "node": ">=18.0.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/jarrodmedrano/jarrod-claude-skills.git"
+  },
+  "bugs": {
+    "url": "https://github.com/jarrodmedrano/jarrod-claude-skills/issues"
+  },
+  "homepage": "https://github.com/jarrodmedrano/jarrod-claude-skills#readme"
+}

package/scripts/install.js

@@ -0,0 +1,75 @@
+#!/usr/bin/env node
+
+const fs = require('fs');
+const path = require('path');
+
+/**
+ * Post-install script that copies Claude Code skills to the project's .claude directory
+ */
+
+function copySkills() {
+  // Find the project root (where package.json is, going up from node_modules)
+  let currentDir = process.cwd();
+
+  // If we're in node_modules, go up to find the project root
+  if (currentDir.includes('node_modules')) {
+    const parts = currentDir.split(path.sep);
+    const nodeModulesIndex = parts.lastIndexOf('node_modules');
+    currentDir = parts.slice(0, nodeModulesIndex).join(path.sep);
+  }
+
+  const targetDir = path.join(currentDir, '.claude', 'skills');
+  const sourceDir = path.join(__dirname, '..', '.claude', 'skills');
+
+  // Create .claude/skills directory if it doesn't exist
+  if (!fs.existsSync(targetDir)) {
+    fs.mkdirSync(targetDir, { recursive: true });
+    console.log('✓ Created .claude/skills directory');
+  }
+
+  // Copy skills
+  try {
+    copyRecursive(sourceDir, targetDir);
+    console.log('✓ Claude Code skills installed successfully!');
+    console.log(`  Skills location: ${targetDir}`);
+    console.log('\nAvailable skills:');
+    console.log('  /new-website    - Create frontend projects');
+    console.log('  /new-backend    - Create backend APIs');
+    console.log('  /new-fullstack  - Create full-stack apps');
+    console.log('  /project-setup  - Initialize any project');
+    console.log('  /code-review    - Code review workflows');
+    console.log('  /design-review  - Design review workflows');
+    console.log('  /security-review - Security review workflows');
+    console.log('\nTo update skills later, run: npm run update-skills');
+  } catch (error) {
+    console.error('Error copying skills:', error.message);
+    process.exit(1);
+  }
+}
+
+function copyRecursive(src, dest) {
+  const exists = fs.existsSync(src);
+  const stats = exists && fs.statSync(src);
+  const isDirectory = exists && stats.isDirectory();
+
+  if (isDirectory) {
+    if (!fs.existsSync(dest)) {
+      fs.mkdirSync(dest, { recursive: true });
+    }
+    fs.readdirSync(src).forEach(childItem => {
+      copyRecursive(
+        path.join(src, childItem),
+        path.join(dest, childItem)
+      );
+    });
+  } else {
+    fs.copyFileSync(src, dest);
+  }
+}
+
+// Only run if this is being executed directly (not required as a module)
+if (require.main === module) {
+  copySkills();
+}
+
+module.exports = { copySkills };

package/scripts/update.js

@@ -0,0 +1,6 @@
+#!/usr/bin/env node
+
+const { copySkills } = require('./install');
+
+console.log('Updating Claude Code skills...');
+copySkills();