Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
Progressive Web Apps with React

You're reading from   Progressive Web Apps with React Create lightning fast web apps with native power using React and Firebase

Arrow left icon
Product type Paperback
Published in Oct 2017
Publisher Packt
ISBN-13 9781788297554
Length 302 pages
Edition 1st Edition
Languages
Arrow right icon
Author (1):
Arrow left icon
Scott Domes Scott Domes
Author Profile Icon Scott Domes
Scott Domes
Arrow right icon
View More author details
Toc

Table of Contents (15) Chapters Close

Preface 1. Creating Our App Structure FREE CHAPTER 2. Getting Started with Webpack 3. Our App's Login Page 4. Easy Backend Setup With Firebase 5. Routing with React 6. Completing Our App 7. Adding a Service Worker 8. Using a Service Worker to Send Push Notifications 9. Making Our App Installable with a Manifest 10. The App Shell 11. Chunking JavaScript to Optimize Performance with Webpack 12. Ready to Cache 13. Auditing Our App 14. Conclusion and Next Steps

What this book covers

Chapter 1, Creating Our App Structure, gives a brief overview of what exactly you will be learning to build-- a real-time chat application with push notifications and offline support. You will get to learn about the challenges that such an app presents, and get a brief overview of the technologies that will be discussed in this book. By the end of the chapter, you will set up the application structure of a chat app, with HTML and CSS.

Chapter 2, Getting Started with Webpack, says that before you write any React code, you need to set up the webpack build process. In this chapter, you will be introduced to webpack; you will learn to install the package and set up some basic configuration as well as get the development server running. This chapter will get you ready to jump into React.

Chapter 3,  Our App's Login Page, introduces you to React time! In this chapter, you will learn to write the first two components: an App wrapper to contain the application and a LoginContainer. Learn about rendering with ReactDOM and JSX, and write a basic form to allow the users to log in. By the end of this chapter, you will be familiar and comfortable with the React syntax.

Chapter 4, Easy Backend Setup With Firebase, informs that the login form looks great, but is lacking actual functionality. To move forward, you will need a backend database and authentication solution to communicate with it. This chapter will introduce you to Firebase by Google. Set up the application on the Firebase console, and then program the login and signup functionality for the form.

Chapter 5, Routing with React, lets you know that once the user logs in, you want to redirect them to the main chat view. Therefore, in this chapter, you will learn to build that main view and then set up the React Router that allows the users to move between the pages. Lastly, learn to add a third view the individual user view--and explore parameter matching in URLs.

Chapter 6, Completing Our App, takes you through the last step in building the basic application, adding functionality to the chat and user views. You will learn to write and read data from Firebase, taking advantage of React life cycle methods to do so. Once that’s done, your web application will be complete, but it’s not quite progressive yet!

Chapter 7, Adding a Service Worker, covers service workers and how they work. Here, you'll understand how to register a custom service worker and learn about its life cycle, and then hook into the default Firebase messaging service worker.

Chapter 8, Using a Service Worker to Send Push Notifications, teaches you to configure the app now that our service worker is ready, to be able to send the push notifications. You will use Firebase Cloud Messaging to manage sending these notifications, and add customization to control how and when they are sent on desktop and mobile.

Chapter 9, Making Our App Installable with a Manifest, teaches that a manifest is a JSON file that allows users to save your app to their home screen. You will learn to create the manifest and understand the best practices as well as iOS-specific considerations. You will also learn to customize your splash screen and icons.

Chapter 10, The App Shell, puts across the point of the App Shell pattern being a key concept in PWAs, but what advantages does it bring? You will be introduced to both the shell and the RAIL system of progressive enhancement, and then move some of you app's layout out of React for optimal rendering.

Chapter 11, Chunking JavaScript to Optimize Performance with Webpack, explores the PRPL pattern, its goals and methods, as well as an overview of how to achieve it in your app. Then, you will dive in, splitting up the JavaScript into chunks based on routes, and then lazy loading the secondary routes.

Chapter 12, Ready to Cache, walks through how you can leverage the service worker to achieve offline capability, by understanding the new Cache API, and how to use it with your service worker to cache the JavaScript chunks.

Chapter 13, Auditing Our App, says it's now time to check our work! In this chapter, you will be introduced to Lighthouse and understand how to audit PWAs with Lighthouse.

Chapter 14, Conclusion and Next Steps, Your first PWA is complete! In the development process, you built most of the PWA infrastructure manually. In this chapter, you will get to learn about the helper libraries and shortcuts to save time, and you'll also explore the future of PWA development. Additionally, you will come across suggestions about the future project ideas and improvements that can be made to your chat app, as an extra challenge.

lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at $19.99/month. Cancel anytime
Banner background image