book

Learning React Native

by Bonnie Eisenman

December 2015

Beginner

200 pages

5h 48m

English

O'Reilly Media, Inc.

Read now

Unlock full access

PrerequisitesConventions Used in This BookUsing Code ExamplesSafari® Books OnlineHow to Contact UsResourcesAcknowledgments
Advantages of React NativeDeveloper ExperienceCode Reuse and Knowledge SharingRisks and DrawbacksSummary
How Does React Native Work?Rendering LifecycleCreating Components in React NativeWorking with ViewsUsing JSXStyling Native ComponentsHost Platform APIsSummary
Setting Up Your EnvironmentInstalling React NativeiOS DependenciesAndroid DependenciesCreating a New ApplicationRunning a React Native Application for iOSUploading to Your iOS DeviceRunning a React Native Application for AndroidRecap: Creating and Running ProjectsExploring the Sample CodeAttaching a Component to the ViewImports in React NativeThe FirstProject ComponentBuilding a Weather AppHandling User InputDisplaying DataAdding a Background ImageFetching Data from the WebPutting It TogetherSummary
Analogies Between HTML Elements and Native ComponentsThe Text ComponentThe Image ComponentWorking with Touch and GesturesUsing TouchableHighlightThe GestureResponder SystemPanResponderWorking with Organizational ComponentsUsing ListViewUsing NavigatorsOther Organizational ComponentsPlatform-Specific ComponentsiOS- or Android-Only ComponentsComponents with Platform-Specific VersionsWhen to Use Platform-Specific ComponentsSummary
Declaring and Manipulating StylesInline StylesStyling with ObjectsUsing Stylesheet.CreateStyle ConcatenationOrganization and InheritanceExporting Style ObjectsPassing Styles as PropsReusing and Sharing StylesPositioning and Designing LayoutsLayouts with FlexboxUsing Absolute PositioningPutting It TogetherSummary
Using GeolocationGetting the User’s LocationHandling PermissionsTesting Geolocation In the iOS SimulatorWatching the User’s LocationLimitationsUpdating the Weather ApplicationAccessing the User’s Images and CameraThe CameraRoll ModuleRequesting Images with GetPhotoParamsRendering an Image from the Camera RollDisplaying a List of PhotosUploading an Image to a ServerStoring Persistent Data with AsyncStoreOther Storage OptionsThe SmarterWeather ApplicationThe WeatherProject ComponentThe Forecast ComponentThe Button ComponentThe LocationButton ComponentThe PhotoBackdrop ComponentSummary
Installing JavaScript Libraries with npmNative Modules for iOSIncluding a Third-Party ComponentUsing the Video ComponentAnatomy of an Objective-C Native ModuleImplementation of RCTVideoNative Modules for AndroidInstalling a Third-Party ComponentAnatomy of a Java Native ModuleAndroid Implementation of LinearGradientCross-Platform Native ModulesSummary
JavaScript Debugging Practices, TranslatedActivating the Developer OptionsDebugging with console.logUsing the JavaScript DebuggerWorking with the React Developer ToolsReact Native Debugging ToolsUsing Inspect ElementThe Red Screen of DeathDebugging Beyond JavaScriptCommon Development Environment IssuesCommon Xcode ProblemsCommon Android ProblemsThe React Native PackagerIssues Deploying to an iOS DeviceSimulator BehaviorTesting Your CodeType-Checking with FlowTesting with JestWhen You’re StuckSummary
The Flashcard ApplicationProject StructureComponent HierarchyModeling and Storing DataData Flow Architecture: Reflux and FluxUsing Reflux in ZebretoPersistence, AsyncStorage, and the Reflux StoresUsing the NavigatorA Look at Third-Party DependenciesResponsive Design and Font SizesSummary and Homework

Preparing Your Xcode ProjectSelecting Supported Devices and Target iOS VersionLaunch Screen ImagesAdding Your Application IconSetting Your Bundle NameUpdating AppDelegate.mSet Schema for ReleaseUploading Your ApplicationGetting Your Paperwork in OrderCreating an ArchiveCreating an App in iTunes ConnectBeta Testing with TestFlightSubmitting the Application for ReviewSummary
Setting Application IconBuilding the APK for ReleaseDistributing via Email or Other LinksSubmitting Your Application to the Play StoreBeta Testing via the Play StorePlay Store ListingRequired Assets for the Store ListingPublishing Your ApplicationSummary
DestructuringImporting ModulesFunction ShorthandFat Arrow FunctionsString Interpolation
Creating a New ProjectRunning on iOSTaking Screenshots on iOSRunning on AndroidTaking Screenshots on AndroidRunning the React Native Packager

Overview

Get a practical introduction to React Native, the JavaScript framework for writing and deploying fully featured mobile apps that look and feel native. With this hands-on guide, you’ll learn how to build applications that target iOS, Android, and other mobile platforms instead of browsers. You’ll also discover how to access platform features such as the camera, user location, and local storage. With code examples and step-by-step instructions, author Bonnie Eisenman shows web developers and frontend engineers how to build and style interfaces, use mobile components, and debug and deploy apps.