mui-to-bui-migration
Skill35k starsChanged 2 days agoApache-2.0View on GitHub
Migrate Material-UI (MUI) to Backstage UI (BUI) with a codemod or standalone guidance. Use when migrating MUI components and styles, running @backstage/mui4-to-bui-migration-recipe, or resolving TODO(backstage-codemod) after a BUI migration.
We split this skill into the rules it gives an agent
15 rules. About 0 are common, 10 are distinctive, and 5 are very specific to this project.
≈0
Common · estimate
Many files like this have a rule of this kind.
≈10
Distinctive · estimate
This author's own choices. Worth a look.
5
Very specific
Tied to their project's names, files or tools. Probably skip.
- Common
- Distinctive
- Very specific
- Distinctive: line 26
Use ordinary conversation so the choice works across agents.
- Distinctive: line 38
Prefer a clean git tree so recipe edits are easy to review.
- Distinctive: line 47
Use the published registry recipe.
- Very specific: line 60
Always dry-run the target before apply.
- Distinctive: line 63
After a successful dry-run, note the expected changes and TODOs.
- Very specific: line 72
Run only the full recipe so bootstrap → transforms → remove-mui-dependencies stay in order (cleanup last).
- Distinctive: line 78
If either command fails, report the failure and inspect any partial changes before retrying.
- Distinctive: line 86
Read standalone migration only when the user selects this path.
- Very specific: line 96
Search the target for TODO(backstage-codemod).
- Very specific: line 98
Search for remaining @material-ui/ and @mui/ imports and styling usage.
- Distinctive: line 99
Read migration limits when a component or pattern has no equivalent that preserves its behavior.
- Distinctive: line 101
After a codemod run, read leftover cleanup when finishing tokens, icons, or ambiguous layout.
- Distinctive: line 105
Use the recipe README to interpret recipe output.
- Very specific: line 114
Follow the target repository's setup instructions before checks.
- Distinctive: line 116
Run targeted tests and lint checks using the repository's prescribed commands.
≈ “Common” is an estimate: at least 1 in 5 of the 308,232 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.
Files
MUI to BUI migration
Support two paths through the migration: run the published recipe
(@backstage/mui4-to-bui-migration-recipe) and finish its leftovers, or migrate
directly using the standalone guidance. Both paths include verification.
Workflow
1. Choose the path and target
Honor a path the user already specified. Otherwise, ask in plain language:
Would you like to run the codemod and then finish its leftovers, or migrate directly with the standalone guidance? I recommend the codemod because it handles mechanical changes deterministically and can reduce agent token usage.
Use ordinary conversation so the choice works across agents. Wait for the answer before migration edits or recipe commands; a recommendation is not a selection. For an unattended run, require the request to specify the path.
Identify the app or package path to migrate (for example . for an app root,
or a plugin directory). If the recipe has already run, continue with its
leftovers in step 4 without repeating it.
Done when: the path and target are clear from the request or the user's answer.
2. Baseline
Prefer a clean git tree so recipe edits are easy to review.
Done when: git status is clean, or dirty files are listed and accepted as
pre-existing.
3. Migrate using the selected path
Codemod path
Use the published registry recipe. Maintainers testing an unpublished recipe: follow local-run instructions in the codemods repository instead of the commands below.
Replace <path-to-app-or-package> with the agreed target. Dry-run first:
yarn dlx codemod run @backstage/mui4-to-bui-migration-recipe \
--target <path-to-app-or-package> \
--dry-runAlways dry-run the target before apply. The summary surfaces scope and metrics
(for example Button outlined → secondary).
After a successful dry-run, note the expected changes and TODOs. If the user requested only a dry-run, report its results and stop before applying. If no files match, continue to step 4. Otherwise, apply:
yarn dlx codemod run @backstage/mui4-to-bui-migration-recipe \
--target <path-to-app-or-package>Run only the full recipe so bootstrap → transforms → remove-mui-dependencies
stay in order (cleanup last).
Ordered package list and heuristics: mui4-to-bui-migration-recipe README.
If either command fails, report the failure and inspect any partial changes before retrying. Keep the selected path unless the user chooses to switch.
Done when: dry-run and apply finished for the agreed target with no recipe CLI failure, or the dry-run confirmed no matching files.
Standalone path
Read standalone migration only when the user selects this path. Follow its dependency setup, component examples, styling guidance, and cleanup checklist to edit the target directly. This path requires no codemod installation, dry-run, or apply command.
Done when: the standalone checklist is complete for the agreed target, with remaining MUI usage recorded for step 4.
4. Resolve remaining migration work
- Search the target for
TODO(backstage-codemod). Resolve each marker, or defer with an explicit reason. - Search for remaining
@material-ui/and@mui/imports and styling usage. - Read migration limits when a component or pattern has no equivalent that preserves its behavior.
- After a codemod run, read leftover cleanup when finishing tokens, icons, or ambiguous layout. Load this reference only for recipe output.
Use the recipe README to interpret recipe output. For direct edits in either path, check the target's installed BUI APIs and preserve existing behavior.
Done when: every migration marker and remaining MUI use in scope is resolved or documented with a reason for retaining it. Keep dependencies needed by retained components, styles, or icons.
5. Verify
- Follow the target repository's setup instructions before checks. In a Backstage
monorepo, run
yarn installandyarn tscfrom the root. - Run targeted tests and lint checks using the repository's prescribed commands.
- Spot-check UI in light and dark mode where styles changed.
Done when: the required checks pass and changed UI behavior and appearance have been checked. Report any unavailable or failing check as incomplete verification.
Success criteria
Migration is complete when the selected path is finished for the agreed target, remaining work is accounted for in step 4, and verification passes. Summarize the selected path, changed files, retained MUI usage and reasons, and check results.
Trending
Quiet since April.about the whole repository
Who's talking about backstage/backstage
- TeKanAid“Backstage.io Software Catalog in 10 minutes | Backstage Tutorial”YouTube · Oct 11, 2023 · 13k views
- TeKanAid“What is Backstage.io in 10 minutes | Backstage Introduction”YouTube · Sep 27, 2023 · 11k views
- TeKanAid“A First Look at Backstage.io”YouTube · Sep 14, 2023 · 9.3k views
- Spotify R&D“Backstage Community Session 11: Contributors — Dec 16, 2021”YouTube · Dec 20, 2021 · 786 views
- Spotify R&D“Every contribution from the Backstage community in 2021 (Infographic)”YouTube · Dec 16, 2021 · 607 views
The biggest 5 of 62 mentions linking to the repository that our crawl found. Each line is their own headline.
See all 62
Talked about on YouTube, GitHub, Stack Overflow and Bluesky (62 times).
On YouTube · 25
- Oct 11, 2023Backstage.io Software Catalog in 10 minutes | Backstage Tutorial — TeKanAid - Platform Engineering and AI13k views · 25 comments
- Sep 27, 2023What is Backstage.io in 10 minutes | Backstage Introduction — TeKanAid - Platform Engineering and AI11k views · 4 comments
- Sep 14, 2023A First Look at Backstage.io — TeKanAid - Platform Engineering and AI9.3k views · 21 comments
- Dec 20, 2021Backstage Community Session 11: Contributors — Dec 16, 2021 — Spotify R&D786 views
- Dec 16, 2021Every contribution from the Backstage community in 2021 (Infographic) — Spotify R&D607 views · 1 comment
20 more on YouTube
- Aug 25, 2022Backstage Community Session — Aug 24, 2022 — Backstage Community455 views
- Dec 23, 2025All the commits! Contributions to Backstage in 2025, visualized — Backstage Community412 views
- Dec 18, 2024All the commits! Contributions to Backstage in 2024, visualized — Backstage Community366 views
- Feb 25, 2026Backstage Community Session — Feb 18, 2026 — Backstage Community362 views
- Dec 16, 2021Where in the world is the Backstage community? (Infographic) — Spotify R&D336 views
- Apr 1, 2025Backstage’s 5th Birthday — BackstageCon | KubeCon + CloudNativeCon Europe 2025 — Backstage Community229 views
- Dec 23, 2025All the plugin commits! Contributions to Backstage in 2025, visualized — Backstage Community220 views
- Jun 16, 202401: What is Backstage? — Spotify R&D202 views
- Mar 25, 2022Backstage Contributor Chat - Irma Solakovic — Backstage Community188 views
- Jun 22, 2022Backstage Community Session: Contributors — Jun 22, 2022 — Backstage Community186 views
- Jan 5, 2026Backstage Community Session — Dec 17, 2025 — Backstage Community154 views
- Feb 14, 2024Demystifying Open Source: A Beginner's Guide #opensource #oss #passion #contribution — Build. Automate. Ship Smarter in the Cloud.125 views · 2 comments
- Feb 21, 2022Backstage community sessions - one year celebration video — Backstage Community78 views · 1 comment
- Jun 16, 202404: Backstage in the Wild — Spotify R&D59 views
- Mar 5, 2026What 89% of internal developer portals are built on: understand the Backstage open source codebase — Ellie Dawsays it tested it42 views
- Jun 16, 202416: Backstage Adopters Speak — Spotify R&D36 views
- Apr 28, 2026Backstage Developer Platform is going CLI first — Ellie Daw34 views
- Sep 27, 2024GitHub - backstage/backstage: Backstage is an open framework for building developer portals — GitHub Daily Trend AI Podcast25 views
- Mar 6, 2026What a Week of Changes Looks Like in a Major Open Source Project (Backstage) — Ellie Daw11 views · 1 comment
- Sep 27, 2024backstage/backstage - Gource visualisation — Gourcer6 views
On GitHub · 17
- Jun 17, 2024Org Member: Parsifal-M — backstage/community11 reactions
- May 19, 2021Evaluate synergies with Backstage service catalog — OpenSLO/OpenSLO11 reactions · 11 comments
- Jan 30, 2024Types breakage in v6.4.0 — testing-library/jest-dom10 reactions · 9 comments
- Jan 29, 2021Add support for resolving modules with context within monorepos — liady/webpack-node-externals9 reactions · 5 comments
- Sep 20, 2023🔌 Plugin: Backstage Orchestrator — janus-idp/backstage-plugins7 reactions · 1 comment
12 more on GitHub
- Mar 23, 2023Bump mkdocs material to v9 — backstage/mkdocs-techdocs-core7 reactions · 1 comment
- Sep 30, 2022RegExp lookbehind assertions — web-platform-tests/interop7 reactions · 6 comments
- Nov 21, 2024Can't resolve '@swagger-api/apidom-json-pointer' in latest release — swagger-api/apidom6 reactions · 26 comments
- Nov 3, 2021feat: Allow SSE For S3 Buckets — backstage/techdocs-cli6 reactions · 6 comments
- Mar 22, 2021Feature: Comment on released PRs and issues — changesets/action6 reactions · 10 comments
- Jan 12, 2024Adhere to semver rules when using workspace:^ dependencies, fixes #1290 — changesets/changesets5 reactions · 8 comments
- Nov 23, 2021Adding Gitlab Merge Request Template — backstage/software-templates3 reactions · 1 comment
- Sep 27, 2021Add mdx-truly-sane-lists to techdocs-core — backstage/mkdocs-techdocs-core3 reactions · 1 comment
- Feb 19, 2026add devcontainers checklist — backstage/contribfest2 reactions
- May 22, 2025repo-tools - Fixed Create Workspace Command — backstage/community-plugins2 reactions · 2 comments
- Jul 29, 2024Fix authentication issues with the http-requests against the proxy — RoadieHQ/roadie-backstage-plugins2 reactions · 3 comments
- Jul 2, 2024Optionally use material search — backstage/mkdocs-techdocs-core2 reactions · 5 comments
On Stack Overflow · 11
- Dec 25, 2022Why are Docker filesystem permissions behaving differently on GitHub Actions (Permission denied on server)4 votes · 1 answer
- Nov 16, 2022sonarqube backstage integration is failing4 votes · 1 answer
- Aug 18, 2023Backstage failing to start with Schema Error3 votes
- Jun 2, 2022Backstage: build docker image3 votes · 2 answers
- Mar 25, 2024Backstage oAuth Github: Missing session cookie2 votes
6 more on Stack Overflow
- May 6, 2025"Failed to load entity kinds" with backstage helm chart1 vote
- Feb 6, 2025Can Backstage Templates publish new files to existing repos?1 vote
- Mar 30, 2023sonarqube plugin is failing from backstage1 vote · 1 answer
- Oct 10, 2023Conditionally add fields to steps in backstage scaffolder template0 votes
- Jun 12, 2023Attempted import error: 'startTransition' is not exported from 'react' (imported as 'React')0 votes
- Nov 29, 2022sonarqube backstage integration is failing0 votes
On Bluesky · 9
- Nov 15, 2024Backstage : un framework Open Source conçu pour créer des portails développeurs centralisés, facilitant la gestion des microservices, des… — @bearstech.com17 likes and reposts
- Nov 15, 2024📦 backstage / backstage ⭐ 28,269 (+21) 🗒 TypeScript Backstage is an open framework for building developer portals — @github-trending.bsky.social4 likes and reposts
- Mar 3, 2026Backstage An open source framework for building developer portals… — @wikitd.bsky.social2 likes and reposts
- Aug 8, 2025📦 backstage / backstage ⭐ 30,908 (+9) 🗒 TypeScript Backstage is an open framework for building developer portals — @github-trending.bsky.social1 likes and repost
- Apr 4, 2025📦 backstage / backstage ⭐ 29,771 (+13) 🗒 TypeScript Backstage is an open framework for building developer portals — @github-trending.bsky.social1 likes and repost
4 more on Bluesky
- Sep 27, 2024🚀 Skyrocketing! 🚀 (200+ new stars) 📦 backstage / backstage ⭐ 27,817 (+205) 🗒 TypeScript Backstage is an open framework for building… — @github-trending-js.bsky.social1 likes and repost · 1 reply
- Nov 13, 2023Any node/js/ts and bazel ninjas following me? Looking to build github.com/backstage/ba... with bazel but I'm not having much luck and I'm… — @nlowe.dev1 likes and repost
- Nov 8, 2023📦 backstage / backstage ⭐ 23,941 (+95) 🗒 TypeScript Backstage is an open platform for building developer portals — @github-trending-js.bsky.social1 likes and repost
- Feb 8, 2024🔥 Hot Repo! 🔥 (100+ new stars) 📦 backstage / backstage ⭐ 25,185 (+184) 🗒 TypeScript Backstage is an open platform for building… — @github-trending-js.bsky.social0 likes and reposts · 1 reply
Other versions1 project uses a version of this.
Word for word · 0
None found.
Edited · 0
None found.
Wrote their own version · 1
- backstage/community-plugins★ 423same name
How matches are found. Word for word: the exact same text. Edited: shares passages with this file (“99% same” means 99% of its five-word phrases also appear here; 10% or more counts). Their own version: similar meaning, or, weakest, the same name. We can’t tell which project had it first. Projects are counted among the 200 most-starred candidates, and mentions are links to the repository we found, up to 50 per site, so both counts are a floor.
In this repository11 other files it gives its agents.
- AGENTS.mdAGENTS.md
- .github/copilot-instructions.mdCopilot instructions
- app-frontend-system-migrationSkill
- backend-plugin-developmentSkill
- backstage-release-notesSkill
- catalog-db-performanceSkill
- frontend-plugin-developmentSkill
- onboard-to-openapi-serverSkill
- plugin-analytics-instrumentationSkill
- plugin-full-frontend-system-migrationSkill
- plugin-new-frontend-system-supportSkill
Does it work?
Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.
No reviews yet
People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.
- It worked
- Partly
- It didn't
Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.
Your trail
Files you open will collect here, so you can find them again.
Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.
Now do this for your own.
Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

