Index

As this ebook edition doesn't have fixed pagination, the page numbers below are hyperlinked for reference only, based on the printed edition of this book.

Symbols

.mock property

reference link 213

.native file ending

working with 184

.web file ending

working with 184

A

A/B testing

about 228

example 229

use case 228

access restrictions

libraries, providing with 191, 192

Android

JSC and Hermes, comparing on 154

animations

architectural challenge 110, 111

creating, with react-native-animatable 117

Apollo/URQL GraphQL client

about 106

reference link 106

App 185

app architecture

setting up, for large-scale enterprise projects 175

Appium 220

application programming interface (API) 38, 232

arrays

destructuring 22

arrow functions 24, 25

async/await syntax 29, 30

asynchronous calls, in JavaScript

about 26

async/await syntax 29, 30

callback libraries, patching 30

callbacks, exploring 26

implementing 27

promises 28, 29

AsyncStorage

about 70

reference link 71

working with 70, 71

automated testing 210, 211

AWS Amplify

about 107

reference link 107

AWS Device Farm 221, 222

Axio 106

B

Babel

URL 16

boilerplate solutions

Ignite CLI, working with 164, 165

React Native Boilerplate by thecodingmachine, using 162

React Native Starter Kit by mcnamee, using 163

React Native TypeScript template, using 162

using 161

Bridge 10

Button component

working with 136

C

callback libraries

patching 30

callbacks

about 26

exploring 26

Callstack 155, 187

chief executive officer (CEO) 226

CI pipelines, for development process

creating 198-205

class components

about 47, 48

working with 48-50

clone

creating, for web with react-native-web 178, 179

code

reusing, with libraries 186, 187

code coverage 210

code formatters

code quality, improving 158

CodeGen 57

CodePush

reference link 227

CodeSandbox, class component basic

reference link 49

CodeSandbox, function components

reference link 51

collaborative development workflow

Code Management 196

creating 196-198

Single Point of Information 196

Stability Monitoring 197

Workflow Automation 197

compiler 150

componentDidMount() method 49

componentDidUpdate(prevProps) method 50

component tests

about 210

working with 213-216

componentWillUnmount() method 50

continuous delivery (CD)

about 193

using, for build and release 206-208

continuous integration (CI) 193

CSS modules

used, for styling React Native app 67, 68

D

deepclone 20

destructuring, in JavaScript

about 22

array 22

objects 22, 23

spread operator, using 23

Detox

end-to-end testing, writing with 217-219

device pool 221

E

ECMAScript 2015 16

ECMAScript (ES) 16

effects

using, with useEffect hook 52, 53

end-to-end testing

role 216, 217

writing, with Detox 217-219

end-to-end tests 210 216

ES6 16

event loop 27

example application, React Native

containers, using for page styling 46, 47

content, displaying based on state 41-43

reusable components, using 44

root view, creating 40, 41

services, using to fetch data 44, 45

structuring 37-39

working 34

example project structure

adapting 176-178

explicit binding 24

Expo

about 12, 13

reference link 12

expo-secure-store

reference link 74

Expo Updates

reference link 227

F

Fabric 11, 56

Fastlane

about 206

reference link 206

File System

using, with React Native 73

Flow

about 31, 32

URL 32

full-screen animations 109

function components

about 47, 48

working with 50, 51

G

Gatsby 186

generators 164

gesture responder system

touches, handling 141-143

working with 139

global application states

managing 82

predictable state pattern, using 85

properties, passing 82, 83

providers/containers, using 83, 84

state/action/reducer pattern, using 85, 86

global state management solutions

React Context, working with 88

working with 88

Zustand, working with 98-100

H

Hermes 151

Hermes engine

about 151-153

benefits 152

higher-order component (HOC) 98

hooks

about 47, 48

reference link 54

working with 50, 51

Husky tool

reference link 205

I

identifier (ID) 43

Ignite CLI

advantages 165

trade-offs 165

working with 164

immer.js library

about 99

reference link 99

implicit binding 24

integrated development environment (IDE) 35

integration/delivery workflow automation

process 194, 196

integration tests 210

internal Animated API

about 112

advanced options 115-117

cons 117

example 112, 113

interpolate function 114

native driver, using 113

pros 117

interpolation 69

iOS

JSC and Hermes, comparing on 155

J

JavaScript

asynchronous calls 26

destructuring 22

exploring, for React Native development 17

platforms, connecting to 54, 55

this keyword 23

JavaScript cloning solutions

comparing 21

JavaScriptCore

using 150

JavaScript engines 149, 150

JavaScript Interface (JSI) 56, 231

JavaScript (JS) 111, 188

JavaScript Object Notation (JSON) 34, 102

JavaScript-only library

creating 188-190

JavaScript XML (JSX) 5, 43

JSC, and Hermes

comparing, on Android 154

comparing, on iOS 155

jsfiddle

URL 17

JSON.parse feature 20

JSON.stringify feature 20

JS thread, and worklet context

connecting between 124

just-in-time (JIT) compilation 149

L

large-scale enterprise projects

app architecture, setting up 175

libraries

backend connection, simplifying 186

consistent design, ensuring 186

functionality, providing 186

maintaining, with react-native-builder-bob 187, 188

patching 37

providing, with access restrictions 191, 192

publishing, with react-native-builder-bob 187, 188

responsibilities, defining 186

used, for reusing code 186, 187

writing, with react-native-builder-bob 187, 188

lifecycle methods

working with 48-50

linters

bugs, avoiding 159, 160

code quality, improving 158

local component state

versus global application state 87, 88

local storage solutions

using, in React Native app 69

lodash

URL 21

Lottie animations

about 127

combining, with React Native Animated API 129, 130

cons 132

creating 131

example 128, 129

finding 131

pros 131

using 127

Lottie files

URL 131

M

Material Design 166

message queue 27

Metro 37

MMKV

about 71

working with, in React Native 71

mobile apps, metrics

about 153, 154

memory utilization 153

size 153

time to interaction (TTI) 153

mocking 211

modern JavaScript

about 16

exploring 16, 17

working 17

monorepo

multiple packages 185, 186

reference link 186

mounting 42

N

NativeBase

about 167

features 167

reference link 167

working with 167, 168

native libraries 190, 191

native module / native view 188

React Native Architecture 56, 57

NextJS 186

non-sensitive data

AsyncStorage, working with 70, 71

File System, using with React Native 73

MMKV, working with in React Native 71

storing 70

npm

URL 190, 191

O

Object.assign 20

object-oriented programming (OOP) 48

objects

assigning 17-19

clone, creating 19, 20

destructuring 22, 23

passing 17-19

real deepclone 21

on-screen animations 109

P

packages

importing, from repository 191

paid npmjs.com plan

using 191

PanResponder

using 144

pods 36

predictable state pattern

using 85

Pressable component

working with 136-138

prettier

about 160

advantages 161

used, for enforcing code style 160, 161

profiler 150

Promise.all()

reference link 29

promises 28, 29

prop 7, 8

properties

passing, best practices 47

prop-types

reference link 47

R

React

about 4

basics 5

components 6, 7

exploring 4

prop 7, 8

state 8

URL 4

React Context

context, working with 91-97

limitations 97

plain providers and consumers, working with 88-91

React hooks, working with 91-97

React Native

about 8, 9, 157, 230

advantages 11

architecture 56, 57

architecture change 231

basics 9-11

community 232

connection principles 102

integration tests, working with 211-213

rearchitecture 11

security risks 102, 103

Skia 231, 232

Storybook, using 168-170

TypeScript and React 232

unit tests, working with 211-213

used, for deploying to multiple platforms 178

working, on example application 34

react-native-animatable

cons 120

custom animations, working with 119, 120

example 118, 119

native driver, using 119

pros 120

used, for creating animations 117

React Native Animated API

Lottie animations, combining with 129, 130

React Native app

inline styles, using 65

local storage solutions, using 69

navigation 74

non-sensitive data, storing 70

platforms, navigating 75

sensitive data, storing 74

SQLite, working with 72, 73

styled-components 68, 69

StyleSheets, using 66, 67

styling 62, 64

styling, best practices 62

styling solution, selecting 64

styling, with CSS modules 67, 68

React Native Boilerplate, by thecodingmachine

advantages 163

reference link 163

trade-offs 163

using, in boilerplate solutions 162

react-native-builder-bob

used, for maintaining libraries 187, 188

used, for publishing libraries 187, 188

used, for writing libraries 187, 188

React Native code

running, as React app in browser 183, 184

React Native development

JavaScript, exploring 17

React Native documentation

reference link 213

React Native example project

about 35, 37

android folder 35

iOS folder 36

node_modules folder 36, 37

React Native Firebase

about 107

documentation link 107

react-native-fs

reference link 73

React Native Gesture Handler

about 144, 146

advantages 146

react-native-keychain

reference link 74

react-native-mmkv

reference link 71

react-native-mmkv-storage

reference link 72

React Native Navigation

reference link 75

React Native Paper

features 166

reference link 166

working with 166

React Native project

configuring, to work for web 180-182

React Native project, tips

about 225

A/B testing 228, 229

coding options 229

processes, defining 226

release planning 226, 227

stability monitoring tools 228

TypeScript, using 229

react-native-quick-sqlite

reference link 73

react-native-sensitive-info

reference link 74

react-native-sqlite-storage

reference link 73

React Native Starter Kit by mcnamee

advantages 163

reference link 164

trade-offs 164

using, in boilerplate solutions 163

React Native TypeScript template

advantages 162

trade-offs 162

using, in boilerplate solutions 162

react-native-v8

reference link 151

react-native-vector-icons

reference link 80

react-native-web

installing 179

used, for creating clone for web 178, 179

React Navigation

reference link 76

reference link, for TypeScript 80

working with 76-80

react-router/native

reference link 75

Reanimated 2

about 120, 127

architecture 122

cons 127

example 121, 122

functions 125, 126

hooks 125, 126

JS thread and worklet context, connection 124

pros 127

reference link 126

worklets, working with 123, 124

Redux

reference link 101

working with 101

remote backends

built-in Fetch API, working with 104-106

connecting to 102

data fetching solutions 106, 107

responder

becoming 140

S

Scalable Vector Graphics (SVG) 55

ScrollView

working with 138, 139

sensitive data

storing 74

shallow clone 20

Shared Values

about 124

reference link 125

using 124

shouldComponentUpdate(nextProps, nextState) method 50

Skia 231

snapshot 214

snapshot testing 214

Snyk

reference link 195

software-as-a-service (SaaS) 228

software development kits (SDKs) 228

SonarQube

reference link 195

spread operator

about 20

using, in destructuring 23

SQLite

working with 72, 73

stack navigator 75

state 8

state/action/reducer pattern

using 85, 86

stateless function components

working, with useState hook 51, 52

Storybook

about 168

reference link 170

using, for React Native 168-170

styled-components

about 68, 69

reference link 69

StyleSheets

advantages and disadvantages 66

switch navigator 75

T

tab navigator 75

test flakiness 211

this keyword, in JavaScript

about 23

arrow functions 24, 25

explicit binding 24

implicit binding 24

time to market (TTM) 229

Touchable components

working with 134, 135

Turbo modules 56, 188

two-dimensional (2D) graphics 230

typed JavaScript

Flow 31, 32

TypeScript 32

using 31

type safety

about 158

code quality, improving 158

dynamic typing 158

ensuring, with TypeScript or Flow 158

IDE, enhancing with code completion 159

TypeScript

about 32, 229

URL 32

TypeScript compiler (tsc) 34

TypeScript or Flow

used, for ensuring type safety 158

U

UI Libraries

about 165

features 165

finding 165

NativeBase, working with 167

React Native Paper, working with 166

using 165

unit tests 210

unmounting 42

useCallback hook

used, for improving performance 53, 54

useEffect hook

effects, using with 52, 53

useMemo hook

used, for improving performance 53, 54

user gestures

responding, with built-in components 134

user interface (UI) 38, 226

user taps

recording, with components 134

useSharedValue

reference link 126

useState hook

used, for working with stateless function components 51, 52

V

V8

using 150

W

webpack

installing 179, 180

workflow automation 206-208

worklets

about 122

reference link 124

working with 123, 124

workspaces

reference link 185

Y

Yoga

about 54

URL 10

Z

Zustand

working with 98-100