React Native Cookbook : Step-By-step Recipes for Solving Common React Native Development Problems, 2nd Edition.

Improve your React Native mobile development skills and transition from web to mobile development with this solution-packed guide Key Features Learn strategies and techniques to face React Native mobile development challenges head-on Explore ways to use iOS and Android for React Native development to maximize code reuse and cohesion Build engaging user experiences with React Native Book Description If you are a developer looking to create mobile applications with maximized code reusability and minimized cost, React Native is what you need. With this practical guide, you'll be able to build attractive UIs, tackle common problems in mobile development, and achieve improved performance in mobile environments. This book starts by covering the common techniques for React Native customization and helps you set up your development platforms. Over the course of the book, you'll work through a wide variety of recipes that help you create, style, and animate your apps with built-in React Native and custom third-party components. You'll also develop real-world browser-based authentication, build a fully functional audio player, and integrate Google Maps in your apps. This book will help you explore different strategies for working with data, including leveraging the popular Redux library and optimizing your app's dataflow. You'll also learn how to write native device functionality for new and existing React Native projects and how app deployment works. By the end of this book, you'll be equipped with tips and tricks to write efficient code and have the skills to build full iOS and Android applications using React Native. What you will learn Build UI features and components using React Native Create advanced animations for UI components Develop universal apps that run on phones and tablets Leverage Redux to manage application flow and data Expose both custom native UI components and application logic to React Native Employ open source third-party plugins to create React Native apps Who this book is for If you're a JavaScript developer looking for a practical guide for developing feature-rich mobile apps using React Native, this book is for you. Though not necessary, some experience of working with React will help you understand the React Native concepts covered in this book easily. While React Native development can be done on a Windows machine, certain aspects, such as running your apps on iOS devices and in the iOS simulator, or editing native code with Xcode, can only be done with a Mac. Cover Title Page Copyright and Credits About Packt Contributors Table of Contents Preface Chapter 1: Setting Up Your Environment Technical requirements Installing dependencies Installing Xcode Installing Android Studio How to do it... There's more... Installing Node.js Installing Expo Installing Watchman Initializing your first app Running your app in a simulator/emulator Running your app on an iOS simulator There's more... Running your app on a real device Running your app on an iPhone or Android Summary Further reading Chapter 2: Creating a Simple React Native App Adding styles to elements Getting ready How to do it... How it works... There's more... Using images to mimic a video player Getting ready How to do it... How it works... Creating a toggle button Getting ready How to do it... How it works... There's more... Displaying a list of items Getting ready How to do it... How it works... There's more... Using flexbox to create a layout Getting ready How to do it... How it works... There's more... See also Setting up and using navigation Getting ready How to do it... How it works... See also Chapter 3: Implementing Complex User Interfaces - Part I Creating a reusable button with theme support Getting ready How to do it... How it works... Building a complex layout for tablets using flexbox Getting ready How to do it... There's more... See also Including custom fonts Getting ready How to do it... How it works... See also Using font icons Getting ready How to do it... How it works... See also Chapter 4: Implementing Complex User Interfaces - Part II Dealing with universal applications Getting ready How to do it... How it works... See also Detecting orientation changes Getting ready How to do it... There's more... Using a WebView to embed external websites Getting ready How to do it... How it works... Linking to websites and other applications Getting ready How to do it... How it works... See also Creating a form component Getting ready How to do it... How it works... Chapter 5: Implementing Complex User Interfaces - Part III Introduction Creating a map app Getting ready How to do it... How it works... There's more... Creating an audio player Getting ready How to do it... How it works... There's more... Creating an image carousel Getting ready How to do it... How it works... There's more... Adding push notifications to your app Getting ready How to do it... How it works... There's more... Implementing browser-based authentication Getting ready How to do it... How it works... See also Chapter 6: Adding Basic Animations to Your App Introduction Creating simple animations Getting ready How to do it... How it works... Running multiple animations Getting ready How to do it... How it works... Creating animated notifications Getting ready How to do it... How it works... There's more... Expanding and collapsing containers Getting ready How to do it... How it works... See also Creating a button with a loading animation Getting ready How to do it... How it works... Conclusion Chapter 7: Adding Advanced Animations to Your App Introduction Removing items from a list component Getting ready How to do it... How it works... See also Creating a Facebook reactions widget Getting ready How to do it... How it works... Displaying images in fullscreen Getting ready How to do it... How it works... See also Chapter 8: Working with Application Logic and Data Introduction Storing and retrieving data locally Getting ready How to do it... How it works... See also Retrieving data from a remote API Getting ready How to do it... How it works... Sending data to a remote API Getting ready How to do it... How it works... Establishing real-time communication with WebSockets Getting ready How to do it... How it works... Integrating persistent database functionality with Realm Getting ready How to do it... How it works... Masking the application upon network connection loss Getting ready How to do it... How it works... Synchronizing locally persisted data with a remote API Getting ready How to do it... How it works... Logging in with Facebook Getting ready How to do it... How it works... Chapter 9: Implementing Redux Introduction Installing Redux and preparing our project Getting started How to do it... How it works... Defining actions Getting ready How to do it... How it works... There's more... Defining reducers Getting ready How to do it... How it works... Setting up the Redux store How to do it... How it works... Communicating with a remote API Getting ready How to do it... How it works... Connecting the store to the view Getting ready How to do it... How it works... Storing offline content using Redux Getting ready How to do it... How it works... Chapter 10: App Workflow and Third-Party Plugins How this chapter works React Native development tools Expo React Native CLI CocoaPods Planning your app and choosing your workflow How to do it... Expo CLI setup Using NativeBase for cross-platform UI components Getting ready Using a pure React Native app (React Native CLI) Using an Expo app How to do it... How it works... Using glamorous-native for styling UI components Getting ready How to do it... How it works... Using react-native-spinkit for adding animated loading indicators Getting started How to do it... How it works... There's more... Using react-native-side-menu for adding side navigation menus Getting ready How to do it... How it works... Using react-native-modalbox for adding modals Getting ready How to do it... How it works... Chapter 11: Adding Native Functionality - Part I Introduction Exposing custom iOS modules Getting ready How to do it... How it works... See also Rendering custom iOS view components How to do it... How it works... Exposing custom Android modules Getting ready How to do it... How it works... Rendering custom Android view components How to do it... How it works... Chapter 12: Adding Native Functionality - Part II Introduction Reacting to changes in application state How to do it... How it works... Copying and pasting content Getting ready How to do it... How it works... Authenticating via touch ID or fingerprint sensor Getting ready How to do it... How it works... Hiding application content when multitasking Getting ready How to do it... How it works... Background processing on iOS Getting ready How to do it... How it works... Background processing on Android Getting ready How to do it... How it works... Playing audio files on iOS Getting ready How to do it... How it works... Playing audio files on Android Getting ready How to do it... Chapter 13: Integration with Native Applications Introduction Combining a React Native app and a Native iOS app Getting ready How to do it... How it works... See also Communicating from an iOS app to React Native Getting ready How to do it... Communicating from React Native to an iOS app container Getting ready How to do it... How it works... Handle being invoked by an external iOS app Getting ready How to do it... How it works... Combining a React Native app and a native Android app Getting ready How to do it... How it works... Communicating from an Android app to React Native Getting ready How to do it... How it works... Communicating from React Native to an Android app container Getting ready How to do it... How it works... Handle being invoked by an external Android app How to do it... How it works... Chapter 14: Deploying Your App Introduction Deploying development builds to an iOS device Getting ready How to do it... How it works... Deploying development builds to an Android device Getting ready How to do it... There's more... How it works... Deploying test builds to HockeyApp Getting ready How to do it... How it works... Deploying iOS test builds to TestFlight Getting ready How to do it... How it works... Deploying production builds to the Apple App Store Getting ready How to do it... How it works... Deploying production builds to Google Play Store Getting ready How to do it... How it works... Deploying Over-The-Air updates Getting ready How to do it... How it works... Optimizing React Native app size Getting ready How to do it... How it works... Chapter 15: Optimizing the Performance of Your App Introduction Optimizing our JavaScript code Getting ready How to do it... How it works... Optimizing the performance of custom UI components Getting ready How to do it... How it works... See also Keeping animations running at 60 FPS Getting ready How to do it... How it works... There's more... Getting the most out of ListView Getting ready How to do it... How it works... See also Boosting the performance of our app How to do it... How it works... Optimizing the performance of native iOS modules Getting ready How to do it... How it works... Optimizing the performance of native Android modules Getting ready How to do it... How it works... Optimizing the performance of native iOS UI components Getting ready How to do it... How it works... Optimizing the performance of native Android UI components Getting ready How to do it... How it works... Other Books You May Enjoy Leave a review - let other readers know what you think Index Take your React Native application development skill to next level with this solution guide Key Features Second edition of the bestselling React Native Cookbook Leverage the best of iOS and Android for React Native development while maximizing code reuse and cohesion Work with the latest APIs and implement 3rd party services in your mobile apps effectively Get acquainted with ReactVR and create 3D scenes in WebVR Book Description If you are a developer looking to create mobile applications with maximized code reuse and cost saving, then React Native is to your rescue. With this hands-on solution guide by your side, you can build amazing UIs, tackle the mobile development related issues, and build strong performance for mobile environments. The book starts helping you with the common techniques for React Native customization and set up of different development platforms. The book follows a top-down approach beginning with building rich user interfaces. These UIs will be created with both built-in and custom components that you will create, style, and animate. You will learn the techniques to work with the latest APIs and add third-party modules, plugins, and services to your apps. Along the way, you will use ReactVR to make simple 3D scenes in WebVR that can be run in a web browser. You will then learn about different strategies for working with data, including leveraging the popular Redux library and optimizing the performance of the application. Then, you will explore native device functionality further. You will then implement common methods for debugging and testing your applications and then deploy them to the desired platforms. What you will learn Build simple and complex UIs using React Native Create advanced animations for UI components Build universal apps that run on phones and tablets Use ReactVR to create 3D scenes in WebVR Leverage Redux to manage application flow and data Expose both custom native UI components and application logic to React Native Leverage open source third-party plugins to efficiently create React Native apps Deploy your React Native application to the Google Play and Apple App Store Add automated testing to your React Native application Who This Book Is For If youre a JavaScript developer who needs a hands-on solutions guide for developing mobile applications with React Native, then this book is for you. About the Author Dan Ward is a full stack engineer that has been specializing in front end development. In addition, he's the chief editor of our recently formed community publication for gitconnected. His interests include React/React Native, Virtual Reality, and CSS techniques/best practices. His writing skills are top notch, and he has a BA in English Literature. If you are a developer looking to create mobile applications with maximized code reusability and minimized cost, then React Native is here to help. With this practical guide, you will be able to build attractive UIs, tackle common mobile development-related issues, and achieve improved performance in mobile environments. This book starts with common techniques for React Native customization and helps you set up your development platforms. Over the course of the book, a wide variety of step-by-step recipes are designed with both built-in React Native and custom third-party components that you will create, style, and animate. You will create real-world browser-based authentication, build a fully functional audio player, and integrate with Google maps. You will also explore different strategies for working with data, including leveraging the popular Redux library and optimizing your app's dataflow. You will then get an introduction to writing native device functionality for new and already existing native projects. Finally, you will learn how app deployment works, and tips and tricks for writing performant code. By the end of the book, you'll have gained enough knowledge to build full iOS and Android applications using React Native H4What you will learn/h4 ul liBuild UI features and components using React Native /li liCreate advanced animations for UI components /li liDevelop universal apps that run on phones and tablets /li liLeverage Redux to manage application flow and data /li liExpose both custom native UI components and application logic to React Native /li liEmploy open source third-party plugins to create React Native apps/li/ul h4Who this book is for/h4 If you're a JavaScript developer looking for a practical guide for developing feature-rich mobile apps using React Native, this book is for you. Though not necessary, some experience of working with React will help you understand the React Native concepts covered in this book easily. While React Native development can be done on a Windows machine, certain aspects, such as running your apps on iOS devices and in the iOS simulator, or editing native code with Xcode, can only be done with a Mac BImprove your React Native mobile development skills and transition from web to mobile development with this solution-packed guide/b h4Key Features/h4 ul liLearn strategies and techniques to face React Native mobile development challenges head-on /li liExplore ways to use iOS and Android for React Native development to maximize code reuse and cohesion /li liBuild engaging user experiences with React Native /li /ul h4Book Description/h4 If you are a developer looking to create mobile applications with maximized code reusability and minimized cost, React Native is what you need. With this practical guide, you'll be able to build attractive UIs, tackle common problems in mobile development, and achieve improved performance in mobile environments. This book starts by covering the common techniques for React Native customization and helps you set up your development platforms. React Native is perfect for creating mobile applications with maximized code reusability and cost saving. With this practical solutions guide by your side, you can build amazing UIs, tackle mobile development-related issues, and build high-performance apps for mobile environments