63 SECTIONS · 1732 TOPICS
Expo Roadmap
Installing and Initializing Projects
- 1. Installing Expo CLI
- Example: Verify Installation
- 2. Creating New Project
- Example: Using Expo CLI to create a new project
- 3. Choosing Project Template
- Example: Initializing with Tabs Template
- Template Comparison
- 4. Installing Dependencies
- Example: Installing a dependency with Expo CLI
- Example: Installing with npm
- 5. Understanding Project Structure
- Example: Basic App Structure
- 6. Initializing Git Repository
- Example: Initialize Git repository
- 7. Setting Up TypeScript
- Example: Configure tsconfig.json
- 8. Configuring Metro Bundler
- Example: Custom Metro Configuration
- 9. Installing Expo Go App
- Example: Opening Expo Go on Device
- 10. Understanding Managed vs Bare Workflow
- Managed vs Bare Workflow Comparison
- 11. Using Expo Snacks
- Example: Creating a New Snack
- 12. Upgrading Expo SDK Version
Configuring App Settings (app.json)
- 1. Setting App Name and Slug
- Example: Basic app.json configuration
- 2. Configuring App Version
- Example: Setting App Version
- 3. Setting App Icon
- Example: Setting App Icon
- 4. Configuring Splash Screen
- Example: Splash Screen Configuration
- 5. Setting Orientation Mode
- Example: Setting Orientation to Portrait
- 6. Defining Color Scheme
- Example: Setting Color Scheme
- 7. Configuring iOS Settings
- Example: Setting iOS Bundle Identifier and Build Number
- Example: Adding Custom Info.plist Values
- 8. Configuring Android Settings
- Example: Android Settings in app.json
- 9. Setting Web Configuration
- Example: Custom Webpack Configuration
- 10. Configuring Plugins
- Example: Adding a Plugin
- 11. Setting Extra Metadata
- Example: Setting Extra Metadata
- 12. Configuring Deep Link Scheme
- Example: Setting up a Custom Deep Link Scheme
Working with Expo CLI Commands
- 1. Starting Development Server
- Example: Starting the Development Server
- Example: Starting the Development Server with Web Support
- Example: Starting the Development Server for Android
- Example: Starting the Development Server for iOS
- 2. Running on iOS Simulator
- Example: Running on iOS Simulator
- 3. Running on Android Emulator
- Example: Running on Android Emulator
- 4. Running on Web
- Example: Running on Web
- 5. Clearing Metro Cache
- Example: Clearing Metro Cache
- 6. Installing Packages
- Example: Installing a Package
- Example: Installing a Development Dependency
- 7. Running Prebuild
- Example: Running prebuild
- Prebuild Workflow
- 8. Customizing Project
- Example: Customizing project configuration
- 9. Ejecting to Bare Workflow
- Example: Running the eject command
- What Happens During Eject
- 10. Checking Config
- Example: Checking Config
- 11. Diagnosing Issues
- Example: Check Expo CLI version
- Common Diagnostics Issues
- 12. Viewing Project Info
- Example: expo diagnostics
- Example: expo config
Working with Core Components
- 1. Using View Component
- Example: Basic View Usage
- 2. Using Text Component
- Example: Basic Text Usage
- Example: Text with Ellipsis
- 3. Using ScrollView
- Example: Basic ScrollView Usage
- Example: Horizontal ScrollView
- 4. Using FlatList
- Example: Basic FlatList Usage
- Example: Horizontal FlatList
- Example: Grid Layout with FlatList
- 5. Using SectionList
- Example: Basic SectionList Usage
- 6. Using Image Component
- Example: Basic Image Usage
- Example: Local Image
- 7. Using ImageBackground
- Example: Basic ImageBackground Usage
- 8. Using TextInput
- Example: Basic TextInput Usage
- Example: Secure Text Input
- 9. Using Button Component
- Example: Basic Button Usage
- Example: Button with Disabled State
- 10. Using Pressable
- Example: Basic Pressable Usage
- Example: Pressable with Long Press
- 11. Using TouchableOpacity
- Example: Basic TouchableOpacity Usage
- 12. Using ActivityIndicator
- Example: Basic ActivityIndicator
Working with Layout Components
- 1. Using Modal Component
- Example: Basic Modal Usage
- 2. Using Switch Component
- Example: Basic Switch Usage
- Example: Switch with Custom Colors
- 3. Using RefreshControl
- Example: Using RefreshControl with ScrollView
- 4. Using KeyboardAvoidingView
- Example: Basic usage of KeyboardAvoidingView
- 5. Using SafeAreaView
- Example: Basic SafeAreaView Usage
- 6. Using StatusBar Component
- Example: Setting StatusBar Properties
- 7. Using VirtualizedList
- Example: Basic VirtualizedList Usage
- 8. Using Animated.View
- Example: Basic Animated View
- Key Points
- 9. Using Portal Component
- Example: Basic Portal Usage
- 10. Using Fragment Component
- Example: Basic Fragment Usage
Working with Expo Router
- 1. Creating Routes
- Example: Basic Route Setup
- Example: Dynamic Route
- 2. Creating Layout Files
- Example: Root Layout File
- Example: Route Group Layout
- 3. Navigating Between Screens
- Example: Using router.push()
- Example: Using router.replace()
- 4. Using Dynamic Routes
- Example: Accessing Dynamic Route Parameters
- Example: Nested Dynamic Routes
- 5. Creating Tabs Layout
- Example: Basic Tab Layout
- Example: Tab with Icons
- 6. Creating Stack Layout
- Example: Basic Stack Layout
- 7. Creating Drawer Layout
- Example: Basic Drawer Navigation Setup
- Drawer Navigation Summary
- 8. Handling Route Parameters
- Example: Accessing Route Parameters
- Example: Using Parameters in Navigation
- 9. Implementing Redirects
- Example: Redirect from a Route
- Example: Redirect with Query Parameters
- 10. Creating Not Found Screen
- Example: Basic 404 Page
- Example: Redirect to Home
- 11. Using Typed Routes
- Example: Typed Route Navigation
- 12. Implementing Deep Linking
- Example: Using Link Component for Deep Links
- Example: Using useLinkTo Hook
Managing Navigation State
- 1. Using Navigation State
- Example: Navigation State in Stack Navigator
- Example: Using Route Parameters
- Example: Navigating with Parameters
- 2. Persisting Navigation State
- Example: Using AsyncStorage to persist navigation state
- Best Practices for Navigation State Persistence
- 3. Handling Focus Events
- Example: Managing Focus with Navigation Events
- 4. Accessing Route Parameters
- Example: Accessing Route Parameters
- 5. Setting Screen Options
- Example: Setting Header Title
- Example: Hiding Header
- Example: Custom Header Component
- 6. Customizing Headers
- Example: Custom Header with Icons
- 7. Configuring Tab Bar Icons
- Example: Tab Bar Icon Configuration
- 8. Implementing Authentication Flow
- Example: Basic Authentication Flow Setup
- Example: Login Screen with Navigation
- Example: Protected Home Screen
- 9. Handling Deep Link Navigation
- Example: Handling Deep Links
- Deep Link Navigation Summary
- 10. Using Navigation Ref
- Example: Accessing Navigation Ref
- 11. Resetting Navigation Stack
- Example: Resetting Navigation Stack
- 12. Preventing Go Back
- Example: Preventing Navigation Back
Working with Forms and Input
- 1. Creating Text Inputs
- Example: Basic Text Input
- Example: Password Input
- 2. Handling Input Changes
- Example: Handling Text Input Changes
- Example: Managing Multiple Inputs
- 3. Managing Input Focus
- Example: Managing Focus with useRef
- 4. Implementing Form Validation
- Example: Custom Validation with React Hook Form
- Example: Server-Side Validation (Node.js)
- 5. Using Controlled Inputs
- Example: Controlled Input in Expo
- 6. Managing Keyboard Type
- Example: Setting Keyboard Type
- Example: Numeric Input
- 7. Setting Return Key
- Example: Setting Return Key Type
- 8. Implementing Multi-line Input
- Example: Multi-line Input Component
- 9. Using Secure Text Entry
- Example: Secure Text Entry in TextInput
- 10. Handling Form Submission
- Example: Basic Form Submission
- 11. Creating Custom Input Components
- Example: Custom Input Component
- Example: Using Custom Input in a Form
- 12. Using Form Libraries
- Example: React Hook Form with Expo
Managing Keyboard Behavior
- 1. Using KeyboardAvoidingView
- Example: Basic usage of KeyboardAvoidingView
- 2. Dismissing Keyboard
- Example: Programmatically dismiss keyboard
- 3. Listening to Keyboard Events
- Example: Listening to Keyboard Events
- 4. Setting Keyboard Appearance
- Example: Setting Keyboard Appearance
- 5. Handling Keyboard Height
- Example: Using Keyboard Height
- 6. Using dismissKeyboardOnPress
- Example: Using dismissKeyboardOnPress
- 7. Implementing KeyboardAwareScrollView
- Example: Basic KeyboardAwareScrollView Usage
- Example: Handling Keyboard Events
- 8. Managing Keyboard Spacing
- Example: Using keyboardShouldPersistTaps
- Example: Adjusting contentInset
- 9. Using returnKeyType Navigation
- Example: Setting returnKeyType
- 10. Configuring Keyboard Toolbar
- Example: Enabling Keyboard Toolbar
- Example: Customizing Keyboard Toolbar
Managing Assets and Resources
- 1. Importing Images
- Example: Importing Static Image
- Example: Using Asset.loadAsync
- 2. Using Local Images
- Example: Loading Local Image
- 3. Loading Remote Images
- Example: Loading a Remote Image
- 4. Loading Custom Fonts
- Example: Loading Custom Font
- 5. Using Font.loadAsync() Method
- Example: Loading a Custom Font
- 6. Configuring App Icon
- Example: Setting App Icon in app.json
- 7. Creating Adaptive Icons
- Example: Configuring Adaptive Icons
- 8. Configuring Splash Screen
- Example: splash configuration in app.json
- 9. Using Asset.loadAsync() Method
- Example: Loading Assets with Asset.loadAsync()
- 10. Optimizing Image Loading
- Example: Using resize mode
- Example: Applying blur effect
- Image Loading Best Practices
- 11. Working with SVG
- Example: Importing SVG as Component
- Example: Using SVG as Resource
- 12. Bundling Static Assets
- Example: Importing an Image
- Example: Using a Custom Font
Working with Styling and Layout
- 1. Using StyleSheet API
- Example: Creating a StyleSheet
- Example: Using StyleSheet in Component
- 2. Implementing Inline Styles
- Example: Basic inline style object
- Example: Using style arrays for cascading styles
- 3. Using Flexbox Layout
- Example: Basic Flexbox Layout
- Example: Flex Wrap and Align Content
- 4. Setting Dimensions
- Example: Setting Dimensions
- 5. Using Positioning
- Example: Absolute Positioning
- Example: Relative Positioning
- 6. Implementing Margins and Padding
- Example: Using margin and padding
- 7. Using Platform-Specific Styles
- Example: Conditional Style Application
- 8. Creating Responsive Layouts
- Example: Basic Flexbox Layout
- Example: Responsive Grid
- Responsive Layout Tips
- 9. Using Styled Components
- Example: Basic Styled Component
- Example: Dynamic Styling with Props
- 10. Implementing Custom Fonts
- Example: Using Custom Font in Text Component
- Example: Loading Custom Font from Assets
- 11. Using Design Tokens
- Example: Using Design Tokens in a Component
- Best Practices for Design Tokens
- 12. Creating Style Abstractions
- Example: Using StyleSheet.create
- Example: Using Custom Theme
Implementing Theming and Dark Mode
- 1. Creating Theme Context
- Example: Basic Theme Context Setup
- 2. Using Appearance API
- Example: Detecting Color Scheme
- Example: Listening to Color Scheme Changes
- 3. Detecting Color Scheme
- Example: Using useColorScheme
- 4. Implementing Dark Mode
- Example: Using Dark Mode in Expo
- 5. Setting Status Bar Style
- Example: Setting Status Bar Style
- 6. Using Dynamic Colors
- Example: Applying Dynamic Colors
- 7. Persisting Theme Preference
- Example: Using AsyncStorage to Save Theme
- 8. Creating Theme Provider
- Example: Basic Theme Provider Setup
- Workflow: Setting Up Theme Provider
- 9. Using Theme Variables
- Example: Defining Theme Variables
- Example: Using Theme Variables in Components
- 10. Implementing Theme Switching
- Example: Basic Theme Switching Setup
- Example: Using React Context for Theme
- Example: Applying Theme in Components
- 11. Supporting System Theme Changes
- Example: Detecting System Theme
- Key Points
- 12. Using Themed Components
- Example: ThemedText Usage
- Example: ThemedView Usage
Working with Status Bar and System UI
- 1. Configuring Status Bar
- Example: Setting Status Bar Style
- 2. Setting Status Bar Style
- Example: Setting Status Bar Style
- 3. Hiding Status Bar
- Example: Hide Status Bar
- 4. Setting Background Color
- Example: Setting Status Bar Background Color
- 5. Using System UI Mode
- Example: Setting System UI Mode
- 6. Setting Navigation Bar
- Example: Hiding Navigation Bar
- Example: Setting Navigation Bar Background Color
- 7. Implementing Edge-to-Edge Layout
- Example: Basic Edge-to-Edge Setup
- Key Points
- 8. Using Safe Area Context
- Example: Basic Safe Area Usage
- 9. Getting Safe Area Insets
- Example: Using SafeAreaInsets
- 10. Configuring Screen Orientation
- Example: Setting Orientation in App.js
- 11. Locking Screen Orientation
- Example: Locking to Portrait
- Example: Locking to Landscape
- 12. Handling Orientation Changes
- Example: Setting Orientation in App Configuration
- Example: Using Screen Orientation API
Working with Animations
- 1. Using Animated API
- Example: Basic Animation
- Example: Rotation Animation
- 2. Creating Timing Animations
- Example: Basic timing animation
- Example: Custom easing function
- 3. Using Spring Animations
- Example: Basic Spring Animation
- Example: Spring with Custom Configuration
- 4. Creating Sequences
- Example: Basic Sequence
- 5. Running Parallel Animations
- Example: Running Parallel Animations
- 6. Using Stagger Animations
- Example: Staggering Animations
- 7. Implementing Native Driver
- Example: Using Native Driver
- 8. Using Reanimated
- Example: Basic Reanimated Animation
- Key Features of Reanimated
- 9. Creating Shared Values
- Example: Using Shared Values in Animations
- 10. Using Animated Styles
- Example: Basic Animated Style
- 11. Implementing Gesture Handler Integration
- Example: Basic Pan Gesture
- Integration Steps
- 12. Creating Layout Animations
- Example: Enabling Layout Animation
Working with Advanced Animations
- 1. Using Worklets
- Example: Basic Worklet Usage
- 2. Creating Animated Reactions
- Example: Basic Animated Reaction
- 3. Interpolating Values
- Example: Basic Interpolation
- Example: Color Interpolation
- 4. Using Derived Values
- Example: Using Derived Values for Scaling
- Example: Combining Derived Values
- 5. Animating Colors
- Example: Animating Color with Easing
- 6. Creating Custom Easing
- Example: Custom Easing Function
- 7. Using Animation Callbacks
- Example: Using Animation Callbacks
- 8. Implementing Spring Physics
- Example: Basic Spring Configuration
- 9. Chaining Animations
- Example: Basic Animation Chain
- 10. Creating Repeating Animations
- Example: Basic Looping Animation
- Example: Alternate Direction Animation
Working with Gestures and Touch
- 1. Using Pressable Component
- Example: Basic Pressable Usage
- Example: Pressable with Ripple Effect (Android)
- 2. Handling Press Events
- Example: Basic Press Event
- Example: Long Press Event
- 3. Using Gesture Handler
- Example: Basic Tap Gesture
- Gesture Handler Setup
- 4. Implementing Pan Gestures
- Example: Basic Pan Gesture
- 5. Using Tap Gestures
- Example: Basic Tap Gesture
- Example: Long Press Gesture
- 6. Implementing Swipe Gestures
- Example: Swipe Gesture Handler
- 7. Using Pinch Gestures
- Example: Basic Pinch Gesture Setup
- 8. Creating Rotation Gestures
- Example: Basic Rotation Gesture
- 9. Combining Gestures
- Example: Combining Tap and Long Press
- Gesture Combination Strategies
- 10. Using Touch Events
- Example: Basic Touch Event Handler
- 11. Creating Gesture Composables
- Example: Basic Gesture Composable
- 12. Handling Double Tap
- Example: Double Tap Handler
Working with Haptics and Feedback
- 1. Using Haptic Feedback
- Example: Using Haptics.impact()
- 2. Triggering Impact Feedback
- Example: Triggering Impact Feedback
- 3. Triggering Notification Feedback
- Example: Triggering Notification Feedback
- 4. Triggering Selection Feedback
- Example: Triggering Selection Feedback
- 5. Setting Impact Style
- Example: Setting Impact Style
- 6. Using Vibration API
- Example: Using Haptics.impact()
- Example: Using Haptics.notification()
- Example: Using Haptics.selection()
- 7. Creating Vibration Patterns
- Example: Using Vibration API
- 8. Canceling Vibration
- Example: Canceling Vibration
- 9. Checking Haptic Support
- Example: Checking Haptic Support
- 10. Implementing Custom Haptic Patterns
- Example: Custom Haptic Pattern
Working with Camera (expo-camera)
- 1. Requesting Camera Permissions
- Example: Requesting Camera Permission
- 2. Creating Camera View
- Example: Basic Camera View
- 3. Taking Photos
- Example: Capture a Photo
- 4. Recording Video
- Example: Start Recording Video
- Example: Stop Recording Video
- 5. Switching Camera Type
- Example: Switching Camera Type
- 6. Setting Flash Mode
- Example: Setting Flash Mode
- 7. Configuring Zoom
- Example: Setting Zoom Level
- 8. Handling Barcode Scanning
- Example: Scanning QR Codes
- Supported Barcode Types
- 9. Using Camera Refs
- Example: Accessing Camera Instance
- 10. Accessing Camera Settings
- Example: Setting Camera Type and Flash Mode
- 11. Configuring Camera Ratio
- Example: Setting Camera Aspect Ratio
- 12. Using Picture Quality
- Example: Setting Picture Quality
Working with Image Picker (expo-image-picker)
- 1. Requesting Permissions
- Example: Requesting Permissions
- 2. Launching Camera
- Example: Launch Camera with Back Camera
- 3. Launching Image Library
- Example: Launching Image Library
- 4. Setting Media Types
- Example: Configure media types
- 5. Allowing Image Editing
- Example: Enabling Image Editing
- 6. Setting Aspect Ratio
- Example: Setting Aspect Ratio to 16:9
- 7. Setting Image Quality
- Example: Setting Image Quality
- 8. Allowing Multiple Selection
- Example: Configure Multiple Selection
- 9. Handling Picker Result
- Example: Handling Picker Result
- 10. Accessing Selected Assets
- Example: Accessing Selected Assets
- 11. Getting EXIF Data
- Example: Accessing EXIF Data
- 12. Using Video Selection
- Example: Selecting a Video
Working with Image Manipulation (expo-image-manipulator)
- 1. Resizing Images
- Example: Resizing an Image
- 2. Cropping Images
- Example: Cropping an Image
- 3. Rotating Images
- Example: Rotating an Image
- 4. Flipping Images
- Example: Flip Image Horizontally
- Example: Flip Image Vertically
- Example: Flip Image Both Ways
- 5. Saving Manipulated Images
- Example: Saving an Image
- 6. Setting Compression Level
- Example: Compressing an image with low quality
- 7. Converting Image Formats
- Example: Converting Image to JPEG
- Example: Converting Image to PNG
- 8. Combining Multiple Actions
- Example: Applying Multiple Transformations
- 9. Using Base64 Output
- Example: Resize Image and Output as Base64
- 10. Handling Manipulation Errors
- Example: Error Handling
Working with Media and Audio (expo-av)
- 1. Loading Audio Files
- Example: Loading an Audio File
- 2. Playing Audio
- Example: Basic Audio Playback
- Example: Controlling Playback
- 3. Pausing Audio
- Example: Pausing Audio
- 4. Stopping Audio
- Example: Stopping Audio
- 5. Setting Playback Position
- Example: Setting Playback Position
- 6. Setting Volume
- Example: Setting Volume
- 7. Configuring Audio Mode
- Example: Setting Audio Mode
- 8. Recording Audio
- Example: Start Recording Audio
- Example: Stop Recording Audio
- Recording Audio Summary
- 9. Playing Video
- Example: Playing a Video
- 10. Controlling Video Playback
- Example: Controlling Video Playback
- 11. Handling Playback Status
- Example: Handling Playback Status
- 12. Looping Playback
- Example: Looping Audio Playback
Working with Video Features
- 1. Configuring Video Source
- Example: Setting Video Source from URI
- Example: Setting Video Source from Asset
- 2. Setting Poster Image
- Example: Setting a Poster Image
- 3. Using Resize Modes
- Example: Setting Resize Mode
- 4. Implementing Fullscreen Mode
- Example: Toggle fullscreen mode
- 5. Handling Video Events
- Example: Handling Video Events
- 6. Using Picture-in-Picture
- Example: Enabling Picture-in-Picture
- 7. Setting Playback Rate
- Example: Setting Playback Rate
- 8. Implementing Video Controls
- Example: Basic Video Controls
- Example: Custom Video Controls
- 9. Seeking to Position
- Example: Seeking to a Position
- 10. Handling Buffering State
- Example: Handling Buffering State
Working with Location (expo-location)
- 1. Requesting Location Permissions
- Example: Requesting Location Permissions
- 2. Getting Current Position
- Example: Requesting Current Position
- 3. Watching Position Changes
- Example: Watching Position Changes
- 4. Reverse Geocoding
- Example: Reverse Geocoding
- 5. Forward Geocoding
- Example: Forward Geocoding an Address
- 6. Setting Location Accuracy
- Example: Setting Location Accuracy
- 7. Requesting Background Permissions
- Example: Requesting Background Location Permission
- 8. Starting Location Updates
- Example: Starting Location Updates
- 9. Getting Last Known Position
- 10. Checking Location Services
- Example: Check Location Permissions
- 11. Handling Location Errors
- Example: Handling Location Errors
- 12. Using Heading Updates
- Example: Subscribe to Heading Updates
Working with Maps (react-native-maps)
- 1. Installing Map Dependencies
- Example: Install react-native-maps
- 2. Creating MapView Component
- Example: Basic MapView Component
- 3. Setting Initial Region
- Example: Setting Initial Region
- 4. Adding Markers
- Example: Basic Marker
- Example: Custom Pin Color
- Example: Custom Image Marker
- 5. Creating Custom Markers
- Example: Custom Marker with Callout
- 6. Drawing Polylines
- Example: Drawing a Polyline
- 7. Drawing Polygons
- Example: Basic Polygon
- Example: Polygon with Tappable Event
- 8. Animating to Region
- Example: Animate to Region
- 9. Handling Map Events
- Example: Handling Map Press Event
- Example: Handling Marker Press
- 10. Using Google Maps
- Example: Basic Google Maps Integration
- 11. Fitting to Markers
- Example: Fit to Markers
- 12. Using Map Callouts
- Example: Basic Map Callout
- Example: Callout with Image
Working with Sensors
- 1. Using Accelerometer
- Example: Reading Accelerometer Data
- 2. Using Gyroscope
- Example: Subscribe to Gyroscope Data
- Example: Stop Listening to Gyroscope
- 3. Using Magnetometer
- Example: Reading Magnetometer Data
- 4. Using Barometer
- Example: Reading Barometer Data
- 5. Using Pedometer
- Example: Reading Pedometer Data
- 6. Setting Update Interval
- Example: Configure Update Interval
- 7. Adding Sensor Listeners
- Example: Adding a Sensor Listener
- 8. Removing Listeners
- Example: Removing a Sensor Listener
- 9. Using Device Motion
- Example: Using Device Motion
- 10. Checking Sensor Availability
- Example: Check Sensor Availability
- 11. Handling Sensor Errors
- Example: Error Handling with Sensor Data
- 12. Using Light Sensor
- Example: Reading Light Sensor Data
Working with Device Features
- 1. Getting Device Information
- 2. Getting Device Name
- Example: Retrieving Device Name
- 3. Getting Device Type
- Example: Detecting Device Type
- 4. Getting OS Version
- Example: Check OS Version
- 5. Getting Brand and Model
- Example: Fetching Device Brand and Model
- 6. Checking Device Status
- Example: Checking Device Status
- 7. Using Device Constants
- Example: Check if running on a physical device
- Example: Get device platform
- 8. Getting App Version
- Example: Get App Version
- 9. Controlling Brightness
- Example: Setting Brightness
- Example: Getting Brightness
- 10. Keeping Screen Awake
- Example: Enabling Screen Wake
- 11. Preventing Screen Capture
- Example: Preventing Screen Capture
- Summary of Screen Capture Prevention
- 12. Setting App Badge
- Example: Setting App Badge Count
Working with Calendar (expo-calendar)
- 1. Requesting Calendar Permissions
- Example: Requesting Calendar Permissions
- 2. Getting Calendars
- Example: Fetching Calendars
- 3. Creating Calendar Events
- Example: Creating a Calendar Event
- 4. Updating Events
- Example: Updating an Event
- 5. Deleting Events
- Example: Deleting an Event
- 6. Getting Events
- Example: Fetching Events from Calendar
- 7. Creating Reminders (iOS)
- Example: Creating a Reminder
- 8. Setting Event Recurrence
- Example: Setting Daily Recurrence
- Example: Weekly Recurrence with Count
- 9. Adding Event Alarms
- Example: Adding an Event with Alarm
- 10. Opening Calendar App
- Example: Opening Calendar App
- 11. Getting Event Details
- Example: Fetching Event Details
- 12. Filtering Events by Date
- Example: Filter Events by Date Range
Working with Contacts (expo-contacts)
- 1. Requesting Contacts Permissions
- Example: Requesting Contacts Permission
- 2. Getting All Contacts
- Example: Fetching All Contacts
- 3. Getting Contact by ID
- Example: Fetching a Contact by ID
- 4. Creating Contacts
- Example: Creating a Contact
- 5. Updating Contacts
- Example: Updating a Contact's Phone Number
- Example: Adding an Email Address to a Contact
- 6. Deleting Contacts
- Example: Deleting a Contact
- 7. Searching Contacts
- Example: Searching Contacts by Name
- Example: Searching Contacts by Phone Number
- 8. Getting Contact Groups
- Example: Fetching Contact Groups
- 9. Handling Contact Fields
- Example: Retrieving Contact Fields
- Example: Adding a New Contact with Fields
- 10. Opening Contact Form
- Example: Opening Contact Form
- 11. Formatting Contact Names
- Example: Formatting Contact Name
- 12. Handling Contact Images
- Example: Fetching Contact Image
Working with File System (expo-file-system)
- 1. Reading Files
- Example: Reading a Text File
- Example: Reading a Binary File
- 2. Writing Files
- Example: Writing Text to a File
- Example: Writing Binary Data to a File
- 3. Deleting Files
- Example: Delete a file
- Example: Delete a directory recursively
- 4. Downloading Files
- Example: Downloading a file
- Example: Download with progress tracking
- 5. Uploading Files
- Example: Upload a file to a server
- 6. Creating Directories
- 7. Reading Directory Contents
- Example: Reading Directory Contents
- Example: Reading File Content as String
- Example: Getting File Info
- 8. Getting File Info
- Example: Get file info
- 9. Moving Files
- Example: Moving a File
- 10. Copying Files
- Example: Copying a file
- Example: Copying a file with error handling
- 11. Using Document Directory
- Example: Reading a file from Document Directory
- Example: Writing to Document Directory
- 12. Using Cache Directory
- Example: Accessing the Cache Directory
Working with Local Storage (AsyncStorage)
- 1. Installing AsyncStorage
- Example: Install AsyncStorage
- 2. Storing String Data
- Example: Storing a String Value
- 3. Retrieving Data
- Example: Retrieving a Value
- Example: Retrieving All Keys
- 4. Removing Data
- Example: Removing a Key-Value Pair
- 5. Clearing All Data
- Example: Clear All Data
- 6. Getting All Keys
- Example: Getting All Keys
- 7. Storing Objects
- Example: Storing and Retrieving an Object
- 8. Using Batch Operations
- Example: Batch Set and Get Operations
- 9. Merging Data
- Example: Merging Data with AsyncStorage
- 10. Handling Storage Errors
- Example: Basic Error Handling with AsyncStorage
- 11. Removing Multiple Items
- Example: Removing Multiple Items
- 12. Flushing Pending Operations
- Example: Flushing Pending Get Requests
Working with Secure Storage (expo-secure-store)
- 1. Storing Secure Data
- Example: Storing a Token
- 2. Retrieving Secure Data
- Example: Retrieving Secure Data
- 3. Deleting Secure Data
- Example: Deleting Secure Data
- 4. Setting Storage Options
- Example: Setting Custom Keychain Service
- Example: Setting Shared Preferences Name
- 5. Configuring Keychain Access
- Example: Basic Keychain Configuration
- 6. Using Device Authentication
- Example: Secure Storage with Biometric Authentication
- 7. Checking Availability
- Example: Checking Secure Store Availability
- 8. Storing Credentials
- Example: Storing and Retrieving Credentials
- 9. Handling Storage Errors
- Example: Error Handling with Expo Secure Store
- 10. Using Biometric Protection
- Example: Setting up biometric protection
Working with SQLite (expo-sqlite)
- 1. Opening Database
- Example: Opening a Database
- 2. Executing Raw Queries
- Example: Executing a Raw Query
- Example: Inserting Data with Raw Query
- 3. Running Prepared Statements
- Example: Running Prepared Statements
- 4. Getting All Results
- Example: Fetching All Rows from a Query
- 5. Getting Single Row
- Example: Fetching a single user by ID
- 6. Using Transactions
- Example: Using Transactions
- 7. Creating Tables (CREATE TABLE)
- Example: Creating a Users Table
- 8. Inserting Data (INSERT INTO)
- Example: Inserting a Single Row
- Example: Inserting Multiple Rows
- 9. Updating Data (UPDATE)
- Example: Updating a User's Name
- Example: Updating Multiple Fields
- 10. Deleting Data (DELETE FROM)
- Example: Delete a User by ID
- 11. Closing Database
- Example: Closing Database
- 12. Using Foreign Keys
- Example: Creating Tables with Foreign Keys
Managing App State
- 1. Using Context API
- Example: Basic Context Usage
- 2. Creating Global State
- Example: Using React Context for Global State
- Example: Using Zustand for Global State
- State Management Options in Expo
- 3. Using useReducer Hook
- Example: Basic useReducer usage
- Example: useReducer with payload
- 4. Implementing Redux
- Example: Setting up Redux with Expo
- Redux Setup Steps
- 5. Creating Redux Store
- Example: Basic Redux Store Setup
- 6. Defining Actions and Reducers
- Example: Basic Action Definition
- Example: Action Creator Using Redux Toolkit
- Example: Reducer Definition
- 7. Using Redux Hooks
- 8. Implementing Redux Toolkit
- Example: Basic Store Setup
- Example: Creating a Slice
- Example: Async Action with createAsyncThunk
- Redux Toolkit Overview
- 9. Using Zustand
- Example: Basic Zustand Store Setup
- Example: Async Actions with Zustand
- Key Features of Zustand
- 10. Implementing MobX
- Example: Basic MobX Setup
- 11. Using React Query
- Example: Fetching and Caching Data
- Example: Mutating Data
- Key Features
- 12. Persisting State
- Example: Using AsyncStorage to persist user preferences
Managing App Lifecycle
- 1. Handling App State Changes
- Example: Listening to App State Changes
- 2. Using AppState Events
- Example: Listening to AppState Changes
- 3. Detecting App Launch
- Example: Using AppState to detect app launch
- Example: Using useAppState hook
- 4. Handling App Close
- Example: Detecting App Close
- 5. Using Splash Screen
- Example: Configuring Splash Screen in app.json
- Key Points
- 6. Hiding Splash Screen
- Example: Hiding Splash Screen
- 7. Preventing Auto Hide
- Example: Preventing Auto Hide in Android
- 8. Implementing Deep Link Handling
- Example: Handling Deep Links in Expo
- Deep Link Configuration
- 9. Managing Memory Warnings (iOS)
- Example: Handling Memory Warnings
- 10. Handling Background Fetch
- Example: Configure Background Fetch
Working with Network and API
- 1. Using Fetch API
- Example: Fetch GET request
- Example: Fetch POST request
- 2. Making GET Requests
- Example: Fetching Data from an API
- 3. Making POST Requests
- Example: Sending a POST Request with Expo
- 4. Sending Request Headers
- Example: Sending Custom Headers with Fetch
- 5. Handling JSON Response
- 6. Using Axios Library
- Example: Fetching Data with Axios
- Example: POST Request with Data
- 7. Implementing Interceptors
- Example: Request Interceptor
- Example: Response Interceptor
- 8. Handling Network Errors
- Best Practices for Network Error Handling
- 9. Detecting Network State
- Example: Check network status
- Example: Listen for network changes
- 10. Using WebSockets
- Example: Establishing a WebSocket Connection
- Example: Sending Data via WebSocket
- 11. Implementing GraphQL
- Example: Setting up a GraphQL client with Apollo
- 12. Caching API Requests
- Example: Using cacheTTL
Working with Network Connectivity
- 1. Checking Network Status
- Example: Check Network Status
- 2. Monitoring Network Changes
- Example: Listen for network status changes
- 3. Detecting Connection Type
- Example: Check Connection Type
- 4. Handling Offline Mode
- Example: Check Network Status
- Example: Handle Offline Mode
- 5. Implementing Retry Logic
- Example: Basic Retry Logic with Exponential Backoff
- Best Practices for Retry Logic
- 6. Using Network Information API
- Example: Check network type
- Example: Monitor connection changes
- 7. Checking Internet Reachability
- Example: Check Internet Reachability
- 8. Handling Connection Loss
- Example: Detecting and Responding to Connection Loss
- Best Practices for Handling Connection Loss
- 9. Queuing Offline Requests
- Example: Queuing Offline Requests
- 10. Syncing Data on Reconnection
- Example: Basic Data Sync on Network Reconnect
- Example: Sync with Retry Logic
- Syncing Data on Reconnection - Key Points
Working with WebView
- 1. Installing WebView
- Example: Install WebView
- Example: Configure Expo
- 2. Creating WebView Component
- Example: Basic WebView Component
- 3. Loading URLs
- Example: Loading a URL
- 4. Loading HTML Content
- Example: Loading Local HTML File
- 5. Handling Navigation
- Example: Basic WebView Navigation
- Example: Handling Back Navigation
- 6. Injecting JavaScript
- Example: Injecting JavaScript into WebView
- 7. Communicating with Web Page
- Example: Sending message from web to native
- Example: Receiving message in native app
- Example: Sending message from native to web
- 8. Handling Messages
- Example: Receiving and Sending Messages
- 9. Managing WebView State
- Example: Setting initial state in WebView
- Example: Updating WebView state with injectJavaScript
- State Management Best Practices
- 10. Configuring User Agent
- Example: Setting Custom User Agent
- Example: Using Application User Agent
- 11. Handling Loading States
- Example: Basic WebView with Loading Indicators
- 12. Enabling DOM Storage
- Example: Enable DOM Storage in WebView
Implementing Local Authentication
- 1. Using Local Authentication
- Example: Check if local authentication is available
- Example: Authenticate with biometrics
- 2. Checking Biometric Support
- Example: Check Biometric Support
- 3. Authenticating User
- Example: Basic Authentication Flow
- 4. Checking Enrolled Biometrics
- Example: Checking Enrolled Biometrics
- Example: Checking Specific Biometric Type
- 5. Setting Authentication Options
- Example: Configure Authentication Options
- 6. Handling Authentication Result
- Example: Handle Authentication Result
- 7. Using Face ID (iOS)
- Example: Enabling Face ID Authentication
- 8. Using Touch ID (iOS)
- Example: Enabling Touch ID Authentication
- Supported Platforms
- 9. Using Fingerprint (Android)
- Example: Enabling Fingerprint Authentication
- 10. Setting Fallback to Passcode
- Example: Configure fallback to passcode
- 11. Getting Biometric Types
- Example: Check Biometric Type
- 12. Handling Authentication Cancellation
- Example: Canceling Authentication Flow
- Best Practices for Cancellation Handling
Implementing OAuth and Social Login
- 1. Using Auth Session
- Example: Setting up AuthSession
- 2. Implementing OAuth Flow
- Example: Setting up Expo Auth with Google
- OAuth Flow Steps
- 3. Configuring Auth Request
- Example: Configure Auth Request
- 4. Using Auto Discovery
- Example: Auto Discovery Configuration
- 5. Using Apple Sign In
- Example: Configure Apple Sign In
- Apple Sign In Flow Summary
- 6. Implementing Google Sign In
- Example: Setting up Google Sign-In with Expo
- Google Sign-In Flow Summary
- 7. Using Facebook Login
- Example: Setting up Facebook Login
- Facebook Login Setup Steps
- 8. Opening Auth Browser
- Example: Opening Auth Browser
- 9. Storing Auth Tokens
- Example: Secure Storage with Expo SecureStore
- Best Practices for Token Storage
- 10. Handling Token Refresh
- Example: Refreshing Token with Expo Auth
- 11. Managing Session State
- Example: Storing Session State
- Example: Refreshing Session
- 12. Implementing Logout Flow
- Example: Logout with Expo Auth
Implementing Push Notifications (expo-notifications)
- 1. Requesting Notification Permissions
- Example: Requesting Notification Permissions
- 2. Getting Push Token
- Example: Request Push Token
- 3. Scheduling Local Notifications
- Example: Schedule a local notification after 5 seconds
- Example: Schedule a repeating daily notification
- 4. Handling Received Notifications
- Example: Handling Notification in App
- Key Points
- 5. Handling Notification Tap
- Example: Handling Notification Tap
- 6. Setting Notification Handler
- Example: Setting Notification Handler
- 7. Setting Badge Count
- Example: Setting Badge Count
- 8. Canceling Notifications
- Example: Canceling a Specific Notification
- Example: Cancel All Scheduled Notifications
- 9. Creating Android Channels
- Example: Creating a Custom Channel
- 10. Customizing Notification Sound
- Example: Setting Custom Sound
- 11. Using Rich Notifications
- Example: Rich Notification with Image
- 12. Grouping Notifications
- Example: Creating Grouped Notifications
Working with Background Tasks
- 1. Using Task Manager
- Example: Registering a Background Task
- 2. Defining Background Tasks
- Example: Define a background task
- 3. Registering Tasks
- Example: Basic Task Registration
- 4. Unregistering Tasks
- Example: Unregistering a Specific Task
- Example: Unregister All Tasks
- 5. Using Background Fetch
- Example: Configure Background Fetch
- 6. Implementing Location Tasks
- Example: Registering a Location Task
- 7. Using Geofencing
- Example: Setting up a Geofence
- 8. Handling Task Execution
- Example: Scheduling a Background Task
- 9. Checking Task Status
- Example: Checking Task Status
- 10. Managing Battery Optimization (Android)
- Example: Registering a Background Task
- 11. Configuring Minimum Interval
- Example: Setting Minimum Interval
- 12. Handling Task Errors
- Example: Catching Task Errors
Working with Sharing and Links
- 1. Sharing Content
- Example: Sharing Text
- Example: Sharing URL
- 2. Using Share Dialog
- Example: Sharing Text
- Example: Sharing a URL
- Example: Sharing an Image
- 3. Checking Sharing Availability
- Example: Check Sharing Availability
- 4. Sending SMS Messages
- Example: Sending SMS via Expo
- 5. Composing SMS
- Example: Compose SMS with Expo
- 6. Sending Email
- Example: Sending an Email
- 7. Composing Email
- Example: Compose Email
- 8. Making Phone Calls
- Example: Making a Phone Call
- 9. Opening External URLs
- Example: Opening an External URL
- 10. Handling Deep Links
- Example: Handling Deep Links
- Example: Opening Deep Links
- 11. Parsing URL Parameters
- Example: Extracting a Single Parameter
- Example: Extracting All Parameters
- 12. Creating App Links
- Example: Setting up a Deep Link
- Example: Handling Deep Links
Working with Clipboard and Documents
- 1. Setting Clipboard String
- 2. Getting Clipboard String
- 3. Setting Clipboard Image
- Example: Setting Clipboard Image
- 4. Getting Clipboard Image
- Example: Getting Clipboard Image
- 5. Checking Clipboard Content
- Example: Check Clipboard Content
- 6. Handling Clipboard Events
- Example: Listening to Clipboard Changes
- 7. Using Print API
- Example: Printing HTML Content
- Example: Printing with Custom Options
- 8. Printing HTML Content
- Example: Print HTML content using Expo
- 9. Printing to PDF
- Example: Exporting a Document to PDF
- 10. Using Document Picker
- Example: Pick a document
- 11. Picking Documents
- Example: Pick a PDF Document
- 12. Setting Document Filters
- Example: Configure Document Filters
Working with Barcode and QR Codes
- 1. Scanning Barcodes
- Example: Basic Barcode Scanner
- 2. Configuring Barcode Types
- Example: Scanning QR Code
- 3. Using expo-barcode-scanner
- Example: Scanning QR Codes
- 4. Handling Scanned Data
- Example: Processing Scanned Data
- 5. Generating QR Codes
- Example: Basic QR Code Generation
- Example: Custom Styled QR Code
- 6. Customizing QR Appearance
- Example: Customizing QR Code Appearance
- 7. Embedding Logos in QR
- Example: Embedding a Logo in QR Code
- 8. Scanning Multiple Barcodes
- Example: Scanning Multiple Barcodes
- 9. Using Barcode Overlay
- Example: Scanning Barcode with Overlay
- 10. Handling Invalid Scans
- Example: Basic Scan Error Handling
- Best Practices for Invalid Scan Handling
- 11. Setting Scan Area
- Example: Define a Custom Scan Area
- 12. Using Torch for Scanning
- Example: Enable Torch for Scanning
Implementing Internationalization (i18n)
- 1. Installing i18n Library
- Example: Installing i18next
- 2. Configuring Languages
- Example: Configuring supported locales in app.json
- 3. Creating Translation Files
- Example: en.json
- Example: es.json
- 4. Using Translation Hook
- Example: Basic usage of useTranslation hook
- Example: Accessing i18n instance
- 5. Switching Languages
- Example: Switching Language Programmatically
- 6. Formatting Dates
- Example: Formatting Dates in Different Locales
- Example: Custom Date Formatting
- 7. Formatting Numbers
- Example: Formatting Numbers in Different Locales
- Example: Custom Number Formatting
- 8. Using Device Locale
- Example: Detecting Device Locale
- 9. Handling RTL Languages
- Example: Setting RTL layout in Expo
- RTL Support in Expo
- 10. Using Pluralization
- Example: Pluralizing Items
- 11. Creating Translation Namespaces
- Example: Defining Translation Namespaces
- 12. Interpolating Values
- Example: Basic Interpolation
- Example: Nested Values
Implementing Accessibility
- 1. Using Accessibility Props
- Example: Using accessibilityLabel and accessibilityRole
- Example: Using accessibilityState for toggle buttons
- 2. Setting Accessibility Roles
- Example: Button Role
- Example: Slider Role
- 3. Using Accessibility Hints
- Example: Setting an Accessibility Hint
- 4. Managing Focus Order
- Example: Setting Focus Order
- 5. Announcing Changes
- Example: Using announcedText
- 6. Using Semantic Elements
- Example: Using Semantic Elements with Accessibility Roles
- 7. Supporting Screen Readers
- Example: Using accessibilityLabel
- Example: Using accessibilityRole
- Best Practices for Screen Reader Support
- 8. Setting Minimum Touch Target
- Example: Using hitSlop for Touch Targets
- 9. Using High Contrast Mode
- Example: Setting High Contrast Colors
- 10. Testing Accessibility
- Example: Using axe-core for accessibility testing
- Accessibility Testing Tools Comparison
- 11. Using Accessibility Scanner (Android)
- Example: Setting up Accessibility Scanner
- Key Features
- 12. Implementing Focus Management
- Example: Setting Focus Programmatically
- Focus Management Best Practices
Working with Web Support
- 1. Configuring Web Settings
- Example: Web Settings in app.json
- 2. Running on Web Platform
- Example: Running Expo on Web
- 3. Building for Web
- Example: Building for Web
- Web Build Configuration
- 4. Using Web-Specific Code
- Example: Conditional Web Code
- Example: Web-Only Component
- Web-Specific Considerations
- 5. Configuring Webpack
- Example: Basic Webpack Configuration
- 6. Setting Favicon
- Example: Configuring Favicon in app.json
- 7. Implementing PWA Features
- Example: Adding PWA Support to Expo App
- 8. Handling Responsive Design
- Example: Using Flexbox for Responsive Layout
- Example: Setting Max Width for Responsive Images
- 9. Optimizing Web Bundle
- Example: Tree-shaking configuration
- Example: Using Webpack config for optimization
- Optimization Tips
- 10. Deploying to Hosting
- Example: Deploying to Vercel
- 11. Using Web-Only Components
- 12. Handling Browser APIs
- Example: Using fetch in a Web Environment
Working with Environment Variables
- 1. Using .env Files
- Example: Loading environment variables in a React component
- 2. Configuring expo-constants
- Example: Using Environment Variables in Expo
- 3. Setting Build Variables
- Example: Using Public Variables in App
- Example: Setting Variables in .env File
- 4. Using Platform-Specific Variables
- Example: Setting Platform-Specific Variables in .env
- 5. Accessing Variables
- Example: Reading Public Environment Variables
- 6. Securing Sensitive Variables
- Example: Using Public Variables in Client Code
- Example: Using Secret Variables in Server Code
- Best Practices for Securing Variables
- 7. Using Different Environments
- Example: Setting up environment-specific variables
- 8. Setting Variables in CI/CD
- Example: Setting Environment Variables in GitHub Actions
- Best Practices for CI/CD Variables
- 9. Using Runtime Configuration
- Example: Setting Runtime Config in Environment
- 10. Implementing Feature Flags
- Example: Reading Feature Flags in Code
- Example: Using Feature Flags in Conditional Rendering
- 11. Validating Environment Variables
- Example: Setting up environment variables in Expo
- 12. Using Dynamic Configuration
- Example: Dynamic Configuration in Expo
Debugging Expo Applications
- 1. Using React DevTools
- Example: Inspecting Components
- 2. Using Chrome DevTools
- Example: Enable Chrome DevTools for Expo
- Key Features of Chrome DevTools in Expo
- 3. Using Flipper
- Example: Setting up Flipper with Expo
- 4. Inspecting Network Requests
- Example: Using Expo DevTools to Inspect Network Requests
- Network Inspection Tips
- 5. Viewing Console Logs
- Example: Logging in Expo
- Steps to View Logs in Expo Go
- Console Log Levels Comparison
- 6. Setting Breakpoints
- Example: Setting Breakpoint in Code
- 7. Using React Native Debugger
- Example: Connecting to React Native Debugger
- Example: Starting Debugger
- 8. Debugging Native Code
- Example: Enabling Native Debugging in Expo
- Native Debugging Workflow
- 9. Using LogBox
- Example: Basic LogBox Usage
- 10. Inspecting Component Hierarchy
- Example: Using React DevTools
- 11. Profiling Performance
- Example: Using React Native Debugger
- 12. Using Source Maps
- Example: Enabling Source Maps in Expo Config
Testing Expo Applications
- 1. Setting Up Jest
- Example: Install Jest and Related Dependencies
- Example: Basic Jest Configuration
- 2. Writing Component Tests
- Example: Testing a Simple Component
- Example: Testing with Mocks
- 3. Testing Custom Hooks
- Example: Testing Custom Hook
- Testing Custom Hooks Summary
- 4. Mocking Dependencies
- Example: Mocking a Network Request
- 5. Testing Navigation
- Example: Testing Navigation with React Navigation
- 6. Using Detox
- Example: Setting up Detox in an Expo Project
- Example: Basic Detox Test
- Key Points
- 7. Configuring Detox
- Example: Basic Detox Configuration
- Key Configuration Options
- 8. Writing E2E Tests
- Example: Detox Setup
- Example: Basic Detox Test
- 9. Running Tests
- Example: Running Jest tests in Expo
- 10. Generating Coverage Reports
- Example: Setting up Jest with coverage
- Example: Running coverage with Expo
- Steps to generate coverage reports
- 11. Testing Async Operations
- 12. Snapshot Testing
- Example: Snapshot Test
Handling Errors and Logging
- 1. Using Global Error Handler
- Example: Implementing Global Error Handler
- 2. Logging Errors
- Example: Using Sentry for Error Logging
- 3. Implementing Error Boundaries
- Example: Basic Error Boundary Setup
- Key Points
- 4. Handling Async Errors
- Example: Setting up global error handler
- 5. Using Sentry Integration
- Example: Setting up Sentry with Expo
- Example: Capturing an exception
- Example: Logging a message
- Sentry Integration Summary
- 6. Configuring Sentry
- Example: Setting up Sentry with Expo
- Key Points for Sentry Configuration
- 7. Capturing Exceptions
- Example: Reporting Unhandled Errors
- 8. Adding Breadcrumbs
- Example: Adding breadcrumbs to an Expo app
- 9. Customizing Error Messages
- Example: Custom Error Class
- 10. Reporting Native Crashes
- Example: Configure crash reporting in app.json
- 11. Using Analytics
- Example: Setting up analytics in Expo
- 12. Tracking Custom Events
- Example: Tracking a Custom Event
Optimizing Performance
- 1. Using Hermes Engine
- Example: Enabling Hermes in Expo Config
- 2. Enabling Performance Monitoring
- Example: Setting up Expo Performance Monitoring
- Performance Monitoring Configuration
- 3. Optimizing Images
- Example: Using Image with Blur Effect
- Image Optimization Tips
- 4. Using FlatList
- Example: Basic FlatList Usage
- Example: FlatList with onEndReached
- 5. Implementing Memoization
- Best Practices for Memoization
- 6. Avoiding Inline Functions
- Example: Avoiding Inline Functions
- 7. Optimizing Rerenders
- Best Practices
- 8. Using Native Driver
- Example: Using Native Driver with Reanimated
- 9. Lazy Loading Components
- 10. Reducing Bundle Size
- Example: Using Dynamic Imports
- Example: Asset Optimization
- Key Tips for Reducing Bundle Size
- 11. Using Production Build
- Example: Building for Production
- Example: Building for iOS Production
- 12. Profiling with React Profiler
- Example: Using React Profiler in Expo
Implementing Security Best Practices
- 1. Storing Sensitive Data
- Example: Using SecureStore to save and retrieve a token
- 2. Validating User Input
- Example: Validating Email Input
- Example: Validating Numeric Input
- 3. Using HTTPS Connections
- Example: Enforcing HTTPS in Expo
- 4. Implementing Certificate Pinning
- Example: Setting up Certificate Pinning with expo-crypto
- 5. Securing API Keys
- Example: Environment Variables in Expo
- Best Practices for API Key Management
- 6. Using OAuth 2.0
- Example: Setting up OAuth 2.0 with Expo
- 7. Implementing Biometric Auth
- Example: Check biometric support and authenticate
- 8. Preventing Screen Capture
- Example: Disabling Screen Capture
- 9. Using Code Obfuscation
- Example: Integrating javascript-obfuscator
- 10. Implementing App Attestation
- Example: Enabling App Attestation
- 11. Handling Deep Link Security
- Example: Configuring Deep Link Schemes
- 12. Encrypting Local Data
- Example: Using SecureStore to Store and Retrieve Data
- Best Practices for Local Data Encryption
Implementing In-App Purchases
- 1. Installing IAP Library
- 2. Connecting to Store
- Example: Connecting to Apple Store
- 3. Getting Products
- Example: Fetching Product Info
- 4. Purchasing Products
- Example: Purchase a Product
- 5. Restoring Purchases
- Example: Restore Purchases
- 6. Handling Purchase Updates
- Example: Listen for purchase updates
- 7. Validating Receipts
- Example: Validating Receipt on iOS
- 8. Managing Subscriptions
- Example: Check Subscription Status
- Subscription Management Workflow
- 9. Handling Purchase Errors
- Example: Error Handling in Purchase Flow
- 10. Testing Purchases
- Example: Setting up purchase testing in Expo
- Testing Purchase Flow
- 11. Finishing Transactions
- Example: Finish a Transaction
- 12. Handling Pending Purchases
- Example: Handling Pending Purchases
Implementing App Rating and Review
- 1. Using Store Review
- Example: Requesting a Review
- 2. Requesting Review
- Example: Requesting a Review
- 3. Checking Review Availability
- Example: Check Review Availability
- 4. Checking Store Availability
- Example: Check Store Availability
- 5. Opening Store Page
- Example: Opening Store Page
- 6. Implementing Review Prompts
- Example: Configuring Review Prompts
- 7. Tracking Review Requests
- Example: Requesting a Review
- 8. Handling Review Limitations
- Example: Handling Review Limitations in Expo
- Key Limitations Summary
- 9. Using Smart Review Triggers
- Example: Configuring Smart Review Triggers
- 10. Redirecting to Store Listing
- Example: Redirecting to Store Review Page
Working with Development Client
- 1. Installing Dev Client
- Example: Installing Dev Client
- 2. Building Dev Client
- Example: Configure dev client in app.json
- Example: Build dev client with EAS
- Build Process Overview
- 3. Starting Dev Server
- Example: Starting Dev Server
- Example: Starting Dev Server with Tunnel
- Example: Stopping Dev Server
- 4. Using Dev Menu Extensions
- Example: Registering a Dev Menu Extension
- Key Points
- 5. Adding Custom Menu Items
- Example: Adding a Custom Debug Menu Item
- 6. Debugging with Dev Client
- Example: Enable Remote Debugging
- Example: Logging to Dev Client Console
- Debugging Tips
- 7. Switching Environments
- Example: Environment Configuration
- Example: Switching Environments in Code
- 8. Loading Updates in Dev Client
- Example: Configure Updates
- Workflow: Loading Updates
- 9. Using Local Development
- Example: Starting Local Development Server
- Example: Starting with Tunnel
- 10. Managing Multiple Dev Clients
- Example: Configure multiple dev clients
- Workflow: Setting up multiple dev clients
- 11. Using Dev Client Plugins
- Example: Registering a JavaScript Plugin
- 12. Configuring Dev Client Settings
- Example: devClient configuration in app.json
Working with Custom Native Code
- 1. Creating Config Plugins
- Example: Basic Config Plugin
- Example: Conditional Plugin
- Plugin Types
- 2. Using Expo Modules API
- Example: Creating a Custom Module
- Key Points
- 3. Running Prebuild
- Example: Running Prebuild
- 4. Modifying Native Files
- Example: Adding a Permission to AndroidManifest.xml
- Example: Adding a Capability to Info.plist
- 5. Creating Native Modules
- Example: Basic iOS Native Module
- Example: Basic Android Native Module
- 6. Using Expo Module Config
- Example: Basic Expo Module Config
- 7. Implementing Native Views
- Example: Native View Implementation
- 8. Bridging Native Methods
- Example: Bridging a Native Method
- 9. Using Continuous Native Generation
- Example: Enabling Continuous Native Generation
- Key Benefits of CNG
- 10. Managing Native Dependencies
- Example: Using expo-camera
- 11. Updating Native Projects
- Example: Updating Expo SDK
- Example: Rebuilding Native Projects
- 12. Creating Config Plugin Mods
- Example: Basic Config Plugin
- Example: Adding Permissions to AndroidManifest.xml
Configuring EAS Build (eas.json)
- 1. Creating EAS Configuration
- Example: eas.json structure
- 2. Defining Build Profiles
- Example: eas.json build profile configuration
- 3. Setting Distribution Mode
- Example: Setting Distribution Mode in eas.json
- 4. Configuring Android Build
- Example: eas.json configuration for Android
- 5. Configuring iOS Build
- Example: eas.json iOS build configuration
- 6. Setting Build Environment Variables
- Example: Setting Environment Variables in eas.json
- 7. Using Credentials Source
- Example: Setting credentialsSource to local
- Example: Setting credentialsSource to managed
- 8. Setting Build Type
- Example: Setting Build Type in eas.json
- 9. Configuring App Extensions
- Example: Configuring App Extensions
- 10. Setting Resource Class
- Example: Setting Resource Class
- 11. Using Custom Build Config
- Example: Custom EAS Build Configuration
- 12. Configuring Build Hooks
- Example: Setting up build hooks in eas.json
Building with EAS
- 1. Installing EAS CLI
- Example: Verify Installation
- 2. Logging In
- Example: EAS CLI Login
- 3. Configuring Project
- Example: Basic project configuration
- 4. Building for Android
- Example: Building for Android
- 5. Building for iOS
- Example: Building for iOS Release
- Example: Building for iOS Simulator
- 6. Building for All Platforms
- Example: Building for iOS
- Example: Building for Android
- Example: Building for Web
- 7. Using Build Profiles
- Example: Configuring Build Profiles
- 8. Building Locally
- Example: Building for iOS
- Example: Building for Android
- 9. Checking Build Status
- Example: Check EAS Build Status
- 10. Downloading Builds
- Example: Downloading a Managed Build
- Example: Downloading a Bare Build
- 11. Inspecting Build
- Example: Build Log Inspection
- 12. Managing Credentials
- Example: Setting up Android Credentials
- Example: Setting up iOS Credentials
Implementing Over-the-Air Updates (EAS Update)
- 1. Configuring EAS Update
- Example: eas.json configuration
- 2. Creating Updates
- Example: Creating an update with a message
- 3. Creating Update Branch
- Example: Create a new update branch
- 4. Setting Update Message
- Example: Setting Update Message
- 5. Publishing to Channel
- Example: Publishing to a Channel
- 6. Using Runtime Version
- Example: Setting Runtime Version in app.json
- 7. Implementing Update Hooks
- Example: Implementing shouldUpdate Hook
- Example: Implementing onUpdate Hook
- Example: Implementing onError Hook
- 8. Checking for Updates
- Example: Checking for Updates
- Example: Simple Update Check
- 9. Fetching Updates
- Example: Fetching Updates
- 10. Reloading App
- Example: Reloading App
- 11. Rolling Back Updates
- Example: Rollback to a specific update
- 12. Viewing Update History
- Example: Fetching Update History via EAS CLI
- Example: Fetching Update History via EAS REST API
Submitting to App Stores (EAS Submit)
- 1. Submitting to Google Play
- Example: Submit to Google Play
- 2. Submitting to App Store
- Example: Submitting to App Store
- 3. Configuring Submit Profiles
- Example: Basic Submit Profile Configuration
- Android Configuration
- iOS Configuration
- Android Listings Configuration
- iOS Listings Configuration
- 4. Using Latest Build
- Example: Submitting Latest Build
- 5. Providing Build ID
- Example: Providing Build ID in EAS Submit
- 6. Configuring Release Track (Android)
- Example: Setting Release Track
- 7. Setting Release Status
- Example: Setting Release Status
- 8. Using App Store Connect API Key
- Example: Configuring EAS Submit with App Store Connect API Key
- 9. Using Google Service Account
- Example: EAS Submit Configuration
- 10. Automating Submission
- Example: EAS Submit Configuration
- Workflow: Automating EAS Submit
- 11. Handling Submission Errors
- Example: Error handling in EAS Submit configuration
- Workflow: Resolving EAS Submit Failures
- 12. Managing App Metadata
- Example: app.json configuration
Configuring CI/CD Pipelines
- 1. Setting Up GitHub Actions
- Example: Basic GitHub Actions Workflow
- 2. Configuring EAS Build in CI
- Example: EAS Build Configuration
- 3. Running Tests in CI
- Example: Setting up test command in CI
- 4. Building on Commit
- Example: Building on Commit with GitHub Actions
- 5. Using GitHub Secrets
- Example: Setting up GitHub Actions with Expo
- 6. Implementing Code Signing
- Example: Expo Code Signing Configuration
- Workflow: Setting Up Code Signing for Expo
- 7. Automating Store Submission
- Example: EAS Build and Submit Configuration
- 8. Deploying OTA Updates
- Example: Configure OTA updates with EAS
- OTA Update Process
- 9. Using Fastlane Integration
- Example: Fastlane Configuration for Expo
- 10. Implementing Beta Distribution
- Example: Configure EAS Build for Beta
- Key Steps for Beta Distribution
- 11. Monitoring Build Status
- Example: Expo Build Status Endpoint
- 12. Caching Dependencies
- Example: Setting up dependency caching in GitHub Actions
Implementing App Tracking Transparency
- 1. Installing Tracking Module
- Example: Install AppTrackingTransparency
- 2. Requesting Tracking Permission
- Example: Requesting Permission
- 3. Getting Tracking Status
- Example: Check tracking authorization status
- 4. Handling Permission Response
- Example: Check and handle permission response
- 5. Configuring Info.plist
- Example: Info.plist Configuration
- 6. Implementing Permission Flow
- Example: Requesting App Tracking Transparency Permission
- 7. Handling Denied Permission
- Example: Check and handle denied permission
- 8. Using IDFA
- Example: Requesting IDFA
- 9. Checking ATT Availability
- Example: Checking ATT Availability
- 10. Implementing Privacy Labels
- Example: Privacy Labels Configuration