Back to Details

fullstack-developer

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Fullstack Developer Skill

全栈开发专家技能

Purpose

用途

Provides end-to-end full-stack development expertise spanning frontend and backend technologies with focus on seamless integration, complete feature ownership, and system-level architecture. Specializes in building complete applications from database to UI with modern web technologies.
提供涵盖前后端技术的端到端全栈开发专业知识，专注于无缝集成、完整功能所有权和系统级架构。擅长使用现代Web技术构建从数据库到UI的完整应用程序。

When to Use

使用场景

  • Building complete features end-to-end (database → API → frontend)
  • Integrating frontend and backend systems (REST/GraphQL APIs, WebSockets)
  • Implementing authentication and authorization across the stack
  • Designing and implementing full-stack architectures (monoliths, microservices)
  • Optimizing performance across frontend-backend boundaries
  • Debugging complex issues spanning multiple layers of the stack
  • Building full-stack applications with React/Vue + Node.js/Python/Go
  • 端到端构建完整功能（数据库 → API → 前端）
  • 集成前后端系统（REST/GraphQL APIs、WebSockets）
  • 在全栈中实现身份验证与授权
  • 设计并实现全栈架构（单体应用、微服务）
  • 优化前后端边界的性能
  • 调试跨多层栈的复杂问题
  • 使用React/Vue + Node.js/Python/Go构建全栈应用

Core Capabilities

核心能力

Frontend Development

前端开发

  • Building React, Vue, or other modern frontend applications
  • Implementing component architectures and design patterns
  • Managing state with Redux, Context, or other solutions
  • Creating responsive and accessible user interfaces
  • 构建React、Vue或其他现代前端应用
  • 实现组件架构与设计模式
  • 使用Redux、Context或其他方案管理状态
  • 创建响应式且可访问的用户界面

Backend Development

后端开发

  • Developing APIs with Node.js, Python, Go, or other backends
  • Managing database design and ORM usage
  • Implementing authentication and authorization systems
  • Handling file uploads, streaming, and server-side processing
  • 使用Node.js、Python、Go或其他后端技术开发API
  • 管理数据库设计与ORM使用
  • 实现身份验证与授权系统
  • 处理文件上传、流传输与服务器端处理

Full-Stack Integration

全栈集成

  • Connecting frontend and backend systems seamlessly
  • Managing API contracts and version compatibility
  • Implementing real-time features (WebSockets, Server-Sent Events)
  • Optimizing performance across the full stack
  • 无缝连接前后端系统
  • 管理API契约与版本兼容性
  • 实现实时功能（WebSockets、Server-Sent Events）
  • 优化全栈性能

DevOps and Deployment

DevOps与部署

  • Setting up CI/CD pipelines for full-stack applications
  • Managing containerization with Docker and Kubernetes
  • Configuring cloud infrastructure and deployment strategies
  • Monitoring and troubleshooting production issues
  • 为全栈应用搭建CI/CD流水线
  • 使用Docker和Kubernetes管理容器化
  • 配置云基础设施与部署策略
  • 监控与排查生产环境问题

Quick Start

快速开始

Invoke When

调用时机

  • User needs complete feature implementation from database to UI
  • Task involves frontend-backend communication or integration
  • Building or debugging full-stack applications
  • Need architecture decisions spanning multiple layers
  • 用户需要从数据库到UI的完整功能实现
  • 任务涉及前后端通信或集成
  • 构建或调试全栈应用
  • 需要跨多层的架构决策

Don't Invoke When

不调用时机

  • Task is purely frontend (use react-specialist or vue-expert)
  • Task is purely backend API (use backend-developer)
  • Task is infrastructure-focused (use devops-engineer)
  • Task is database-specific (use database-optimizer)
  • 任务纯前端（使用react-specialist或vue-expert）
  • 任务纯后端API（使用backend-developer）
  • 任务以基础设施为核心（使用devops-engineer）
  • 任务针对特定数据库（使用database-optimizer）

Decision Framework

决策框架

Architecture Patterns

架构模式

Building new application?
│
├─ Team size < 5 developers?
│  │
│  ├─ YES → **Monolith** ✓
│  │        (simpler deployment, faster development)
│  │
│  └─ NO → Clear service boundaries exist?
│           │
│           ├─ YES → **Microservices** ✓
│           │        (team autonomy, independent scaling)
│           │
│           └─ NO → **Modular Monolith** ✓
│                    (monolith benefits + future flexibility)
│
└─ Integrating with existing system?
    │
    └─ Use **API Gateway Pattern** for consistent interface
Building new application?
│
├─ Team size < 5 developers?
│  │
│  ├─ YES → **Monolith** ✓
│  │        (simpler deployment, faster development)
│  │
│  └─ NO → Clear service boundaries exist?
│           │
│           ├─ YES → **Microservices** ✓
│           │        (team autonomy, independent scaling)
│           │
│           └─ NO → **Modular Monolith** ✓
│                    (monolith benefits + future flexibility)
│
└─ Integrating with existing system?
    │
    └─ Use **API Gateway Pattern** for consistent interface

Frontend-Backend Communication

前后端通信

PatternUse WhenAvoid When
REST APICRUD operations, simple data fetchingComplex nested data, real-time needs
GraphQLComplex data requirements, mobile appsSimple APIs, caching is critical
WebSocketsReal-time updates, chat, live feedsOne-time data fetches
Server-Sent EventsServer-to-client streaming onlyBidirectional communication needed
模式使用场景避免场景
REST APICRUD操作、简单数据获取复杂嵌套数据、实时需求
GraphQL复杂数据需求、移动应用简单API、缓存至关重要的场景
WebSockets实时更新、聊天、实时信息流一次性数据获取
Server-Sent Events仅服务器到客户端的流传输需要双向通信的场景

State Management Decision

状态管理决策

Application complexity?
│
├─ Simple (< 5 components sharing state)
│  └─ **React Context / Vue provide/inject** ✓
│
├─ Medium (multiple feature modules)
│  └─ **Zustand / Pinia** ✓
│
└─ Complex (large team, strict requirements)
   └─ **Redux Toolkit / Vuex** ✓
Application complexity?
│
├─ Simple (< 5 components sharing state)
│  └─ **React Context / Vue provide/inject** ✓
│
├─ Medium (multiple feature modules)
│  └─ **Zustand / Pinia** ✓
│
└─ Complex (large team, strict requirements)
   └─ **Redux Toolkit / Vuex** ✓

Architecture Patterns and Methodologies

架构模式与方法论

Fullstack Integration Patterns

全栈集成模式

  • API-First Development: Design contracts before implementation
  • Component-Driven Architecture: Reusable UI and backend components
  • Service Layer Pattern: Business logic separation
  • Repository Pattern: Data access abstraction
  • State Management: Frontend state consistency strategies
  • API优先开发：先设计契约再实现
  • 组件驱动架构：可复用的UI与后端组件
  • 服务层模式：业务逻辑分离
  • 仓库模式：数据访问抽象
  • 状态管理：前端状态一致性策略

Frontend Architecture

前端架构

  • Component Architecture: Atomic design, feature-based organization
  • State Management: Redux, MobX, Context API, Vuex
  • Routing Patterns: Client-side routing and navigation guards
  • Form Handling: Validation, submission, and error management
  • Performance Optimization: Code splitting, lazy loading, caching
  • 组件架构：原子设计、基于功能的组织
  • 状态管理：Redux、MobX、Context API、Vuex
  • 路由模式：客户端路由与导航守卫
  • 表单处理：验证、提交与错误管理
  • 性能优化：代码分割、懒加载、缓存

Backend Architecture

后端架构

  • RESTful API Design: Resource-oriented endpoints
  • GraphQL Integration: Flexible data fetching
  • Authentication & Authorization: JWT, OAuth2, session management
  • Data Validation: Request validation and sanitization
  • Error Handling: Consistent error responses and logging
  • RESTful API设计：面向资源的端点
  • GraphQL集成：灵活的数据获取
  • 身份验证与授权：JWT、OAuth2、会话管理
  • 数据验证：请求验证与清理
  • 错误处理：一致的错误响应与日志

Best Practices

最佳实践

Fullstack Development

全栈开发

  • API Design: RESTful conventions with OpenAPI documentation
  • State Management: Centralized state with proper data flow
  • Error Handling: Consistent error responses, proper HTTP status codes
  • Security: Input validation, SQL injection prevention, XSS protection
  • Performance: Caching strategies, query optimization, code splitting
  • API设计：遵循RESTful规范并提供OpenAPI文档
  • 状态管理：集中式状态与合理的数据流
  • 错误处理：一致的错误响应、正确的HTTP状态码
  • 安全：输入验证、SQL注入防护、XSS防护
  • 性能：缓存策略、查询优化、代码分割

Frontend Excellence

前端卓越实践

  • Component Design: Reusable, composable components with clear interfaces
  • State Management: Predictable state updates, proper data flow
  • Accessibility: WCAG 2.1 compliance, keyboard navigation, screen reader support
  • Testing: Unit tests, integration tests, E2E tests with good coverage
  • Performance: Optimized bundle size, lazy loading, image optimization
  • 组件设计：可复用、可组合且接口清晰的组件
  • 状态管理：可预测的状态更新、合理的数据流
  • 可访问性：符合WCAG 2.1标准、键盘导航、屏幕阅读器支持
  • 测试：单元测试、集成测试、覆盖率良好的E2E测试
  • 性能：优化包体积、懒加载、图片优化

Backend Excellence

后端卓越实践

  • API Design: Consistent patterns, proper versioning, deprecation strategies
  • Database: Proper indexing, query optimization, connection pooling
  • Security: Authentication, authorization, input validation, rate limiting
  • Monitoring: Logging, metrics, tracing, alerting
  • Scalability: Horizontal scaling, load balancing, caching strategies
  • API设计：一致的模式、合理的版本控制、弃用策略
  • 数据库：合理的索引、查询优化、连接池
  • 安全：身份验证、授权、输入验证、速率限制
  • 监控：日志、指标、追踪、告警
  • 可扩展性：水平扩展、负载均衡、缓存策略

DevOps Integration

DevOps集成

  • CI/CD: Automated testing, building, and deployment pipelines
  • Infrastructure as Code: Terraform or CloudFormation for infrastructure
  • Containerization: Docker for consistent environments
  • Monitoring: Prometheus, Grafana for metrics and alerting
  • Documentation: API docs, runbooks, architecture diagrams
  • CI/CD：自动化测试、构建与部署流水线
  • 基础设施即代码：使用Terraform或CloudFormation管理基础设施
  • 容器化：使用Docker实现一致的环境
  • 监控：使用Prometheus、Grafana进行指标收集与告警
  • 文档：API文档、运行手册、架构图

Collaboration and Workflow

协作与工作流

  • Code Review: Meaningful reviews, constructive feedback
  • Documentation: Clear README, contributing guide, code comments
  • Version Control: Meaningful commits, branch strategy, PR workflow
  • Testing Strategy: Test pyramid with appropriate coverage
  • Communication: Clear requirements, regular syncs, async updates
  • 代码评审：有意义的评审、建设性的反馈
  • 文档：清晰的README、贡献指南、代码注释
  • 版本控制：有意义的提交、分支策略、PR工作流
  • 测试策略：符合测试金字塔的合理覆盖率
  • 沟通：清晰的需求、定期同步、异步更新

Additional Resources

额外资源

  • Detailed Technical Reference: See REFERENCE.md
  • Code Examples & Patterns: See EXAMPLES.md
  • 详细技术参考：查看REFERENCE.md
  • 代码示例与模式：查看EXAMPLES.md