Book Overview & Buying
Table Of Contents

React Native Blueprints

By : Martinez

3.8 (4)

Buy this Book

React Native Blueprints

3.8 (4)

By: Martinez

Buy this Book

Overview of this book

Considering the success of the React framework, Facebook recently introduced a new mobile development framework called React Native. With React Native's game-changing approach to hybrid mobile development, you can build native mobile applications that are much more powerful, interactive, and faster by using JavaScript This project-based guide takes you through eight projects to help you gain a sound understanding of the framework and helps you build mobile apps with native user experience. Starting with a simple standalone groceries list app, you will progressively move on to building advanced apps by adding connectivity with external APIs, using native features, such as the camera or microphone, in the mobile device, integrating with state management libraries such as Redux or MobX, or leveraging React Native’s performance by building a full-featured game. This book covers the entire feature set of React Native, starting from the simplest (layout or navigation libraries) to the most advanced (integration with native code) features. By the end of this book, you’ll be able to build professional Android and iOS applications using React Native.

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Free Chapter

Shopping List

Overview

Setting up our project

Setting up the folder structure

Adding a Navigation component

Styling our app with NativeBase

Building the ShoppingList screen

Building the AddProduct screen

Installing and distributing the app

Summary

RSS Reader

Overview

Setting up the folder structure

Managing our state with MobX

Setting up the store

Defining actions

Creating our app's entry point

Building the FeedsList screen

Building the AddFeed screen

Building the FeedDetail screen

Building the EntryDetail screen

Summary

Car Booking App

Overview

Setting up the folder structure

Running the app in the simulator

Creating our app's entry point

LocationSearch

LocationPin

ClassSelection

ConfirmationModal

Summary

Image Sharing App

Overview

Setting up the folder structure

Redux

ImagesList

Gallery

Header

ActivityIndicator

Camera

MyImages

ImageGrid

Actions

Reducers

API

Summary

Guitar Tuner

Overview

Setting up the folder structure

Writing the native module

index.ios.js

Tuner

Strings

Adding an icon

Adding a launch screen

Disabling the landscape mode

Summary

Messaging App

Overview

Firebase

Setting up the folder structure

Users store

Chats store

Push notifications using Firebase

Chats

ListItem

Chat

Profile

Summary

Game

Overview

Sprites

Setting up the folder structure

GameContainer

Actions

Reducer

The sprites module

Constants

Parrot

RockUp and RockDown

Ground

Score

Start

GameOver

StartAgain

Summary

E-Commerce App

Overview

Setting up the folder structure

Linting and code formatting

Indexes and main files

Reducers

API

ProductList

ProductDetail

MyCart

Payment

PaymentConfirmation

MyProfile

LoginOrRegister

Sales

Summary

Car Booking App

In the previous chapters, we set the focus on feature development rather than in building a user interface by delegating the styling of our apps to UI libraries such as native-base. In this chapter, we are going to do the opposite and spend more time in building custom UI components and screens.

The app we will build is a car booking app in which the user can select the location in which he/she wants to be picked up and the type of car she wants to book for the ride. Since we want to focus on the user interface, our app will only have two screens and a little state management is needed. Instead, we will dive deeper into aspects such as animations, component's layout, using custom fonts, or displaying external images.

The app will be available for iOS and Android devices, and since all the user interface will be custom made, 100% of the code...

Tech Concepts

Programming languages

Tech Tools