Senior Fullstack¶
Domain: Engineering - Core | Skill: senior-fullstack | Source: engineering-team/senior-fullstack/SKILL.md
Senior Fullstack¶
Fullstack development skill with project scaffolding and code quality analysis tools.
Table of Contents¶
Trigger Phrases¶
Use this skill when you hear: - "scaffold a new project" - "create a Next.js app" - "set up FastAPI with React" - "analyze code quality" - "check for security issues in codebase" - "what stack should I use" - "set up a fullstack project" - "generate project boilerplate"
Tools¶
Project Scaffolder¶
Generates fullstack project structures with boilerplate code.
Supported Templates:
- nextjs - Next.js 14+ with App Router, TypeScript, Tailwind CSS
- fastapi-react - FastAPI backend + React frontend + PostgreSQL
- mern - MongoDB, Express, React, Node.js with TypeScript
- django-react - Django REST Framework + React frontend
Usage:
# List available templates
python scripts/project_scaffolder.py --list-templates
# Create Next.js project
python scripts/project_scaffolder.py nextjs my-app
# Create FastAPI + React project
python scripts/project_scaffolder.py fastapi-react my-api
# Create MERN stack project
python scripts/project_scaffolder.py mern my-project
# Create Django + React project
python scripts/project_scaffolder.py django-react my-app
# Specify output directory
python scripts/project_scaffolder.py nextjs my-app --output ./projects
# JSON output
python scripts/project_scaffolder.py nextjs my-app --json
Parameters:
| Parameter | Description |
|---|---|
template |
Template name (nextjs, fastapi-react, mern, django-react) |
project_name |
Name for the new project directory |
--output, -o |
Output directory (default: current directory) |
--list-templates, -l |
List all available templates |
--json |
Output in JSON format |
Output includes: - Project structure with all necessary files - Package configurations (package.json, requirements.txt) - TypeScript configuration - Docker and docker-compose setup - Environment file templates - Next steps for running the project
Code Quality Analyzer¶
Analyzes fullstack codebases for quality issues.
Analysis Categories: - Security vulnerabilities (hardcoded secrets, injection risks) - Code complexity metrics (cyclomatic complexity, nesting depth) - Dependency health (outdated packages, known CVEs) - Test coverage estimation - Documentation quality
Usage:
# Analyze current directory
python scripts/code_quality_analyzer.py .
# Analyze specific project
python scripts/code_quality_analyzer.py /path/to/project
# Verbose output with detailed findings
python scripts/code_quality_analyzer.py . --verbose
# JSON output
python scripts/code_quality_analyzer.py . --json
# Save report to file
python scripts/code_quality_analyzer.py . --output report.json
Parameters:
| Parameter | Description |
|---|---|
project_path |
Path to project directory (default: current directory) |
--verbose, -v |
Show detailed findings |
--json |
Output in JSON format |
--output, -o |
Write report to file |
Output includes: - Overall score (0-100) with letter grade - Security issues by severity (critical, high, medium, low) - High complexity files - Vulnerable dependencies with CVE references - Test coverage estimate - Documentation completeness - Prioritized recommendations
Sample Output:
============================================================
CODE QUALITY ANALYSIS REPORT
============================================================
Overall Score: 75/100 (Grade: C)
Files Analyzed: 45
Total Lines: 12,500
--- SECURITY ---
Critical: 1
High: 2
Medium: 5
--- COMPLEXITY ---
Average Complexity: 8.5
High Complexity Files: 3
--- RECOMMENDATIONS ---
1. [P0] SECURITY
Issue: Potential hardcoded secret detected
Action: Remove or secure sensitive data at line 42
Workflows¶
Workflow 1: Start New Project¶
- Choose appropriate stack based on requirements (see Stack Decision Matrix)
- Scaffold project structure
- Verify scaffold: confirm
package.json(orrequirements.txt) exists - Run initial quality check — address any P0 issues before proceeding
- Set up development environment
# 1. Scaffold project
python scripts/project_scaffolder.py nextjs my-saas-app
# 2. Verify scaffold succeeded
ls my-saas-app/package.json
# 3. Navigate and install
cd my-saas-app
npm install
# 4. Configure environment
cp .env.example .env.local
# 5. Run quality check
python ../scripts/code_quality_analyzer.py .
# 6. Start development
npm run dev
Workflow 2: Audit Existing Codebase¶
- Run code quality analysis
- Review security findings — fix all P0 (critical) issues immediately
- Re-run analyzer to confirm P0 issues are resolved
- Create tickets for P1/P2 issues
# 1. Full analysis
python scripts/code_quality_analyzer.py /path/to/project --verbose
# 2. Generate detailed report
python scripts/code_quality_analyzer.py /path/to/project --json --output audit.json
# 3. After fixing P0 issues, re-run to verify
python scripts/code_quality_analyzer.py /path/to/project --verbose
Workflow 3: Stack Selection¶
Use the tech stack guide to evaluate options:
- SEO Required? → Next.js with SSR
- API-heavy backend? → Separate FastAPI or NestJS
- Real-time features? → Add WebSocket layer
- Team expertise → Match stack to team skills
See references/tech_stack_guide.md for detailed comparison.
Reference Guides¶
Architecture Patterns (references/architecture_patterns.md)¶
- Frontend component architecture (Atomic Design, Container/Presentational)
- Backend patterns (Clean Architecture, Repository Pattern)
- API design (REST conventions, GraphQL schema design)
- Database patterns (connection pooling, transactions, read replicas)
- Caching strategies (cache-aside, HTTP cache headers)
- Authentication architecture (JWT + refresh tokens, sessions)
Development Workflows (references/development_workflows.md)¶
- Local development setup (Docker Compose, environment config)
- Git workflows (trunk-based, conventional commits)
- CI/CD pipelines (GitHub Actions examples)
- Testing strategies (unit, integration, E2E)
- Code review process (PR templates, checklists)
- Deployment strategies (blue-green, canary, feature flags)
- Monitoring and observability (logging, metrics, health checks)
Tech Stack Guide (references/tech_stack_guide.md)¶
- Frontend frameworks comparison (Next.js, React+Vite, Vue)
- Backend frameworks (Express, Fastify, NestJS, FastAPI, Django)
- Database selection (PostgreSQL, MongoDB, Redis)
- ORMs (Prisma, Drizzle, SQLAlchemy)
- Authentication solutions (Auth.js, Clerk, custom JWT)
- Deployment platforms (Vercel, Railway, AWS)
- Stack recommendations by use case (MVP, SaaS, Enterprise)
Quick Reference¶
Stack Decision Matrix¶
| Requirement | Recommendation |
|---|---|
| SEO-critical site | Next.js with SSR |
| Internal dashboard | React + Vite |
| API-first backend | FastAPI or Fastify |
| Enterprise scale | NestJS + PostgreSQL |
| Rapid prototype | Next.js API routes |
| Document-heavy data | MongoDB |
| Complex queries | PostgreSQL |
Common Issues¶
| Issue | Solution |
|---|---|
| N+1 queries | Use DataLoader or eager loading |
| Slow builds | Check bundle size, lazy load |
| Auth complexity | Use Auth.js or Clerk |
| Type errors | Enable strict mode in tsconfig |
| CORS issues | Configure middleware properly |