senior-mobile
iOS、Android、React Native、Flutterなどのプラットフォーム向けに専門的なモバイルアプリケーション開発ガイダンスを提供します。
npx skills add borghei/claude-skills --skill senior-mobileBefore / After 効果比較
1 组経験不足のチームによって開発されたモバイルアプリケーションは、パフォーマンスのボトルネック、メモリリーク、UIのフリーズ、バッテリー消費の速さなどの問題を抱え、ユーザーエクスペリエンスが悪く、アプリストアの評価も低かった。
'senior-mobile' スキル指導により、アプリケーションはiOS、Android、React Native、またはFlutterプラットフォームで包括的な最適化が行われました。パフォーマンスの問題が解決され、スムーズなUIアニメーション、効率的なオフラインデータ処理、およびより低いリソース消費が実現され、ユーザー満足度とアプリケーション品質が大幅に向上しました。
description SKILL.md
senior-mobile
Senior Mobile Developer
Expert mobile application development across iOS, Android, React Native, and Flutter.
Keywords
mobile, ios, android, react-native, flutter, swift, kotlin, swiftui, jetpack-compose, expo-router, zustand, app-store, performance, offline-first
Quick Start
# Scaffold a React Native project
python scripts/mobile_scaffold.py --platform react-native --name MyApp
# Build for production
python scripts/build.py --platform ios --env production
# Generate App Store metadata
python scripts/store_metadata.py --screenshots ./screenshots
# Profile rendering performance
python scripts/profile.py --platform android --output report.html
Tools
Script Purpose
scripts/mobile_scaffold.py
Scaffold project for react-native, ios, android, or flutter
scripts/build.py
Build automation with environment and platform flags
scripts/store_metadata.py
Generate App Store / Play Store listing metadata
scripts/profile.py
Profile rendering, memory, and startup performance
Platform Decision Matrix
Aspect Native iOS Native Android React Native Flutter
Language Swift Kotlin TypeScript Dart
UI Framework SwiftUI/UIKit Compose/XML React Widgets
Performance Best Best Good Very Good
Code Sharing None None ~80% ~95%
Best For iOS-only, hardware-heavy Android-only, hardware-heavy Web team, shared logic Maximum code sharing
Workflow 1: Scaffold a React Native App (Expo Router)
-
Generate project --
python scripts/mobile_scaffold.py --platform react-native --name MyApp -
Verify directory structure matches this layout:
src/
├── app/ # Expo Router file-based routes
│ ├── (tabs)/ # Tab navigation group
│ ├── auth/ # Auth screens
│ └── _layout.tsx # Root layout
├── components/
│ ├── ui/ # Reusable primitives (Button, Input, Card)
│ └── features/ # Domain components (ProductCard, UserAvatar)
├── hooks/ # Custom hooks (useAuth, useApi)
├── services/ # API clients and storage
├── stores/ # Zustand state stores
└── utils/ # Helpers
-
Configure navigation in
app/_layout.tsxwith Stack and Tabs. -
Set up state management with Zustand + AsyncStorage persistence.
-
Validate -- Run the app on both iOS simulator and Android emulator. Confirm navigation and state persistence work.
Workflow 2: Build a SwiftUI Feature (iOS)
-
Create the View using
NavigationStack,@StateObjectfor ViewModel binding, and.taskfor async data loading. -
Create the ViewModel as
@MainActor classwith@Publishedproperties. Inject services via protocol for testability. -
Wire data flow: View observes ViewModel -> ViewModel calls Service -> Service returns data -> ViewModel updates
@Published-> View re-renders. -
Add search/refresh:
.searchable(text:)for filtering,.refreshablefor pull-to-refresh. -
Validate -- Run in Xcode previews first, then simulator. Confirm async loading, error states, and empty states all render correctly.
Example: SwiftUI ViewModel Pattern
@MainActor
class ProductListViewModel: ObservableObject {
@Published private(set) var products: [Product] = []
@Published private(set) var isLoading = false
@Published private(set) var error: Error?
private let service: ProductServiceProtocol
init(service: ProductServiceProtocol = ProductService()) {
self.service = service
}
func loadProducts() async {
isLoading = true
error = nil
do {
products = try await service.fetchProducts()
} catch {
self.error = error
}
isLoading = false
}
}
Workflow 3: Build a Jetpack Compose Feature (Android)
-
Create the Composable screen with
Scaffold,TopAppBar, and state collection viacollectAsStateWithLifecycle(). -
Handle UI states with a sealed interface:
Loading,Success<T>,Error. -
Create the ViewModel with
@HiltViewModel,MutableStateFlow, and repository injection. -
Build list UI using
LazyColumnwithkeyparameter for stable identity andArrangement.spacedBy()for spacing. -
Validate -- Run on emulator. Confirm state transitions (loading -> success, loading -> error -> retry) work correctly.
Example: Compose UiState Pattern
sealed interface UiState<out T> {
data object Loading : UiState<Nothing>
data class Success<T>(val data: T) : UiState<T>
data class Error(val message: String) : UiState<Nothing>
}
@HiltViewModel
class ProductListViewModel @Inject constructor(
private val repository: ProductRepository
) : ViewModel() {
private val _uiState = MutableStateFlow<UiState<List<Product>>>(UiState.Loading)
val uiState: StateFlow<UiState<List<Product>>> = _uiState.asStateFlow()
fun loadProducts() {
viewModelScope.launch {
_uiState.value = UiState.Loading
repository.getProducts()
.catch { e -> _uiState.value = UiState.Error(e.message ?: "Unknown error") }
.collect { products -> _uiState.value = UiState.Success(products) }
}
}
}
Workflow 4: Optimize Mobile Performance
-
Profile --
python scripts/profile.py --platform <ios|android> --output report.html -
Apply React Native optimizations:
Use FlatList with keyExtractor, initialNumToRender=10, windowSize=5, removeClippedSubviews=true
-
Memoize components with
React.memoand handlers withuseCallback -
Supply
getItemLayoutfor fixed-height rows to skip measurement -
Apply native iOS optimizations:
Implement prefetchItemsAt for image pre-loading in collection views
- Apply native Android optimizations:
Set setHasFixedSize(true) and setItemViewCacheSize(20) on RecyclerViews
- Validate -- Re-run profiler and confirm frame drops reduced and startup time improved.
Workflow 5: Submit to App Store / Play Store
-
Generate metadata --
python scripts/store_metadata.py --screenshots ./screenshots -
Build release --
python scripts/build.py --platform ios --env production -
Review the generated listing (title, description, keywords, screenshots).
-
Upload via Xcode (iOS) or Play Console (Android).
-
Validate -- Monitor review status and address any rejection feedback.
Reference Materials
Document Path
React Native Guide references/react_native_guide.md
iOS Patterns references/ios_patterns.md
Android Patterns references/android_patterns.md
App Store Guide references/app_store_guide.md
Full Code Examples REFERENCE.md
Weekly Installs247Repositoryborghei/claude-skillsGitHub Stars42First SeenJan 23, 2026Security AuditsGen Agent Trust HubPassSocketPassSnykPassInstalled onopencode205gemini-cli192codex187github-copilot182cursor178claude-code176
forumユーザーレビュー (0)
レビューを書く
レビューなし
統計データ
ユーザー評価
この Skill を評価