makecc 0.2.18 → 0.2.19

package/dist/server/services/skillGeneratorService.js

@@ -4,23 +4,25 @@ import * as path from 'path';
 import { existsSync } from 'fs';
 import { spawn } from 'child_process';
 import { claudeMdService } from './claudeMdService';
-const SYSTEM_PROMPT = `You are a Claude Code skill generator. You MUST respond with ONLY a valid JSON object. No markdown, no code blocks, no explanations - just pure JSON.
+const SYSTEM_PROMPT = `You are an expert Claude Code skill generator. Generate production-quality skills with complete, working code.
 
-Your response must follow this exact JSON schema:
+RESPOND WITH ONLY A VALID JSON OBJECT - NO MARKDOWN, NO CODE BLOCKS, NO EXPLANATIONS.
+
+## JSON Schema
 
 {
-  "skillName": "Human readable skill name",
+  "skillName": "Human Readable Skill Name",
   "skillId": "skill-id-in-kebab-case",
-  "description": "Brief description of what this skill does",
+  "description": "Comprehensive description including what it does AND when to use it. Include trigger phrases in Korean. Example: 'PDF 문서에서 텍스트 추출 및 분석. \"PDF 읽어줘\", \"PDF 분석해줘\", \"PDF에서 텍스트 추출\" 등의 요청 시 사용.'",
   "files": [
     {
       "path": "SKILL.md",
-      "content": "Full SKILL.md content here",
+      "content": "Full SKILL.md content (see format below)",
       "language": "markdown"
     },
     {
       "path": "scripts/main.py",
-      "content": "Full Python script content here",
+      "content": "Full Python script (150-300 lines, production quality)",
       "language": "python"
     },
     {
@@ -31,36 +33,155 @@ Your response must follow this exact JSON schema:
   ]
 }
 
-SKILL.md must follow this format:
+## SKILL.md Format (MUST follow exactly)
+
 ---
 name: skill-id
-description: One line description
+description: Detailed description with trigger phrases. Include what it does AND specific Korean trigger phrases like "~해줘", "~만들어줘". This is the PRIMARY mechanism for skill activation.
 ---
 
 # Skill Name
 
-## When to use
-- Use case 1
-- Use case 2
+Brief description of what this skill does.
+
+## 실행 전 요구사항 (필수)
+
+List any prerequisites:
+- API keys needed (with instructions to check/request)
+- Environment setup
+- Dependencies
+
+## 빠른 시작
+
+\\\`\\\`\\\`bash
+.venv/bin/python .claude/skills/skill-id/scripts/main.py \\\\
+  --required-arg "value" \\\\
+  --output output.ext
+\\\`\\\`\\\`
+
+## 스크립트 옵션
+
+| 옵션 | 설명 | 기본값 |
+|------|------|--------|
+| \\\`--arg1\\\`, \\\`-a\\\` | Description | default |
+| \\\`--output\\\`, \\\`-o\\\` | 출력 경로 (필수) | - |
+
+## 사용 예시
+
+### 예시 1: Basic Usage
+\\\`\\\`\\\`bash
+.venv/bin/python .claude/skills/skill-id/scripts/main.py \\\\
+  --arg "value" --output result.ext
+\\\`\\\`\\\`
+
+### 예시 2: Advanced Usage
+\\\`\\\`\\\`bash
+.venv/bin/python .claude/skills/skill-id/scripts/main.py \\\\
+  --arg "value" --advanced-option
+\\\`\\\`\\\`
+
+## 제한사항
+
+- List any limitations or constraints
+
+## Python Script Requirements (scripts/main.py)
+
+The script MUST:
+1. Be 150-300 lines of COMPLETE, WORKING code
+2. Use argparse with --help support
+3. Include comprehensive error handling (try-except)
+4. Print Korean status messages with emoji (✅ 완료, ❌ 오류, ⏳ 처리 중)
+5. Check dependencies at startup with helpful install instructions
+6. Support common use cases with sensible defaults
+7. Include docstring with usage examples
+
+## Script Template Structure
+
+\\\`\\\`\\\`python
+#!/usr/bin/env python3
+"""
+Skill Name - Brief description
+
+Usage:
+    python main.py --arg "value" --output output.ext
+
+Examples:
+    python main.py --input data.txt --output result.txt
+"""
+
+import argparse
+import sys
+from pathlib import Path
+
+def check_dependencies():
+    """Check required packages"""
+    try:
+        import required_package
+        return True
+    except ImportError:
+        print("❌ required_package가 설치되어 있지 않습니다.")
+        print("   설치: uv pip install --python .venv/bin/python required_package")
+        return False
+
+def main_function(arg1, arg2, output_path):
+    """Main processing logic with error handling"""
+    print(f"⏳ 처리 중...")
+
+    try:
+        # Processing logic here
+        result = process(arg1, arg2)
+
+        # Save output
+        output_file = Path(output_path)
+        output_file.parent.mkdir(parents=True, exist_ok=True)
+
+        with open(output_file, 'w') as f:
+            f.write(result)
+
+        print(f"✅ 완료!")
+        print(f"   파일: {output_file}")
+        return str(output_file)
+
+    except Exception as e:
+        print(f"❌ 오류 발생: {e}")
+        sys.exit(1)
+
+def main():
+    parser = argparse.ArgumentParser(
+        description="Skill description",
+        formatter_class=argparse.RawDescriptionHelpFormatter,
+        epilog=\"\"\"
+예시:
+  python main.py --input data.txt --output result.txt
+  python main.py --input data.txt --output result.txt --option
+        \"\"\"
+    )
+
+    parser.add_argument("--input", "-i", required=True, help="입력 파일")
+    parser.add_argument("--output", "-o", required=True, help="출력 경로")
+    parser.add_argument("--option", action="store_true", help="옵션 설명")
+
+    args = parser.parse_args()
+
+    if not check_dependencies():
+        sys.exit(1)
 
-## Usage
-\`\`\`bash
-.venv/bin/python .claude/skills/skill-id/scripts/main.py [args]
-\`\`\`
+    main_function(args.input, args.option, args.output)
 
-## Parameters
-- \`--param1\`: Description
+if __name__ == "__main__":
+    main()
+\\\`\\\`\\\`
 
-## Example
-[Usage example]
+## Critical Rules
 
-RULES:
-1. Generate COMPLETE, WORKING code - no placeholders
-2. Include proper error handling with try-except
-3. Use Korean for user-facing messages
-4. Scripts run with .venv/bin/python (project local virtual environment)
-5. List all required packages in requirements.txt
-6. RESPOND WITH JSON ONLY - NO OTHER TEXT`;
+1. GENERATE COMPLETE, WORKING CODE - NO PLACEHOLDERS, NO "# TODO", NO "pass"
+2. Scripts must be 150-300 lines with real implementation
+3. Include ALL necessary imports and helper functions
+4. Use Korean for user-facing messages, English for code/logs
+5. description field MUST include Korean trigger phrases
+6. SKILL.md MUST have complete usage examples with actual commands
+7. Always include requirements.txt with specific packages needed
+8. RESPOND WITH JSON ONLY - NO OTHER TEXT`;
 export class SkillGeneratorService {
     projectRoot;
     constructor(projectRoot) {

package/dist/server/services/workflowAIService.js

@@ -39,7 +39,8 @@ ${AVAILABLE_TOOLS.join(', ')}
       "description": "입력 설명 (한글 가능)",
       "config": {
         "inputType": "text",
-        "placeholder": "입력 안내"
+        "placeholder": "입력 안내",
+        "defaultValue": "워크플로우에 적합한 예시 입력값"
       }
     },
     {
@@ -97,6 +98,7 @@ ${AVAILABLE_TOOLS.join(', ')}
 7. systemPrompt는 구체적이고 실행 가능한 지시사항으로 작성
 8. **중요: label은 반드시 영어로, kebab-case 형식으로 작성 (예: blog-writer, data-analyzer)**
 9. workflowName도 영어로 작성
+10. **필수: input 노드의 config에 반드시 defaultValue 포함 - 워크플로우 목적에 맞는 구체적인 예시 값을 한글로 제공**
 
 ## 예시
 
@@ -105,7 +107,7 @@ ${AVAILABLE_TOOLS.join(', ')}
   "workflowName": "Image Generation",
   "description": "3개의 이미지를 생성하는 워크플로우",
   "nodes": [
-    { "type": "input", "label": "image-prompt", "description": "생성할 이미지에 대한 설명", "config": { "inputType": "text", "placeholder": "이미지 프롬프트 입력" } },
+    { "type": "input", "label": "image-prompt", "description": "생성할 이미지에 대한 설명", "config": { "inputType": "text", "placeholder": "이미지 프롬프트 입력", "defaultValue": "미래적인 도시 야경, 네온 사인이 빛나는 사이버펑크 스타일" } },
     { "type": "skill", "label": "image-generator", "description": "AI로 이미지 생성", "config": { "skillType": "official", "skillId": "image-gen-nanobanana" } },
     { "type": "output", "label": "generated-images", "description": "생성된 이미지 결과", "config": { "outputType": "image" } }
   ],
@@ -117,7 +119,7 @@ ${AVAILABLE_TOOLS.join(', ')}
   "workflowName": "Data Analysis Report",
   "description": "데이터를 분석하고 보고서를 작성하는 워크플로우",
   "nodes": [
-    { "type": "input", "label": "data-file", "description": "분석할 데이터 파일", "config": { "inputType": "file" } },
+    { "type": "input", "label": "data-file", "description": "분석할 데이터 파일", "config": { "inputType": "file", "defaultValue": "2024년 1~3분기 매출 데이터: 1월 1200만, 2월 1350만, 3월 1100만, 4월 1500만, 5월 1650만, 6월 1400만, 7월 1800만, 8월 1750만, 9월 1900만" } },
     { "type": "agent", "label": "data-analyzer", "description": "데이터를 분석하고 인사이트 도출", "config": { "role": "analyst", "tools": ["Read", "Grep", "Glob"], "model": "sonnet", "systemPrompt": "주어진 데이터를 분석하여 핵심 인사이트를 도출하세요. 통계적 요약, 트렌드, 이상치를 파악하세요." } },
     { "type": "agent", "label": "report-writer", "description": "분석 결과로 보고서 작성", "config": { "role": "writer", "tools": ["Read", "Write"], "model": "opus", "systemPrompt": "분석 결과를 바탕으로 경영진을 위한 간결하고 명확한 보고서를 작성하세요." } },
     { "type": "output", "label": "analysis-report", "description": "최종 분석 보고서", "config": { "outputType": "document" } }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "makecc",
-  "version": "0.2.18",
+  "version": "0.2.19",
   "type": "module",
   "description": "Visual workflow builder for Claude Code agents and skills",
   "keywords": [
@@ -55,6 +55,7 @@
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
     "react-markdown": "^10.1.0",
+    "react-router-dom": "^7.13.0",
     "remark-gfm": "^4.0.1",
     "sharp": "^0.34.5",
     "socket.io": "^4.8.3",

package/server/index.ts

@@ -27,6 +27,7 @@ import { configLoaderService } from './services/configLoaderService';
 import { workflowExecutionService } from './services/workflowExecutionService';
 import { executeInTerminal, getClaudeCommand } from './services/terminalService';
 import { claudeMdService } from './services/claudeMdService';
+import { projectService } from './services/projectService';
 import type { WorkflowExecutionRequest, NodeExecutionUpdate } from './types';
 import type { ClaudeConfigExport, SaveOptions } from './services/fileService';
 
@@ -70,6 +71,72 @@ app.get('/api/project-path', (req, res) => {
   res.json({ path: fileService.getProjectPath() });
 });
 
+// ============================================
+// Project Management API
+// ============================================
+
+// List all projects
+app.get('/api/projects', async (req, res) => {
+  try {
+    const projects = await projectService.listProjects();
+    const gallery = projectService.getGalleryItems();
+    res.json({ projects, gallery });
+  } catch (error) {
+    const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+    console.error('List projects error:', errorMessage);
+    res.status(500).json({ message: errorMessage });
+  }
+});
+
+// Create a new project
+app.post('/api/projects', async (req, res) => {
+  try {
+    const { name, description } = req.body as { name: string; description: string };
+
+    if (!name || typeof name !== 'string') {
+      return res.status(400).json({ message: 'Project name is required' });
+    }
+
+    const project = await projectService.createProject(name, description || '');
+    res.json(project);
+  } catch (error) {
+    const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+    console.error('Create project error:', errorMessage);
+    res.status(500).json({ message: errorMessage });
+  }
+});
+
+// Get a specific project
+app.get('/api/projects/:id', async (req, res) => {
+  try {
+    const project = await projectService.getProject(req.params.id);
+    if (!project) {
+      return res.status(404).json({ message: 'Project not found' });
+    }
+    res.json(project);
+  } catch (error) {
+    const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+    res.status(500).json({ message: errorMessage });
+  }
+});
+
+// Delete a project
+app.delete('/api/projects/:id', async (req, res) => {
+  try {
+    await projectService.deleteProject(req.params.id);
+    res.json({ success: true });
+  } catch (error) {
+    const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+    console.error('Delete project error:', errorMessage);
+    res.status(500).json({ message: errorMessage });
+  }
+});
+
+// Get makecc home directory
+app.get('/api/makecc-home', (req, res) => {
+  res.json({ path: projectService.getMakeccHome() });
+});
+
 // Save workflow as Claude Code configuration
 app.post('/api/save/workflow', async (req, res) => {
   try {
@@ -648,8 +715,16 @@ async function startServer() {
     // 초기화 실패해도 서버는 시작
   }
 
+  // 샘플 프로젝트 생성 (~/makecc에 없는 경우)
+  try {
+    await projectService.createSampleProjects();
+  } catch (error) {
+    console.error('Sample projects creation warning:', error);
+  }
+
   httpServer.listen(PORT, () => {
     console.log(`Server running on http://localhost:${PORT}`);
+    console.log(`makecc home: ${projectService.getMakeccHome()}`);
   });
 }