Browse Library
Sign In Start Free Trial
Close icon Search icon
Account
Browse Library Advanced Search Sign In Start Free Trial

Add to playlist

Create a Playlist

Modal Close icon
You need to login to use this feature.
  • Book Overview & Buying React and React Native
  • Table Of Contents Toc
  • Feedback & Rating feedback
React and React Native

React and React Native

By : Mikhail Sakhniuk, Roy Derks, Adam Boduch
4.3 (10)
Buy this Book
close
close
React and React Native

React and React Native

4.3 (10)
By: Mikhail Sakhniuk, Roy Derks, Adam Boduch
Buy this Book

Overview of this book

Welcome to your big-picture guide to the React ecosystem. If you’re new to React and looking to become a professional React developer, this book is for you. This updated fifth edition reflects the current state of React, including React framework coverage as well as TypeScript. Part 1 introduces you to React. You’ll discover JSX syntax, hooks, functional components, and event handling, learn techniques to fetch data from a server, and tackle the tricky problem of state management. Once you’re comfortable with writing React in JavaScript, you’ll pick up TypeScript development in later chapters. Part 2 transitions you into React Native for mobile development. React Native goes hand-in-hand with React. With your React knowledge behind you, you’ll appreciate where and how React Native differs as you write shared components for Android and iOS apps. You’ll learn how to build responsive layouts, use animations, and implement geolocation. By the end of this book, you’ll have a big-picture view of React and React Native and be able to build applications with both.
Table of Contents (33 chapters)
close
close
close
Preface
Preface
Who this book is for
What this book covers
To get the most out of this book
Get in touch
1
Part I: React
Part I: React
Free Chapter
2
Why React?
chevron up
Why React?
What is React?
What’s new in React?
Setting up a new React project
Using web bundlers
Summary
Join us on Discord!
3
Rendering with JSX
Rendering with JSX
Technical requirements
Your first JSX content
Rendering HTML
Creating your own JSX elements
Using JavaScript expressions
Building fragments of JSX
Summary
4
Understanding React Components and Hooks
Understanding React Components and Hooks
Technical requirements
Introduction to React components
What are component properties?
What is component state?
React Hooks
Performing initialization and cleanup actions
Sharing data using context Hooks
Memoization with Hooks
Summary
5
Event Handling in the React Way
Event Handling in the React Way
Technical requirements
Declaring event handlers
Declaring inline event handlers
Binding handlers to elements
Using synthetic event objects
Understanding event pooling
Summary
6
Crafting Reusable Components
Crafting Reusable Components
Technical requirements
Reusable HTML elements
The diffculty with monolithic components
Refactoring component structures
Render props
Rendering component trees
Summary
7
Type-Checking and Validation with TypeScript
Type-Checking and Validation with TypeScript
Technical requirements
Knowing what to expect
Introduction to TypeScript
Using TypeScript in React
Summary
8
Handling Navigation with Routes
Handling Navigation with Routes
Technical requirements
Declaring routes
Handling route parameters
Using link components
Summary
9
Code Splitting Using Lazy Components and Suspense
Code Splitting Using Lazy Components and Suspense
Technical requirements
Using the lazy API
Using the Suspense component
Avoiding lazy components
Exploring lazy pages and routes
Summary
10
User Interface Framework Components
User Interface Framework Components
Technical requirements
Layout and organization
Using navigation components
Collecting user input
Working with styles and themes
Summary
11
High-Performance State Updates
High-Performance State Updates
Technical requirements
Batching state updates
Prioritizing state updates
Handling asynchronous state updates
Summary
12
Fetching Data from a Server
Fetching Data from a Server
Technical requirements
Working with remote data
Using the Fetch API
Using Axios
Using TanStack Query
Using GraphQL
Summary
13
State Management in React
State Management in React
What is global state?
React Context API and useReducer
Redux
MobX
Summary
14
Server-Side Rendering
Server-Side Rendering
Technical requirements
Working on the server
Using Next.js
React Server Components
Summary
15
Unit Testing in React
Unit Testing in React
Technical requirements
Testing in general
Unit testing
Testing ReactJS
Summary
Join us on Discord!
16
Part II: React Native
Part II: React Native
17
Why React Native?
Why React Native?
Technical requirements
What is React Native?
React and JSX are familiar
The mobile browser experiences
Android and iOS: different yet the same
The case for mobile web apps
Summary
18
React Native under the Hood
React Native under the Hood
Exploring the React Native architecture
React Native current architecture
Explaining JS and Native modules
Exploring React Native components and APIs
Summary
19
Kick-Starting React Native Projects
Kick-Starting React Native Projects
Technical requirements
Exploring React Native CLI tools
Installing and using the Expo command-line tool
Viewing your app on your phone
Viewing your app on Expo Snack
Summary
20
Building Responsive Layouts with Flexbox
Building Responsive Layouts with Flexbox
Technical requirements
Introducing Flexbox
Introducing React Native styles
Using the Styled Components library
Building Flexbox layouts
Summary
21
Navigating Between Screens
Navigating Between Screens
Technical requirements
The basics of navigation
Route parameters
The navigation header
Tab and drawer navigation
File-based navigation
Summary
22
Rendering Item Lists
Rendering Item Lists
Technical requirements
Rendering data collections
Sorting and filtering lists
Fetching list data
Lazy list loading
Implementing pull to refresh
Summary
23
Geolocation and Maps
Geolocation and Maps
Technical requirements
Using the Geolocation API
Rendering the map
Annotating points of interest
Summary
24
Collecting User Input
Collecting User Input
Technical requirements
Collecting text input
Selecting from a list of options
Toggling between on and off
Collecting date/time input
Summary
25
Responding to User Gestures
Responding to User Gestures
Technical requirements
Scrolling with your fingers
Giving touch feedback
Using Swipeable and Cancellable components
Summary
26
Showing Progress
Showing Progress
Technical requirements
Understanding progress and usability
Indicating progress
Exploring navigation indicators
Measuring progress
Step progress
27
Displaying Modal Screens
Displaying Modal Screens
Technical requirements
Terminology definitions
Getting user confirmation
Error confirmation
Passive notifications
Activity modals
Summary
28
Using Animations
Using Animations
Technical requirements
Using React Native Reanimated
The Animated API
Animating layout components
Animating component styles
Summary
29
Controlling Image Display
Controlling Image Display
Technical requirements
Loading images
Resizing images
Lazy image loading
Rendering icons
Summary
30
Going Offline
Going Offline
Technical requirements
Detecting the state of the network
Storing application data
Synchronizing application data
Summary
Join us on Discord!
31
Other Books You May Enjoy
Other Books You May Enjoy
32
Index
Index

Getting the most out of this book – get to know your free benefits

Unlock exclusive free benefits that come with your purchase, thoughtfully crafted to supercharge your learning journey and help you learn without limits.

Here’s a quick overview of what you get with this book:

Next-gen reader

Figure 1.1: Illustration of the next-gen Packt Reader’s features

Our web-based reader, designed to help you learn effectively, comes with the following features:

A black background with a black square AI-generated content may be incorrect. Multi-device progress sync: Learn from any device with seamless progress sync.

A black background with a black square AI-generated content may be incorrect. Highlighting and notetaking: Turn your reading into lasting knowledge.

A black background with a black square AI-generated content may be incorrect. Bookmarking: Revisit your most important learnings anytime.

A black background with a black square AI-generated content may be incorrect. Dark mode: Focus with minimal eye strain by switching to dark or sepia mode.

Interactive AI assistant (beta)

Figure 1.2: Illustration of Packt’s AI assistant

Our interactive AI assistant has been trained on the content of this book, so it can help you out if you encounter any issues. It comes with the following features:

A black background with a black square AI-generated content may be incorrect. Summarize it: Summarize key sections or an entire chapter.

A black background with a black square AI-generated content may be incorrect. AI code explainers: In the next-gen Packt Reader, click the Explain button above each code block for AI-powered code explanations.

Note: The AI assistant is part of next-gen Packt Reader and is still in beta.

DRM-free PDF or ePub version

Figure 1.3: Free PDF and ePub

Learn without limits with the following perks included with your purchase:

: Learn from anywhere with a DRM-free PDF copy of this book.

: Use your favorite e-reader to learn using a DRM-free ePub version of this book.

Unlock this book’s exclusive benefits now

Take a moment to get the most out of your purchase and enjoy the complete learning experience.

https://www.packtpub.com/unlock/9781805127307

Note: Have your purchase invoice ready before you begin.
End of Section 2
Next Section
bookmark search playlist font-size

Change the font size

margin-width

Change margin width

day-mode

Change background colour

Close icon Search
Country selected
Close icon Your notes and bookmarks

Delete Bookmark

Modal Close icon
Are you sure you want to delete it?
Cancel
Yes, Delete

Confirmation

Modal Close icon
claim successful
Order Page Read Now

Buy this book with your credits?

Modal Close icon
Are you sure you want to buy this book with one of your credits?
Close
YES, BUY