Book Image

React Native - Building Mobile Apps with JavaScript

By : Vladimir Novick
Book Image

React Native - Building Mobile Apps with JavaScript

By: Vladimir Novick

Overview of this book

<p>The emergence of React Native has made creating mobile apps in JavaScript easier for developers. This book introduces you to the React Native framework and the mobile apps development process. It starts with how React Native fits into the world of hybrid apps, and why it’s a popular framework. You’ll learn how React Native works under the hood--compiling JavaScript to Native code to bridge JavaScript and native apps. Also, you’ll learn how to write React Native components and use the ReactJS way of structuring your app. Understand how to use the industry standard Redux architecture as well as MobX--a newly emerging approach for state management--making your apps more robust and scalable.</p> <p>The mobile native world can be intimidating, with lots of platform-specific APIs. In this book, you’ll learn about the most important APIs with help of the real-world examples. You’ll also learn about the community packages that can help speed up your development. The book explains how to use these packages with JavaScript code, include native modules in your application, and write the modules yourself. Throughout the book, you will see examples of WhatsApp, Instagram, and YouTube apps and learn how to recreate them. You’ll also learn debugging and testing techniques, authentication, dealing with real data, and much more.</p> <p>At the end we will walk through design to production process of Twitter app clone and will explain application release process to App Store and Play Store</p>

Related Content you might be interested in

Current Title:

Small book image
React Native - Building Mobile Apps with JavaScript
Vladimir Novick
Aug, 2017 | 434 pages
Small book image
Mastering React Native
Jacob Friedmann | Eric Masiello
Jan, 2017 | 496 pages
Small book image
React Native Cookbook.
Daniel Ward
Jan, 2019 | 592 pages
Small book image
React Native Blueprints
Emilio Rodriguez Martinez
Nov, 2017 | 346 pages
Table of Contents (13 chapters)
Preface
Preface
What this book covers
What you need for this book
Who this book is for
Conventions
Reader feedback
Customer support
Free Chapter
1
Understanding Why React Native is the Future of Mobile Apps
Understanding Why React Native is the Future of Mobile Apps
What is React Native?
How the React Native bridge from JavaScript to Native world works?
The benefits of React Native
Summary
2
Working with React Native
Working with React Native
Setting up an environment for developing iOS and Android apps
Creating your application
Introduction to JSX and how it's used in React Native
Stateful versus presentational components
React lifecycle methods
Structuring React Native apps and their resemblance to HTML
The folder structure
Summary
3
Getting Familiar with React Native Components
Getting Familiar with React Native Components
Platform-independent components
Basic components
Basic user interaction
Getting feedback from your application
Dealing with lists of data
Embedding web content
Handling user input
Platform-dependent components
DatePickerIOS
Progress bars
Additional controls
Platform-specific navigation
Navigation in React Native
Summary
4
Debugging and Testing React Native
Debugging and Testing React Native
Debugging your React Native apps
Remote debugging
Logging
Inspecting React Native components
Testing
Introduction to the Jest testing framework
Snapshot testing your React Native components
Working with functions
Mocking modules
Summary
5
Bringing the Power of Flexbox to the Native World
Bringing the Power of Flexbox to the Native World
Flexbox styling concepts and techniques
Laying out our app
Best practices and techniques for styling your React Native applications
Summary
6
Animating React Native Components
Animating React Native Components
Understanding animations
How animation works
Using Animated API for complex animations
Animated functions
Combining several animations to create complex sequences
Summary
7
Authenticating Your App and Fetching Data
Authenticating Your App and Fetching Data
Getting familiar with Firebase
Managing permissions
Writing data to Firebase
Fetching data in React Native
Setting up authentication at Firebase
Creating functional Login and Sign Up screens
Authenticating via social providers
Summary
8
Implementing a Flux Architecture with Redux or MobX
Implementing a Flux Architecture with Redux or MobX
What is Flux architecture?
Redux concepts and usage
Connecting Redux to your app
Using redux-thunk for async actions
Mobx- a functional reactive Flux implementation
Connecting MobX to our app
Summary
9
Understanding Supported APIs and How to Use Them
Understanding Supported APIs and How to Use Them
Linking libraries and APIs with native code
Getting familiar with a list of native APIs covered by React Native
Retrieving and saving photos with CameraRoll API
Getting your exact location with GeoLocation API
Learning about persistence with AsyncStorage API
Responding to user gestures with PanResponder
Summary
10
Working with External Modules in React Native
Working with External Modules in React Native
Diving deeper into react-navigation
The best open source packages to use
Writing your own Native modules
Integrating React Native with the existing apps
Summary
11
Understanding Application Development Workflow by Recreating Twitter
Understanding Application Development Workflow by Recreating Twitter
Defining your application requirements
Defining your application architecture using a desired design
Setting up functional navigation and a wireframe for your application
Mock data and style application screens including animations
Bringing Redux or MobX to your application and moving data mocks to a centralized state
Using the Twitter API to work with real data
Summary
12
Deploying Your App to App Store or Google Play
Deploying Your App to App Store or Google Play
Deploying iOS apps and how it's done in React Native
Deploying Android apps and how it's done in React Native
Introducing fastlane - automate your deployment workflow
Get to know Microsoft CodePush and integrate it with your application
Summary

Platform-specific navigation

Navigation differences between iOS and Android are much more than the different look and feel of components. The subsequent components have to be platform-specific, because they are unique to their platform. You would use TabBarIOS to create bottom tabs for your iOS apps, whereas your navigation on Android would be done using DrawerLayoutAndroid, ToolbarAndroid, and ViewPagerAndroid. Each one of them is unique and the use case for them are as follows:

Previous Section
End of Section 13
Next Section