Awesome-omni-skill dotnet-to-react-python-refactor
Agent skill for refactoring .NET applications into a React frontend + Python backend. Use for migrating/modernizing .NET apps (ASP.NET MVC, Web API, Blazor, Web Forms) to React + Python, or analyzing .NET codebases for migration planning.
git clone https://github.com/diegosouzapw/awesome-omni-skill
T=$(mktemp -d) && git clone --depth=1 https://github.com/diegosouzapw/awesome-omni-skill "$T" && mkdir -p ~/.claude/skills && cp -r "$T/skills/development/dotnet-to-react-python-refactor" ~/.claude/skills/diegosouzapw-awesome-omni-skill-dotnet-to-react-python-refactor && rm -rf "$T"
skills/development/dotnet-to-react-python-refactor/SKILL.md.NET to React + Python Refactor Agent
Core Workflow
Phase 1: Assessment & Architecture Planning
-
Analyze .NET application — run the assessment script:
python scripts/assess_dotnet_app.py /path/to/dotnet/projectOutputs: project type, controllers, models, views, services, DB contexts, auth, NuGet packages.
-
Design target architecture (see
):references/architecture-patterns.md- Frontend: React SPA (routing, state management, UI framework)
- Backend: Python REST API (FastAPI/Flask/Django) + ORM
- Auth: JWT, OAuth2, or session-based
- Data: same DB or migration strategy
Phase 2: Backend Migration (.NET → Python)
-
Initialize Python backend:
python scripts/init_python_backend.py <name> --framework fastapi --db-type postgresqlFramework choice: FastAPI (async, OpenAPI docs), Flask (lightweight), Django REST (full-featured with ORM/admin).
-
Migrate business logic: map .NET controllers → Python endpoints; translate C# classes, LINQ → Python/ORM queries, async/await patterns. See
.references/framework-equivalents.md -
Data access: map Entity Framework models → SQLAlchemy/Django ORM; convert queries and stored procedures. See
.references/orm-migration.md -
Auth: map ASP.NET Identity → JWT tokens or session auth; preserve role-based/policy authorization. See
.references/authentication-patterns.md
Phase 3: Frontend Migration (.NET Views → React)
-
Initialize React (Vite recommended):
npm create vite@latest frontend -- --template react-tsSee
for recommended structure.assets/react-project-template/ -
Convert Razor views to JSX (semi-automated):
python scripts/convert_razor_to_jsx.py ./Views --output ./frontend/src/componentsUse
for production-ready Button, Input, and Modal components.assets/react-component-templates/ -
State management: Context API (small apps), Zustand (medium), Redux Toolkit (large); convert ViewBag/ViewData to component or global state.
-
Routing: replace ASP.NET routing with React Router; implement protected routes for authenticated pages.
-
API integration: React Query + axios with auth interceptors. See
.references/api-integration.md -
Forms: React Hook Form or Formik; client-side validation matching backend rules.
Phase 4: Data Layer Migration
-
Generate ORM models:
python scripts/generate_migration.py /path/to/models --framework sqlalchemy --output ./migrations -
Preserve relationships, constraints, indexes, and custom type mappings.
-
Apply migrations: Alembic (SQLAlchemy) or Django migrations.
Phase 5: Testing & Validation
- Backend (pytest): unit tests, endpoint integration tests, auth flows, error handling.
- Frontend (Jest + RTL): component tests; Cypress/Playwright for E2E.
- Data integrity: compare query results between .NET and Python; validate CRUD and cascading deletes.
Phase 6: Deployment
- Environment: configure env vars, secrets, and per-environment configs (dev/staging/prod).
- Backend: Gunicorn/Uvicorn + Nginx reverse proxy; health checks and DB connection pooling.
- Frontend: production build → static hosting (Netlify, Vercel, S3+CloudFront); CDN for assets.
- Cutover strategy: Big Bang (fast, higher risk) | Strangler Fig (incremental, lower risk) | Parallel Run.
- See
for step-by-step Docker Compose and AWS guides. Usereferences/deployment-guides/
andassets/docker-compose.yml
.assets/nginx.conf
Execution Guidelines
Order: backend first → frontend as endpoints become available → staging validation → cutover with rollback plan.
Key pitfalls:
- N+1 queries: Python ORM lazy loading differs from Entity Framework
- Async/await: C# and Python semantics differ
- Timezones: standardize on UTC
- Decimal precision: map carefully for financial calculations
Standards: PEP 8 + type hints + mypy (Python); ESLint + Prettier + TypeScript (React); 80%+ test coverage.
Performance: profile DB queries early; add Redis caching; paginate large datasets; use React.memo/useMemo and lazy loading.
Quick Reference
Scripts
| Script | Purpose |
|---|---|
| Generate migration inventory from .NET project |
| Scaffold Python backend (FastAPI/Flask/Django) |
| Create ORM models from .NET Entity Framework models |
| Convert Razor views to React JSX |
Reference Docs (references/
)
references/| File | Use When |
|---|---|
| Planning architecture or choosing tech stack |
| Mapping .NET → Python technologies and packages |
| Entity Framework → SQLAlchemy/Django ORM |
| Implementing auth migration |
| React–Python API client patterns |
| Setting up tests and coverage |
| Pre-production security audit |
| Debugging migration and deployment issues |
| Docker Compose deployment |
| AWS deployment (Elastic Beanstalk, EC2, ECS) |
Assets (assets/
)
assets/| Asset | Purpose |
|---|---|
| React project structure guide |
| Button, Input, Modal components with CSS |
| Full-stack Docker setup (PostgreSQL, Redis, Nginx) |
| Production Nginx reverse proxy |
| Development frontend Dockerfile with hot-reload |
| Environment variables template |
| GitHub Actions and GitLab CI/CD pipelines |