aspnet-mvc-to-react-mapping

Converts ASP.NET MVC Razor views, layouts, and partials into React components and routes.

Updated Jul 23, 2026
One-click install
npx skills add https://github.com/samdop/convertonode --skill aspnet-mvc-to-react-mapping-samdop
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: aspnet-mvc-to-react-mapping
Source: https://github.com/samdop/convertonode/tree/main/.github/skills/aspnet-mvc-to-react-mapping
Command: npx skills add https://github.com/samdop/convertonode --skill aspnet-mvc-to-react-mapping-samdop

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Migrating ASP.NET MVC applications to a modern React frontend requires translating Razor syntax, HtmlHelpers, layouts, partials, and DataAnnotations validation into unfamiliar React patterns, which is error-prone and inconsistent without a systematic mapping guide. ## Core Features & Use Cases - Razor-to-JSX Mapping Tables: Provides direct translations for Razor syntax, HtmlHelpers, file/folder structures, and routing conventions into React components, react-router routes, and shadcn/ui elements. - Validation Migration: Converts DataAnnotations attributes into zod schemas with react-hook-form integration for schema-backed forms. - Framework-Specific References: Includes dedicated guidance for both .NET Framework MVC (Global.asax, BundleConfig) and ASP.NET Core MVC (Tag Helpers, View Components, Razor Pages) source applications. - Use Case: When converting a Views/Employees/Edit.cshtml form with @Html.EditorFor and [Required] validation, use this Skill to produce a typed React route page with a zod schema, shadcn form components, and a TanStack Query mutation. ## Quick Start Use the aspnet-mvc-to-react-mapping skill to convert my Views/Products/Index.cshtml Razor view into a React page component.

Frequently Asked Questions about aspnet-mvc-to-react-mapping

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I convert Razor views to React components?

Convert each route-level .cshtml view into a React page component under apps/web/src/routes/, and partial views into sub-components under apps/web/src/components/. Replace Razor control flow like @if and @foreach with JSX conditionals and array map expressions.

How to migrate ASP.NET MVC DataAnnotations validation to React?

Map DataAnnotations attributes to zod schema rules: [Required] becomes .min(1), [EmailAddress] becomes .email(), and [StringLength] becomes .min().max(). Bind the schema to a shadcn form using react-hook-form with zodResolver.

What replaces _Layout.cshtml and RenderBody in React?

Convert _Layout.cshtml into a RootLayout.tsx component and replace @RenderBody() with react-router's <Outlet /> so nested routes render inside the layout shell. Shared partials like _LoginPartial become ordinary imported components.

Does this migration approach support ASP.NET Core Tag Helpers?

Yes, Tag Helpers map to shadcn components: <input asp-for> becomes an <Input> inside <FormControl>, <span asp-validation-for> becomes <FormMessage>, and <form asp-action> becomes a form submitting through a mutation hook.

What should not be migrated from MVC to React?

Do not carry forward BundleConfig, _ViewStart.cshtml, jQuery bundles, IIS-specific Web.config settings, or per-view AntiForgeryToken helpers. Handle CSRF once in the API client if the backend uses cookie authentication.

How do I replace jQuery AJAX calls in Razor views with React?

Replace $.ajax calls with TanStack Query queries and mutations, convert DOM-ready handlers into useEffect hooks, and turn direct DOM updates into React state. Unobtrusive validation is replaced by react-hook-form with zod.