Skills / jetpack compose skills
jetpack compose skills
Agent skill for modern Android development with Jetpack Compose — best practices for code generation and review
Installation
Kompatibilitaet
Beschreibung
Modern Jetpack Compose — Agent Skill
An agent skill for writing, reviewing, and reasoning about modern Android UI code using Jetpack Compose. Compatible with Claude Code, Cursor, Codex, and any platform that supports the Agent Skills format.
Why This Skill?
LLMs frequently generate outdated or incorrect Jetpack Compose code. Common problems:
- Wrong state collection — using
collectAsState()instead ofcollectAsStateWithLifecycle() - Unstable recomposition — passing unstable lambdas or undecorated data classes that cause unnecessary redraws
- Ignored Scaffold padding — forgetting to apply
paddingValuesfromScaffold's content lambda, causing content to render under system bars - Stale APIs — referencing accompanist libraries that have since been upstreamed into Compose, or Material 2 APIs that have Material 3 equivalents
- Architecture drift — mixing state hoisting patterns or bypassing the UDF model
This skill gives your AI agent a curated, up-to-date reference for all of these areas so it generates correct, idiomatic Compose code from the start.
What It Does
Load this skill to give your AI agent deep knowledge of modern Jetpack Compose best practices. It helps agents:
- Generate idiomatic Compose code from scratch
- Review existing code for deprecated APIs, anti-patterns, and accessibility gaps
- Guide architecture decisions around state management, navigation, and performance
Skill Coverage
| Reference File | Topics Covered |
|---|---|
| api.md | Deprecated APIs → modern replacements, Material 2 → 3, accompanist migrations |
| composables.md | Naming conventions, state hoisting, slot APIs, @Preview, modifier contract |
| state.md | MVVM + UDF, ViewModel + StateFlow, remember vs rememberSaveable, derivedStateOf |
| effects.md | LaunchedEffect, DisposableEffect, SideEffect, rememberCoroutineScope |
| recomposition.md | @Stable/@Immutable, unstable collections, key() in lazy lists, lambda stability |
| navigation.md | Type-safe Navigation Compose, nested graphs, BackStack-scoped ViewModels, deep links |
| design.md | Material 3 theming, dynamic color, adaptive layouts, Material Expressive (BOM 2025.x) |
| accessibility.md | TalkBack, semantics, mergeDescendants, touch targets, color contrast |
| performance.md | LazyList optimization, remember, deferred state reads, graphicsLayer |
| kotlin.md | Sealed interfaces, coroutines, stateIn, null safety, when expressions |
| hygiene.md | Testing with ComposeTestRule, lint/detekt, secrets, resource naming |
Installation
Recommended — npx (Claude Code, Cursor, Codex, Gemini)
npx skills add https://github.com/anhvt52/jetpack-compose-skills
This installs the skill for all detected agents on your machine. You can also scope it:
# Project-level only
npx skills add https://github.com/anhvt52/jetpack-compose-skills
# Global (all your projects)
npx skills add https://github.com/anhvt52/jetpack-compose-skills -g
If npx is unavailable, install Node.js first:
brew install node
Manual — Claude Code
Clone the repo and add to your project's CLAUDE.md:
Use the skill at: path/to/modern-jetpack-compose/SKILL.md
Manual — Cursor / Codex / OpenAI-compatible platforms
Use the config at modern-jetpack-compose/agents/openai.yaml.
Target Platform
- Compose BOM: 2024.x (stable default), with notes for 2025.x (Material Expressive)
- Material Design: Material 3
- Architecture: MVVM + Unidirectional Data Flow (UDF)
- Language: Kotlin with coroutines, Flow, and sealed interfaces
Example Usage
Reviewing code:
"Using the modern-jetpack-compose skill, review the files in
feature/home/for best practices issues."
Generating code:
"Using the modern-jetpack-compose skill, write a
BookListScreenwith a LazyColumn, search bar, and empty state, backed by a ViewModel."
Targeted check:
"Using
references/accessibility.mdfrom the modern-jetpack-compose skill, check all composables incomponents/for accessibility issues."
Output Format
The skill organizes findings by file. Each issue includes:
- File and line number
- Rule being violated
- Before/after Kotlin snippet
Results end with a prioritized summary of the most impactful changes.
License
MIT — see LICENSE.
Author
Anh Vu — [email protected]
Contributing
See CONTRIBUTING.md.
Aehnliche Skills
last30days skill
AI agent skill that researches any topic across Reddit, X, YouTube, HN, Polymarket, and the web - then synthesizes a grounded summary
context mode
Context window optimization for AI coding agents. Sandboxes tool output, 98% reduction. 12 platforms
claude seo
Universal SEO skill for Claude Code. 19 sub-skills, 12 subagents, 3 extensions (DataForSEO, Firecrawl, Banana). Technical SEO, E-E-A-T, schema, GEO/AEO, backlinks, local SEO, maps intelligence, Google APIs, and PDF/Excel reporting.
pinme
Deploy Your Frontend in a Single Command. Claude Code Skills supported.
claude ads
Comprehensive paid advertising audit & optimization skill for Claude Code. 250+ checks across Google, Meta, YouTube, LinkedIn, TikTok, Microsoft & Apple Ads with weighted scoring, parallel agents, industry templates, and AI creative generation.
claude code
Claude Code is an agentic coding tool that lives in your terminal, understands your codebase, and helps you code faster by executing routine tasks, explaining complex code, and handling git workflows - all through natural language commands.