React Projects: Build 12 real-world applications from scratch using React, React Native, and React 360 9781789954937, 1789954932

Build cross-platform applications of varying complexity for the web, mobile, and VR devices using React tooling Key Feat

2,985 487 23MB

English Pages 474 [465] Year 2019

Report DMCA / Copyright

DOWNLOAD FILE

React Projects: Build 12 real-world applications from scratch using React, React Native, and React 360
 9781789954937, 1789954932

Table of contents :
Cover
Title Page
Copyright and Credits
About Packt
Contributors
Table of Contents
Preface
Chapter 1: Creating a Movie List Application in React
Project overview
Getting started
Creating a movie list application
Setting up a project
Setting up webpack
Configuring webpack to work with React
Rendering a React project
Creating a development server
Structuring a project
Creating new components
Retrieving data
Adding styling
Adding ESLint
Summary
Further reading
Chapter 2: Creating a Progressive Web Application with Reusable React Components
Project overview
Getting started
GitHub portfolio application
Creating a PWA with Create React App
Installing Create React App
Creating a PWA
Serving the PWA
Building reusable React components
Structuring our application
Reusing components in React
Styling in React with styled-components
Summary
Further reading
Chapter 3: Build a Dynamic Project Management Board with React and Suspense
Project overview
Getting started
Creating a project management board application
Handling the data flow
Loading and displaying the data
Getting started with HOC
Creating HOC
Using the HOC
Making the board dynamic
Summary
Further reading
Chapter 4: Build a SSR-Based Community Feed Using React Router
Project overview
Getting started
Community feed application
Declarative routing
Routes with parameters
Handling query strings
Enable SSR
Creating an express server with react-router
Adding head tags using React Helmet
Summary
Further reading
Chapter 5: Build a Personal Shopping List Application Using Context API and Hooks
Project overview
Getting started
Personal shopping list
Using the context API for state management
Creating Context
Nesting Context
Mutating context with Hooks
Using life cycles in functional components
Updating the Provider with a Flux pattern
Mutating data in the Provider
Creating a global Context
Summary
Further reading
Chapter 6: Build an Application Exploring TDD Using Jest and Enzyme
Project overview
Getting started
Hotel review application
Unit testing with Jest
Creating a unit test
Rendering a React component for testing
Testing components with assertions
Using Enzyme for testing React
Shallow rendering with Enzyme
Testing assertions with shallow rendering
Integration testing with Enzyme
Summary
Further reading
Chapter 7: Build a Full Stack E-Commerce Application with React Native and GraphQL
Project overview
Getting started
Getting started with the initial React application
Getting started with the GraphQL server
Building a full stack e-commerce application with React, Apollo, and GraphQL
Adding GraphQL to a React application
Sending GraphQL queries with React
Handling mutations with Apollo Client
Managing local state
Using authentication with React and GraphQL
React Router and authentication
Receiving JWT from the GraphQL server
Passing JWT to the GraphQL server
Summary
Further reading
Chapter 8: Build a House Listing Application with React Native and Expo
Project overview
Getting started
Building a house listing application with React Native and Expo 
Create a React Native project
Setting up routing in React Native
Creating routes with React Navigation
Transitioning between screens
Using multiple navigators together
Using life cycles in React Native
Styling React Native applications
Differences in styling for iOS and Android
Summary
Further reading
Chapter 9: Build an Animated Game Using React Native and Expo
Project overview
Getting started
Checking out the initial project
Creating an animated Tic-Tac-Toe game application with React Native and Expo
Using the React Native Animated API
Creating a basic animation
Combining animations with the Animated API
Advanced animations with Lottie
Handling gestures with Expo
Handling tap gestures
Customizing tap gestures
Summary
Further reading
Chapter 10: Creating a Real-Time Messaging Application with React Native and Expo
Project overview
Getting started
Checking out the initial project
Creating a real-time messaging application with React Native and Expo
Using GraphQL in React Native with Apollo
Setting up Apollo in React Native
Using Apollo in React Native
Authentication in React Native
Authentication with React Navigation
Sending authentication details to the GraphQL server
Handling subscriptions in React Native with Apollo
Setting up Apollo Client for GraphQL subscriptions
Adding subscriptions to React Native
Using mutations with subscriptions
Summary
Further reading
Chapter 11: Build a Full Stack Social Media Application with React Native and GraphQL
Project overview
Getting started
Checking out the initial project
Building a full stack social media application with React Native, Apollo, and GraphQL
Using the camera with React Native and Expo
Retrieving near real-time data using GraphQL
Sending notifications with Expo
Handling foreground notifications
Summary
Further reading
Chapter 12: Creating a Virtual Reality Application with React 360
Project overview
Getting started
Creating a VR application with React 360
Getting started with React 360
Setting up React 360
React 360 UI components
Interactions in React 360
Using local state and VrButton
Dynamically changing scenes
Animations and 3D
Animations
Rendering 3D objects
Summary
Further reading
Other Books You May Enjoy
Index

Polecaj historie