Learning React Native · 2nd Edition by Eisenman, Bonnie -- Read -- Imperial Library of Trantor

Index

Preface

Prerequisites Conventions Used in This Book Using Code Examples O’Reilly Safari How to Contact Us Resources Acknowledgments

1. What Is React Native?

Advantages of React Native

Developer Experience Code Reuse and Knowledge Sharing

Risks and Drawbacks Summary

2. Working with React Native

How Does React Native Work? Rendering Lifecycle Creating Components in React Native

Working with Views Using JSX Styling Native Components

Host Platform APIs Summary

3. Building Your First Application

Setting Up Your Environment Developer Setup: Create React Native App

Creating Your First Application with create-react-native-app Previewing Your App on iOS or Android

Developer Setup: The Traditional Approach

Creating Your First Application with react-native Running Your App on iOS Running Your App on Android

Exploring the Sample Code Building a Weather App

Handling User Input Displaying Data Fetching Data from the Web Adding a Background Image Putting It All Together

Summary

4. Components for Mobile

Analogies Between HTML Elements and Native Components

The <Text> Component The <Image> Component

Working with Touch and Gestures

Creating Basic Interactions with <Button> Using the <TouchableHighlight> Component Using the PanResponder Class

Working with Lists

Using the Basic <FlatList> Component Updating the <FlatList> Contents Integrating Real Data Working with <SectionList>

Navigation Other Organizational Components Summary

5. Styles

Declaring and Manipulating Styles

Using Inline Styles Styling with Objects Using StyleSheet.create Concatenating Styles

Organization and Inheritance

Exporting Style Objects Passing Styles as Props Reusing and Sharing Styles

Positioning and Designing Layouts

Using Layouts with Flexbox Using Absolute Positioning Putting It Together

Summary

6. Platform APIs

Using Geolocation

Reading the User’s Location Handling Permissions Testing Geolocation in Emulated Devices Watching the User’s Location Working Around Limitations Updating the Weather Application

Accessing the User’s Images and Camera

Interacting with the CameraRoll Module Requesting Images with GetPhotoParams Rendering an Image from the Camera Roll Uploading an Image to a Server

Storing Persistent Data with AsyncStorage The SmarterWeather Application

The <WeatherProject> Component The <Forecast> Component The <Button> Component The <LocationButton> Component The <PhotoBackdrop> Component

Summary

7. Modules and Native Code

Installing JavaScript Libraries with npm Installing Third-Party Components with Native Code

Using the Video Component

Objective-C Native Modules

Writing an Objective-C Native Module for iOS Exploring react-native-video for iOS

Java Native Modules

Writing a Java Native Module for Android Exploring react-native-video for Java

Cross-Platform Native Modules Summary

8. Platform-Specific Code

iOS- or Android-Only Components Components with Platform-Specific Implementations

Using Platform-Specific File Extensions Using the Platform Module

When to Use Platform-Specific Components

9. Debugging and Developer Tools

JavaScript Debugging Practices, Translated

Activating the Developer Options Debugging with console.log Using the JavaScript Debugger Working with the React Developer Tools

React Native Debugging Tools

Using Inspect Element Interpreting the Red Screen of Death

Debugging Beyond JavaScript

Common Development Environment Issues Common Xcode Problems Common Android Problems The React Native Packager Issues Deploying to an iOS Device Simulator Behavior

Testing Your Code

Type Checking with Flow Unit Testing with Jest Snapshot Testing with Jest

When You’re Stuck Summary

10. Navigation and Structure in Larger Applications

The Flashcard Application Project Structure

Application Screens Reusable Components Styles Data Models

Using React-Navigation

Creating a StackNavigator Using navigation.navigate to Transition Between Screens Configuring the Header with navigationOptions Implementing the Rest

Summary

11. State Management in Larger Applications

Using Redux to Manage State Actions Reducers Connecting Redux Persisting Data with AsyncStorage Summary and Homework

Conclusion A. Modern JavaScript Syntax

let and const Importing Modules Destructuring Function Shorthand Fat-Arrow Functions Default Parameters String Interpolation Working with Promises

B. Deploying Your Application

Check Your Application Assets and Specify Target OS Versions and Devices Create a Release Build Complete Your Paperwork Beta Test Your Application Create a Listing Wait for Review Release

C. Working with Expo Applications

Ejecting from Expo

Index

← Prev
Back
Next →

← Prev
Back
Next →