[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-3e462044-c89c-48ba-8a59-249a970b068b":3,"$f-Ui3pll1EvGn4idP-DfX1urZA-h_h3qKKMBm6zDzaUU":43},{"id":4,"title":5,"description":6,"categoryId":7,"moduleId":8,"tags":9,"prompt":10,"icon":11,"source":12,"sourceUrl":13,"authorId":14,"authorName":15,"isPublic":16,"stars":17,"runs":18,"createdAt":19,"updatedAt":19,"module":20,"category":27,"packages":34},"3e462044-c89c-48ba-8a59-249a970b068b","development","全面网络、移动和后端开发工作流程，整合前端、后端、全栈和移动开发技能，实现端到端应用交付。","cat_life_career","mod_other","sickn33,other","---\nname: development\ndescription: \"Comprehensive web, mobile, and backend development workflow bundling frontend, backend, full-stack, and mobile development skills for end-to-end application delivery.\"\ncategory: workflow-bundle\nrisk: safe\nsource: personal\ndate_added: \"2026-02-27\"\n---\n\n# Development Workflow Bundle\n\n## Overview\n\nConsolidated 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.\n\n## When to Use This Workflow\n\nUse this workflow when:\n- Building new web or mobile applications\n- Adding features to existing applications\n- Refactoring or modernizing legacy code\n- Setting up new projects with best practices\n- Full-stack feature development\n- Cross-platform application development\n\n## Workflow Phases\n\n### Phase 1: Project Setup and Scaffolding\n\n#### Skills to Invoke\n- `app-builder` - Main application building orchestrator\n- `senior-fullstack` - Full-stack development guidance\n- `environment-setup-guide` - Development environment setup\n- `concise-planning` - Task planning and breakdown\n\n#### Actions\n1. Determine project type (web, mobile, full-stack)\n2. Select technology stack\n3. Scaffold project structure\n4. Configure development environment\n5. Set up version control and CI\u002FCD\n\n#### Copy-Paste Prompts\n```\nUse @app-builder to scaffold a new React + Node.js full-stack application\n```\n\n```\nUse @senior-fullstack to set up a Next.js 14 project with App Router\n```\n\n```\nUse @environment-setup-guide to configure my development environment\n```\n\n### Phase 2: Frontend Development\n\n#### Skills to Invoke\n- `frontend-developer` - React\u002FNext.js component development\n- `frontend-design` - UI\u002FUX design implementation\n- `react-patterns` - Modern React patterns\n- `typescript-pro` - TypeScript best practices\n- `tailwind-patterns` - Tailwind CSS styling\n- `nextjs-app-router-patterns` - Next.js 14+ patterns\n\n#### Actions\n1. Design component architecture\n2. Implement UI components\n3. Set up state management\n4. Configure routing\n5. Apply styling and theming\n6. Implement responsive design\n\n#### Copy-Paste Prompts\n```\nUse @frontend-developer to create a dashboard component with React and TypeScript\n```\n\n```\nUse @react-patterns to implement proper state management with Zustand\n```\n\n```\nUse @tailwind-patterns to style components with a consistent design system\n```\n\n### Phase 3: Backend Development\n\n#### Skills to Invoke\n- `backend-architect` - Backend architecture design\n- `backend-dev-guidelines` - Backend development standards\n- `nodejs-backend-patterns` - Node.js\u002FExpress patterns\n- `fastapi-pro` - FastAPI development\n- `api-design-principles` - REST\u002FGraphQL API design\n- `auth-implementation-patterns` - Authentication implementation\n\n#### Actions\n1. Design API architecture\n2. Implement REST\u002FGraphQL endpoints\n3. Set up database connections\n4. Implement authentication\u002Fauthorization\n5. Configure middleware\n6. Set up error handling\n\n#### Copy-Paste Prompts\n```\nUse @backend-architect to design a microservices architecture for my application\n```\n\n```\nUse @nodejs-backend-patterns to create Express.js API endpoints\n```\n\n```\nUse @auth-implementation-patterns to implement JWT authentication\n```\n\n### Phase 4: Database Development\n\n#### Skills to Invoke\n- `database-architect` - Database design\n- `database-design` - Schema design principles\n- `prisma-expert` - Prisma ORM\n- `postgresql` - PostgreSQL optimization\n- `neon-postgres` - Serverless Postgres\n\n#### Actions\n1. Design database schema\n2. Create migrations\n3. Set up ORM\n4. Optimize queries\n5. Configure connection pooling\n\n#### Copy-Paste Prompts\n```\nUse @database-architect to design a normalized schema for an e-commerce platform\n```\n\n```\nUse @prisma-expert to set up Prisma ORM with TypeScript\n```\n\n### Phase 5: Testing\n\n#### Skills to Invoke\n- `test-driven-development` - TDD workflow\n- `javascript-testing-patterns` - Jest\u002FVitest testing\n- `python-testing-patterns` - pytest testing\n- `e2e-testing-patterns` - Playwright\u002FCypress E2E\n- `playwright-skill` - Browser automation testing\n\n#### Actions\n1. Write unit tests\n2. Create integration tests\n3. Set up E2E tests\n4. Configure CI test runners\n5. Achieve coverage targets\n\n#### Copy-Paste Prompts\n```\nUse @test-driven-development to implement features with TDD\n```\n\n```\nUse @playwright-skill to create E2E tests for critical user flows\n```\n\n### Phase 6: Code Quality and Review\n\n#### Skills to Invoke\n- `code-reviewer` - AI-powered code review\n- `clean-code` - Clean code principles\n- `lint-and-validate` - Linting and validation\n- `security-scanning-security-sast` - Static security analysis\n\n#### Actions\n1. Run linters and formatters\n2. Perform code review\n3. Fix code quality issues\n4. Run security scans\n5. Address vulnerabilities\n\n#### Copy-Paste Prompts\n```\nUse @code-reviewer to review my pull request\n```\n\n```\nUse @lint-and-validate to check code quality\n```\n\n### Phase 7: Build and Deployment\n\n#### Skills to Invoke\n- `deployment-engineer` - Deployment orchestration\n- `docker-expert` - Containerization\n- `vercel-deployment` - Vercel deployment\n- `github-actions-templates` - CI\u002FCD workflows\n- `cicd-automation-workflow-automate` - CI\u002FCD automation\n\n#### Actions\n1. Create Dockerfiles\n2. Configure build pipelines\n3. Set up deployment workflows\n4. Configure environment variables\n5. Deploy to production\n\n#### Copy-Paste Prompts\n```\nUse @docker-expert to containerize my application\n```\n\n```\nUse @vercel-deployment to deploy my Next.js app to production\n```\n\n```\nUse @github-actions-templates to set up CI\u002FCD pipeline\n```\n\n## Technology-Specific Workflows\n\n### React\u002FNext.js Development\n```\nSkills: frontend-developer, react-patterns, nextjs-app-router-patterns, typescript-pro, tailwind-patterns\n```\n\n### Python\u002FFastAPI Development\n```\nSkills: fastapi-pro, python-pro, python-patterns, pydantic-models-py\n```\n\n### Node.js\u002FExpress Development\n```\nSkills: nodejs-backend-patterns, javascript-pro, typescript-pro, express (via nodejs-backend-patterns)\n```\n\n### Full-Stack Development\n```\nSkills: senior-fullstack, app-builder, frontend-developer, backend-architect, database-architect\n```\n\n### Mobile Development\n```\nSkills: mobile-developer, react-native-architecture, flutter-expert, ios-developer\n```\n\n## Quality Gates\n\nBefore moving to next phase, verify:\n- [ ] All tests passing\n- [ ] Code review completed\n- [ ] Security scan passed\n- [ ] Linting\u002Fformatting clean\n- [ ] Documentation updated\n\n## Related Workflow Bundles\n\n- `wordpress` - WordPress-specific development\n- `security-audit` - Security testing workflow\n- `testing-qa` - Comprehensive testing workflow\n- `documentation` - Documentation generation workflow\n\n## Limitations\n- Use this skill only when the task clearly matches the scope described above.\n- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.\n- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.\n","","imported","https:\u002F\u002Fgithub.com\u002Fsickn33\u002Fantigravity-awesome-skills","user_system_seed","SkillOPIC",true,201,144,"2026-05-16 13:15:19",{"id":8,"name":21,"slug":22,"icon":23,"description":24,"sort":25,"createdAt":26},"其他","other","mdi-page-next-outline","其他类型Skill",5,"2026-05-16 12:53:40",{"id":7,"name":28,"slug":29,"icon":30,"description":31,"moduleId":8,"sort":32,"skillCount":33,"createdAt":26},"职场发展","career","mdi-briefcase-outline","面试准备、简历优化、职业规划",4,575,[35],{"id":36,"skillId":4,"version":37,"fileName":38,"fileSize":39,"filePath":40,"fileHash":41,"manifest":42,"createdAt":19},"cdeb4d91-7585-4d0a-bce9-8e2928c1ce6e","1.0.0","development.zip",2597,"uploads\u002Fskills\u002F3e462044-c89c-48ba-8a59-249a970b068b\u002Fdevelopment.zip","c491c7e7065b931439aa9fec712fc919f40bb9288d6ef31c91462be02949d343","[{\"path\":\"SKILL.md\",\"isDirectory\":false,\"size\":7041}]",{"code":44,"message":45,"data":46},200,"success",{"items":47,"stats":48,"page":51},[],{"averageRating":49,"totalRatings":49,"ratingCounts":50},0,[49,49,49,49,49],{"limit":52,"offset":49,"hasMore":53,"nextOffset":52,"ratedOnly":16},15,false]