TypingMindTypingMindThe best frontend for AI
Ck:Mobile Development logo

Ck:Mobile Development

Community
manhvann
ck:mobile-development

Build mobile apps with React Native, Flutter, Swift/SwiftUI, Kotlin/Jetpack Compose. Use for iOS/Android, mobile UX, performance optimization, offline-first, app store deployment.

Overview

Publishermanhvann
Repositorycodexkit
Skill nameck:mobile-development
Stars
88
Forks
81
Bundled files
6
LicenseMIT
Links
Skill sourceRepository
  • Markdown instructions

    A SKILL.md file the model loads on demand, so it only costs tokens when a request actually matches.

  • Works with any LLM

    AI skills are plain Markdown, not provider-specific code, so this works with GPT, Claude, Gemini, Grok, or a local model.

  • 6 bundled files

    Scripts, templates, and references the model can read while it works. Files are read-only and never executed.

  • Open source

    Published by manhvann on GitHub. Read the source before you install it.

Installation

Install the Ck:Mobile Development AI skill in TypingMind to use it with any LLM, or drop it into another agent that reads SKILL.md.

1

Install in TypingMind

TypingMind installs a skill straight from its GitHub folder — it reads SKILL.md, bundles the resource files, and stores the result locally.

  1. Open the app and go to Plugins → Skills.
  2. Choose "Install from GitHub".
  3. Paste the skill folder URL below and confirm.
    https://github.com/manhvann/codexkit/tree/main/.agents/skills/mobile-development
  4. Enable the skill in any chat where you want it available.
Plugins → Skills → Add skill → From GitHub URL, then paste the folder URL and press Continue.
2

Install in another agent

Any agent that reads the Agent Skills format can use this skill — copy the folder into that agent's skills directory.

Claude Code — .claude/skills
git clone --depth 1 https://github.com/manhvann/codexkit.git /tmp/codexkit
mkdir -p .claude/skills
cp -r /tmp/codexkit/.agents/skills/mobile-development .claude/skills/manhvann-ck-mobile-development
Restart Claude Code after copying so it picks up the new skill.

Use it in TypingMind

Enable Ck:Mobile Development in any TypingMind chat and the model takes it from there. Its name and description sit in the system prompt, and the moment a request matches, the model loads the full instructions itself — you never invoke it by hand, and it costs no tokens until it is actually used.

The model loads Ck:Mobile Development on its own as soon as a request matches it.

Works with any AI model

AI skills are plain Markdown instructions rather than provider-specific code, so Ck:Mobile Development is not tied to the model it was written for. Install it once in TypingMind and use it with GPT-5, Claude, Gemini, Grok, DeepSeek, Mistral, Llama, or a local model you run yourself — all on your own API keys.

  • Loaded only when it is needed

    The system prompt carries just the name and description. The instructions are fetched on the first matching request, so an idle skill costs nothing.

  • Switch models mid-chat

    Because the skill is instructions rather than code, changing model does not break it — the next model reads the same SKILL.md.

Skill instructions

This is the SKILL.md content the model loads. Read it before installing — a skill is instructions your model will follow.

Mobile Development Skill

Production-ready mobile development with modern frameworks, best practices, and mobile-first thinking patterns.

When to Use

  • Building mobile applications (iOS, Android, or cross-platform)
  • Implementing mobile-first design and UX patterns
  • Optimizing for mobile constraints (battery, memory, network, small screens)
  • Making native vs cross-platform technology decisions
  • Implementing offline-first architecture and data sync
  • Following platform-specific guidelines (iOS HIG, Material Design)
  • Optimizing mobile app performance and user experience
  • Implementing mobile security and authentication
  • Testing mobile applications (unit, integration, E2E)
  • Deploying to App Store and Google Play

Technology Selection Guide

Cross-Platform Frameworks:

  • React Native: JavaScript expertise, web code sharing, mature ecosystem (121K stars, 67% familiarity)
  • Flutter: Performance-critical apps, complex animations, fastest-growing (170K stars, 46% adoption)

Native Development:

  • iOS (Swift/SwiftUI): Maximum iOS performance, latest features, Apple ecosystem integration
  • Android (Kotlin/Jetpack Compose): Maximum Android performance, Material Design 3, platform optimization

See: references/mobile-frameworks.md for detailed framework comparisons

Mobile Development Mindset

The 10 Commandments of Mobile Development:

  1. Performance is Foundation, Not Feature - 70% abandon apps >3s load time
  2. Every Kilobyte, Every Millisecond Matters - Mobile constraints are real
  3. Offline-First by Default - Network is unreliable, design for it
  4. User Context > Developer Environment - Think real-world usage scenarios
  5. Platform Awareness Without Platform Lock-In - Respect platform conventions
  6. Iterate, Don't Perfect - Ship, measure, improve cycle is survival
  7. Security and Accessibility by Design - Not afterthoughts
  8. Test on Real Devices - Simulators lie about performance
  9. Architecture Scales with Complexity - Don't over-engineer simple apps
  10. Continuous Learning is Survival - Mobile landscape evolves rapidly

See: references/mobile-mindset.md for thinking patterns and decision frameworks

Reference Navigation

Core Technologies:

  • mobile-frameworks.md - React Native, Flutter, Swift, Kotlin, framework comparison matrices, when to use each
  • mobile-ios.md - Swift 6, SwiftUI, iOS architecture patterns, HIG, App Store requirements, platform capabilities
  • mobile-android.md - Kotlin, Jetpack Compose, Material Design 3, Play Store, Android-specific features

Best Practices & Development Mindset:

  • mobile-best-practices.md - Mobile-first design, performance optimization, offline-first architecture, security, testing, accessibility, deployment, analytics
  • mobile-debugging.md - Debugging tools, performance profiling, crash analysis, network debugging, platform-specific debugging
  • mobile-mindset.md - Thinking patterns, decision frameworks, platform-specific thinking, common pitfalls, debugging strategies

Key Best Practices (2024-2025)

Performance Targets:

  • App launch: <2 seconds (70% abandon if >3s)
  • Memory usage: <100MB for typical screens
  • Network requests: Batch and cache aggressively
  • Battery impact: Respect Doze Mode and background restrictions
  • Animation: 60 FPS (16.67ms per frame)

Architecture:

  • MVVM for small-medium apps (clean separation, testable)
  • MVVM + Clean Architecture for large enterprise apps
  • Offline-first with hybrid sync (push + pull)
  • State management: Zustand (React Native), Riverpod 3 (Flutter), StateFlow (Android)

Security (OWASP Mobile Top 10):

  • OAuth 2.0 + JWT + Biometrics for authentication
  • Keychain (iOS) / KeyStore (Android) for sensitive data
  • Certificate pinning for network security
  • Never hardcode credentials or API keys
  • Implement proper session management

Testing Strategy:

  • Unit tests: 70%+ coverage for business logic
  • Integration tests: Critical user flows
  • E2E tests: Detox (React Native), Appium (cross-platform), XCUITest (iOS), Espresso (Android)
  • Real device testing mandatory before release

Deployment:

  • Fastlane for automation across platforms
  • Staged rollouts: Internal → Closed → Open → Production
  • Mandatory: iOS 17 SDK (2024), Android 15 API 35 (Aug 2025)
  • CI/CD saves 20% development time

Quick Decision Matrix

NeedChoose
JavaScript team, web code sharingReact Native
Performance-critical, complex animationsFlutter
Maximum iOS performance, latest featuresSwift/SwiftUI native
Maximum Android performance, Material 3Kotlin/Compose native
Rapid prototypingReact Native + Expo
Desktop + mobileFlutter
Enterprise with JavaScript skillsReact Native
Startup with limited resourcesFlutter or React Native
Gaming or heavy graphicsNative (Swift/Kotlin) or Unity

Framework Quick Comparison (2024-2025)

CriterionReact NativeFlutterSwift/SwiftUIKotlin/Compose
Stars121K170KN/AN/A
Adoption35%46%iOS onlyAndroid only
Performance80-90% native85-95% native100% native100% native
Dev SpeedFast (hot reload)Very fast (hot reload)Fast (Xcode Previews)Fast (Live Edit)
Learning CurveEasy (JavaScript)Medium (Dart)Medium (Swift)Medium (Kotlin)
UI ParadigmComponent-basedWidget-basedDeclarativeDeclarative
CommunityHuge (npm)GrowingApple ecosystemAndroid ecosystem
Best ForJS teams, web sharingPerformance, animationsiOS-only appsAndroid-only apps

Implementation Checklist

Project Setup:

  • Choose framework → Initialize project → Configure dev environment → Setup version control → Configure CI/CD → Team standards

Architecture:

  • Choose pattern (MVVM/Clean) → Setup folders → State management → Navigation → API layer → Error handling → Logging

Core Features:

  • Authentication → Data persistence → API integration → Offline sync → Push notifications → Deep linking → Analytics

UI/UX:

  • Design system → Platform guidelines → Accessibility → Responsive layouts → Dark mode → Localization → Animations

Performance:

  • Image optimization → Lazy loading → Memory profiling → Network optimization → Battery testing → Launch time optimization

Quality:

  • Unit tests (70%+) → Integration tests → E2E tests → Accessibility testing → Performance testing → Security audit

Security:

  • Secure storage → Authentication flow → Network security → Input validation → Session management → Encryption

Deployment:

  • App icons/splash → Screenshots → Store listings → Privacy policy → TestFlight/Internal testing → Staged rollout → Monitoring

Platform-Specific Guidelines

iOS (Human Interface Guidelines):

  • Native navigation patterns (tab bar, navigation bar)
  • iOS design patterns (pull to refresh, swipe actions)
  • San Francisco font, iOS color system
  • Haptic feedback, 3D Touch/Haptic Touch
  • Respect safe areas and notch

Android (Material Design 3):

  • Material navigation (bottom nav, navigation drawer)
  • Floating action buttons, material components
  • Roboto font, Material You dynamic colors
  • Touch feedback (ripple effects)
  • Respect system bars and gestures

Common Pitfalls to Avoid

  1. Testing only on simulators - Real devices show true performance
  2. Ignoring platform conventions - Users expect platform-specific patterns
  3. No offline handling - Network failures will happen
  4. Poor memory management - Leads to crashes and poor UX
  5. Hardcoded credentials - Security vulnerability
  6. No accessibility - Excludes 15%+ of users
  7. Premature optimization - Optimize based on metrics, not assumptions
  8. Over-engineering - Start simple, scale as needed
  9. Skipping real device testing - Simulators don't show battery/network issues
  10. Not respecting battery - Background processing must be justified

Performance Budgets

Recommended Targets:

  • App size: <50MB initial download, <200MB total
  • Launch time: <2 seconds to interactive
  • Screen load: <1 second for cached data
  • Network request: <3 seconds for API calls
  • Memory: <100MB for typical screens, <200MB peak
  • Battery: <5% drain per hour of active use
  • Frame rate: 60 FPS (16.67ms per frame)

Resources

Official Documentation:

Tools & Testing:

Community:

Bundled files

The model reads these on demand while the skill is loaded. They are exposed as readable files and are never executed.

Frequently asked questions

What does the Ck:Mobile Development AI skill do?

Build mobile apps with React Native, Flutter, Swift/SwiftUI, Kotlin/Jetpack Compose. Use for iOS/Android, mobile UX, performance optimization, offline-first, app store deployment.

Why use Ck:Mobile Development on TypingMind?

Because you install it once and use it with any model. Ck:Mobile Development is plain Markdown rather than provider-specific code, so the same skill runs on GPT-5, Claude, Gemini, Grok, or a local model — and you can switch model mid-chat without it breaking. TypingMind runs on your own API keys, so you pay providers directly instead of a per-seat subscription, and your skills and chats stay in your own storage.

How do I install Ck:Mobile Development in TypingMind?

Open Plugins → Skills → Install from GitHub in TypingMind and paste https://github.com/manhvann/codexkit/tree/main/.agents/skills/mobile-development. TypingMind reads its SKILL.md and bundles its files and installs it as a skill you can enable per chat.

Which AI models can use Ck:Mobile Development?

Any model you connect in TypingMind. AI skills are plain Markdown instructions rather than provider-specific code, so GPT, Claude, Gemini, Grok, and local models can all load this skill when a request matches it.

How many AI models can I use with Ck:Mobile Development?

As many as you like. As long as a model supports skills, you can use Ck:Mobile Development with it — GPT, Claude, Gemini, Grok, DeepSeek, Mistral, Llama and more — all on TypingMind with your own API keys.

Is the Ck:Mobile Development AI skill free?

Yes. It is published on GitHub by manhvann under the MIT license. You only pay your own AI provider for the tokens you use.

What are AI skills?

An AI skill is a reusable instruction bundle that teaches an AI model how to do one specific task. It follows the open Agent Skills format: a SKILL.md file with a name and description, plus any scripts, templates or reference files the model may need. The model reads the instructions only when your request matches the skill, so an installed skill costs nothing until it is used.

How are AI skills different from plugins or MCP servers?

A plugin or MCP server gives a model new tools to call — code that runs somewhere and returns a result. An AI skill gives the model knowledge and process instead: how to approach a task, which steps to follow, what good output looks like. Skills are plain Markdown, so they need no server, no API key and no runtime, and they work with any model.

Related AI Skills

View all
openclaw logo

Discrawl

openclaw
OrganizationPopular

Discord archive: search, sync freshness, DMs, summaries, TUI, repo/release work.

82.2K
391K
1 files
View
openclaw logo

Gitcrawl

openclaw
OrganizationPopular

GitHub archive: issue/PR search, sync freshness, duplicate clusters, current GitHub handoff, and Gitcrawl repo work.

82.2K
391K
1 files
View
openclaw logo

Graincrawl

openclaw
OrganizationPopular

Granola archive: search, sync freshness, notes, transcripts, panels, SQL counts, and Graincrawl repo work.

82.2K
391K
1 files
View
openclaw logo

Openclaw Changelog Update

openclaw
OrganizationPopular

Regenerate OpenClaw release changelog sections from git history before beta, stable, or extended-stable releases.

82.2K
391K
1 files
View

Set up your own AI workspace now

Get notified about new features and future giveaways by subscribing to our newsletter 👇