app_runner
Automates launching the full stack by clearing ports 8080/5173 and starting backend and frontend services.
Install
mkdir -p .claude/skills/app-runner && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/14186" && unzip -o skill.zip -d .claude/skills/app-runner && rm skill.zipInstalls to .claude/skills/app-runner
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
A skill to run the backend (Go Fiber) and frontend (React/Vite) applications. It includes pre-run checks to clear the required ports (8080 and 5173) if they are already in use.Key capabilities
- →Check for processes running on specified ports
- →Terminate processes blocking ports 8080 and 5173
- →Start the backend Go Fiber application
- →Start the frontend React/Vite development server
- →Automate the entire application startup process
How it works
The skill first clears specified ports by terminating blocking processes, then starts the Go Fiber backend and the React/Vite frontend in separate background terminals.
Inputs & outputs
When to use app_runner
- →Start the full application stack
- →Restart server environments
- →Clear blocked development ports
About this skill
App Runner Skill
This skill automates the process of starting the Maulana Laundry application.
Prerequisites
- Go installed (for backend)
- Node.js and npm installed (for frontend)
- PostgreSQL database accessible (as configured in
backend/.env)
Usage
1. Check and Clear Ports
Before starting the applications, identify and terminate any processes running on ports 8080 (Backend) and 5173 (Frontend).
Command (macOS/Linux):
# Check and kill port 8080 (Backend)
lsof -ti:8080 | xargs kill -9 2>/dev/null || true
# Check and kill port 5173 (Frontend)
lsof -ti:5173 | xargs kill -9 2>/dev/null || true
2. Start Backend
Navigate to the backend directory and run the Go application.
Commands:
cd backend
go run cmd/main.go
3. Start Frontend
Navigate to the frontend directory and run the Vite development server.
Commands:
cd frontend
npm run dev
Note on Ports:
Vite usually runs on port 5173. However, if the system or another process is locking that port, it may automatically fall back to 5174. Check the terminal output to verify the active URL.
Automation Script
You can use the provided script .agent/skills/app_runner/scripts/run_app.sh to perform all steps in one go.
Running with Slash Command
If this skill is active, you can instruct the agent to "Run the application using the app_runner skill".
The agent should:
- Read this
SKILL.md. - Execute the port cleanup commands.
- Start the backend in a background terminal.
- Start the frontend in a background terminal.
When not to use it
- →When the application does not use Go Fiber for backend and React/Vite for frontend
- →When the required ports are not 8080 and 5173
Prerequisites
Limitations
- →The skill is tailored for the Maulana Laundry application.
- →The skill assumes specific port numbers (8080 and 5173).
- →The skill's port clearing commands are for macOS/Linux.
How it compares
This skill automates the setup and startup of a specific application stack, including port conflict resolution, providing a simplify process compared to manually executing multiple commands.
Compared to similar skills
app_runner side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| app_runner (this skill) | 0 | 6mo | Review | Beginner |
| webf-quickstart | 1 | 7mo | Review | Beginner |
| fullstack-guardian | 1 | 3mo | No flags | Advanced |
| podcast-generation | 1 | 3mo | Review | Advanced |
Try saying
Example prompts that trigger this skill in your AI assistant.
You might also like
webf-quickstart
openwebf
Get started with WebF development - setup WebF Go, create a React/Vue/Svelte project with Vite, and load your first app. Use when starting a new WebF project, onboarding new developers, or setting up development environment.
fullstack-guardian
Jeffallan
Use when implementing features across frontend and backend, building APIs with UI, or creating end-to-end data flows. Invoke for feature implementation, API development, UI building, cross-stack work.
podcast-generation
microsoft
Generate AI-powered podcast-style audio narratives using Azure OpenAI's GPT Realtime Mini model via WebSocket. Use when building text-to-speech features, audio narrative generation, podcast creation from content, or integrating with Azure OpenAI Realtime API for real audio output. Covers full-stack implementation from React frontend to Python FastAPI backend with WebSocket streaming.
react-server
lazarv
Build applications with @lazarv/react-server — a React Server Components runtime built on Vite. Covers use directives, file-system router, HTTP hooks, caching, live components, workers, MCP, deployment, and all core APIs.
hap-view-plugin
garfield-bb
创建和开发明道云 HAP 自定义视图插件的技能。**立即触发条件**:用户提到"HAP 视图插件"、"自定义视图"、"mdye"、"视图开发"、"插件开发"、"初始化视图项目"、"启动视图调试"。提供完整的开发工作流程、API 使用指南和最佳实践。
fullstack-developer
daithang59
|