About react-native-core
A React Native reference skill for developers building mobile apps with JavaScript. It covers core UI, platform APIs, accessibility, architecture, and practical implementation guidance.
Key features
- 01Core components and Flexbox layout
- 02StyleSheet styling and theming
- 03Animations and touch interactions
- 04Platform APIs and native integrations
- 05Lists, accessibility, and debugging
Use cases
- 01Building mobile interfaces with React Native
- 02Handling platform-specific app behavior
- 03Choosing core APIs for common UI tasks
Install
Copy the command and run it in a terminal.
$
npx skills add https:/ / github.com/ maikotrindade/ awesome-react-native-skills --skill react-native-coreAfter installing, type/react-native-corein Claude Code to confirm it loaded.
Bundled files
References and scripts installed along with SKILL.md.
references/best-practices-debugging.mdcomponents-ui.mdcore-components.mdcore-layout.mdcore-styling.mdfeatures-accessibility.mdfeatures-animations.mdfeatures-colors-theming.mdfeatures-easing.mdfeatures-keyboard.mdfeatures-lists.mdfeatures-network.mdfeatures-new-architecture.mdfeatures-platform-apis.mdfeatures-platform-specific.mdfeatures-share-vibration.mdfeatures-statusbar.mdfeatures-timers.mdfeatures-touch-handling.mdfeatures-transforms.mdDetails
From the project READMEReact Native Core
Based on React Native docs as of 2026.
See also:
- Ecosystem libraries (navigation, state, TanStack Query, Reanimated) →
react-native-ecosystem- Expo SDK and EAS tooling →
react-native-expo- Deep performance work (FPS, bundle, TTI, memory, native) →
react-native-performance- React Native Testing Library deep dive →
react-native-testing
React Native lets you build mobile apps using only JavaScript. It uses the same design as React, letting you compose a rich mobile UI from declarative components. With React Native, you build a real mobile app that's indistinguishable from an app built using Objective-C or Java.
Core References
| Topic | Description | Reference |
|---|---|---|
| Core Components | View, Text, Image, TextInput, ScrollView — fundamental UI building blocks | core-components |
| Layout with Flexbox | Flexbox layout system for positioning and aligning components | core-layout |
| Styling | StyleSheet API for creating and organizing component styles | core-styling |
Features
Animations
| Topic | Description | Reference |
|---|---|---|
| Animated API | Built-in Animated API — timing, spring, composition (use Reanimated v3 for complex cases) | features-animations |
| Easing Functions | Easing functions for custom animation curves and natural motion | features-easing |
User Interactions
| Topic | Description | Reference |
|---|---|---|
| Touch Handling | Pressable, Touchable components, and gesture responders for handling user input | features-touch-handling |
| Keyboard | Keyboard API for handling keyboard events, dismissing keyboard, and KeyboardAvoidingView | features-keyboard |
UI Components
| Topic | Description | Reference |
|---|---|---|
| Additional Components | Modal, Switch, ActivityIndicator, RefreshControl for dialogs, toggles, loading states | components-ui |
Data Display
| Topic | Description | Reference |
|---|---|---|
| Lists | FlatList and SectionList for efficiently rendering large, scrollable lists | features-lists |
Styling and Theming
| Topic | Description | Reference |
|---|---|---|
| Colors and Theming | Colors, PlatformColor, Appearance API for theming and dark mode support | features-colors-theming |
Platform Integration
| Topic | Description | Reference |
|---|---|---|
| Platform APIs | Linking, Dimensions, Platform detection, AppState, and native integrations | features-platform-apis |
| Network | Fetch API for HTTP requests (production apps: Axios + TanStack Query) | features-network |
| StatusBar | Control status bar appearance, style, and visibility | features-statusbar |
| Share & Vibration | Native share dialog and device vibration for haptic feedback | features-share-vibration |
| Timers | setTimeout, setInterval, requestAnimationFrame for scheduling and delays | features-timers |
| Platform-Specific APIs | Android (ToastAndroid, DrawerLayoutAndroid) and iOS (ActionSheetIOS) native patterns | features-platform-specific |
Accessibility
| Topic | Description | Reference |
|---|---|---|
| Accessibility | Screen reader support, accessibility labels, roles, and states | features-accessibility |
Advanced Styling
| Topic | Description | Reference |
|---|---|---|
| Transforms | 2D and 3D transforms for rotation, scale, translation, and skew | features-transforms |
Architecture
| Topic | Description | Reference |
|---|---|---|
| New Architecture | Fabric, JSI, TurboModules — default since RN 0.76, what it means for your code | features-new-architecture |
Best Practices
| Topic | Description | Reference |
|---|---|---|
| Debugging | React Native DevTools, LogBox, Dev Menu, and debugging techniques | best-practices-debugging |
Key Recommendations
- Use
StyleSheet.create()for all styles instead of inline objects - Use FlatList instead of ScrollView for long lists
- Use Pressable for new touch interactions (preferred over deprecated Touchable components)
- Animations: the built-in
AnimatedAPI suffices for simple cases; use Reanimated v3 for complex or gesture-driven animations - Permissions: use
react-native-permissionsfor cross-platform permission handling instead of the low-levelPermissionsAndroid - Handle platform differences with
Platform.select()andPlatform.OS - Test on real devices — simulator behavior may differ from actual devices
- Use TypeScript for better type safety and developer experience
- New Architecture is default in RN 0.76+ — Fabric, JSI, and TurboModules are active; check library compatibility
Comments
Markdown supported