| name | development |
| description | Comprehensive web, mobile, and backend development workflow bundling frontend, backend, full-stack, and mobile development skills for end-to-end application delivery. |
| category | workflow-bundle |
| risk | safe |
| source | personal |
| date_added | 2026-02-27 |
Development Workflow Bundle
Overview
Consolidated workflow for end-to-end software development covering web, mobile, and backend development. This bundle orchestrates skills for building production-ready applications from scaffolding to deployment.
When to Use This Workflow
Use this workflow when:
- Building new web or mobile applications
- Adding features to existing applications
- Refactoring or modernizing legacy code
- Setting up new projects with best practices
- Full-stack feature development
- Cross-platform application development
Workflow Phases
Phase 1: Project Setup and Scaffolding
Skills to Invoke
app-builder - Main application building orchestratorsenior-fullstack - Full-stack development guidanceenvironment-setup-guide - Development environment setupconcise-planning - Task planning and breakdown
Actions
- Determine project type (web, mobile, full-stack)
- Select technology stack
- Scaffold project structure
- Configure development environment
- Set up version control and CI/CD
Copy-Paste Prompts
Use @app-builder to scaffold a new React + Node.js full-stack application
Use @senior-fullstack to set up a Next.js 14 project with App Router
Use @environment-setup-guide to configure my development environment
Phase 2: Frontend Development
Skills to Invoke
frontend-developer - React/Next.js component developmentfrontend-design - UI/UX design implementationreact-patterns - Modern React patternstypescript-pro - TypeScript best practicestailwind-patterns - Tailwind CSS stylingnextjs-app-router-patterns - Next.js 14+ patterns
Actions
- Design component architecture
- Implement UI components
- Set up state management
- Configure routing
- Apply styling and theming
- Implement responsive design
Copy-Paste Prompts
Use @frontend-developer to create a dashboard component with React and TypeScript
Use @react-patterns to implement proper state management with Zustand
Use @tailwind-patterns to style components with a consistent design system
Phase 3: Backend Development
Skills to Invoke
backend-architect - Backend architecture designbackend-dev-guidelines - Backend development standardsnodejs-backend-patterns - Node.js/Express patternsfastapi-pro - FastAPI developmentapi-design-principles - REST/GraphQL API designauth-implementation-patterns - Authentication implementation
Actions
- Design API architecture
- Implement REST/GraphQL endpoints
- Set up database connections
- Implement authentication/authorization
- Configure middleware
- Set up error handling
Copy-Paste Prompts
Use @backend-architect to design a microservices architecture for my application
Use @nodejs-backend-patterns to create Express.js API endpoints
Use @auth-implementation-patterns to implement JWT authentication
Phase 4: Database Development
Skills to Invoke
database-architect - Database designdatabase-design - Schema design principlesprisma-expert - Prisma ORMpostgresql - PostgreSQL optimizationneon-postgres - Serverless Postgres
Actions
- Design database schema
- Create migrations
- Set up ORM
- Optimize queries
- Configure connection pooling
Copy-Paste Prompts
Use @database-architect to design a normalized schema for an e-commerce platform
Use @prisma-expert to set up Prisma ORM with TypeScript
Phase 5: Testing
Skills to Invoke
test-driven-development - TDD workflowjavascript-testing-patterns - Jest/Vitest testingpython-testing-patterns - pytest testinge2e-testing-patterns - Playwright/Cypress E2Eplaywright-skill - Browser automation testing
Actions
- Write unit tests
- Create integration tests
- Set up E2E tests
- Configure CI test runners
- Achieve coverage targets
Copy-Paste Prompts
Use @test-driven-development to implement features with TDD
Use @playwright-skill to create E2E tests for critical user flows
Phase 6: Code Quality and Review
Skills to Invoke
code-reviewer - AI-powered code reviewclean-code - Clean code principleslint-and-validate - Linting and validationsecurity-scanning-security-sast - Static security analysis
Actions
- Run linters and formatters
- Perform code review
- Fix code quality issues
- Run security scans
- Address vulnerabilities
Copy-Paste Prompts
Use @code-reviewer to review my pull request
Use @lint-and-validate to check code quality
Phase 7: Build and Deployment
Skills to Invoke
deployment-engineer - Deployment orchestrationdocker-expert - Containerizationvercel-deployment - Vercel deploymentgithub-actions-templates - CI/CD workflowscicd-automation-workflow-automate - CI/CD automation
Actions
- Create Dockerfiles
- Configure build pipelines
- Set up deployment workflows
- Configure environment variables
- Deploy to production
Copy-Paste Prompts
Use @docker-expert to containerize my application
Use @vercel-deployment to deploy my Next.js app to production
Use @github-actions-templates to set up CI/CD pipeline
Technology-Specific Workflows
React/Next.js Development
Skills: frontend-developer, react-patterns, nextjs-app-router-patterns, typescript-pro, tailwind-patterns
Python/FastAPI Development
Skills: fastapi-pro, python-pro, python-patterns, pydantic-models-py
Node.js/Express Development
Skills: nodejs-backend-patterns, javascript-pro, typescript-pro, express (via nodejs-backend-patterns)
Full-Stack Development
Skills: senior-fullstack, app-builder, frontend-developer, backend-architect, database-architect
Mobile Development
Skills: mobile-developer, react-native-architecture, flutter-expert, ios-developer
Quality Gates
Before moving to next phase, verify:
Related Workflow Bundles
wordpress - WordPress-specific developmentsecurity-audit - Security testing workflowtesting-qa - Comprehensive testing workflowdocumentation - Documentation generation workflow
