Blazor AI Experiments

A collection of Blazor components and prompts for experimenting with AI-assisted refactoring.

What's Inside

• ContentWorkspace.razor — A deliberately "messy" Blazor component that handles multiple concerns (post list, editor, AI assistant panel). It works, but it's a great candidate for refactoring.
• Prompts/ — AI prompts you can use with Claude Code, Cursor, Copilot, or your favourite AI coding tool.

Getting Started

Prerequisites

• .NET 10 SDK (or adjust the target framework in the .csproj)
• Your favourite AI coding assistant

Run the App

cd BlazorAIExperiments
dotnet run

Navigate to /content to see the ContentWorkspace component in action.

The Refactoring Exercise

The Prompts/component-refactoring-exercise.md file contains a prompt designed to guide you through refactoring ContentWorkspace.razor.

Using with Claude Code

1. Open this project in your terminal
2. Run claude to start Claude Code
3. Copy and paste the prompt from Prompts/component-refactoring-exercise.md
4. Follow along as Claude walks you through the refactoring decisions

Using with Other Tools

The prompt works with any AI coding assistant:

• Cursor — Open the prompt file and use it in the chat
• Copilot Chat — Paste the prompt into the chat window
• ChatGPT/Claude.ai — Paste both the prompt and the component code

The Point

This isn't about getting to a "perfect" refactored component. It's about:

1. Understanding the decision-making process — Why do we extract this? Why not that?
2. Learning to spot code smells — What makes code "feel wrong"?
3. Connecting decisions to principles — Cohesion, coupling, SRP, etc.

The messy component is intentional. Don't clean it up before running the exercise!

License

MIT