 If you're building a progressive web app, you're probably going to need a data store. Data storage can be a complex task. There are several challenges you must overcome to do data storage properly. You need to make sure your data is secure, and this requires encrypting sensitive information, sanitizing data before it is stored, hashing users passwords, and so on. You need to keep track of read and write permissions and authenticate your users before they interact with the database. You need to make sure that your data storage is scalable and can grow as your data requirements grow. And you need that to work across a variety of devices, platforms, and connectivity scenarios. I'm Sam Dutton, and I'm going to show you how to integrate progressive web apps with secure, performant data storage. Now, in our examples, we use Cloud Firestore for Firebase. It's an easy-to-use data store that works across native and web applications with real-time capabilities and client-side storage integration. Firestore combines the real-time capabilities of Firebase real-time database, which handles the complexity of real-time synchronization and conflict resolution with the speed and scalability of Cloud Datastore. So, we're able to use a collection document model, structure our data hierarchically, and use rich data types. A document can consist of many key value pairs with available types as arrays, billions, bytes, date and times, floating point numbers, geographical points, integers, maps, nulls, references, and, of course, text strings. A collection is a grouping of documents and a document can have sub-collections. Users can log in anonymously and later merge data with a full non-anonymous account. Cloud Firestore is simple to use and quick to get started with. You need to create a project on firebase.google.com and enable Firestore. Then initialize Firestore in your app using the command line tools. Import the Firebase Firestore libraries into your HTML and then you're ready to use the Firestore API in your app. First, you can go to firebase.google.com and click the Add Project card. This brings up an overlay in which you name your new project and select a region. After you've created the project, you'll be taken to a dashboard where you can enable Firestore. Firestore lets you set the initial permissions of the project. Locked Mode does not allow read and writes from anyone, whereas Test Mode allows all reads and writes. It's okay to get started in Test Mode for development, but just remember that this lets anyone read and write to your database and you will definitely need to change those permissions to be more restrictive before you publish your app to the web. Once you've enabled Firestore, you get an empty database that's ready to be connected to your app. To initialize Firestore in your app from the command line, you must first do a global install of the Firebase tools. Then make sure you're in your app's home directory and do a Firebase init. Now, this will bring up several prompts. The first lets you choose which CLI features you want. In this case, we just want Firestore. And the next prompt lets you choose which Firebase project to connect to your app. You can then create a Firestore.rules file that contains the database read and write permissions and the Firestore.indexes.json file that lets you index your data. This completes the initialization for your app. Then you just hook up the relevant libraries in your HTML and you're ready to use the Firestore API. Now, the Firestore API is really simple. Here's a sample for adding data to our ship's collection in the Space Race app. We get a reference to the collection on the Firestore object and then call the add method with the data we want to add. Getting a specific document is similar, except now we call the get method on the specific document we want to get, passing in the doc ID to the doc method. To get all the docs in the collection, we instead call the get method on the whole collection instead of on a specific doc. To delete a doc, we can just call the delete method on a specific doc. You can call onSnapshot on a query to add a listener to Firestore. This creates a document snapshot immediately with the current contents of the query. Then each time the contents change, another call updates the document snapshot. We can see what kind of change was made using the doc changes method and checking the change.type. This can be added, modified or removed. Now, don't worry if you missed something in this video, you can create your own project to store and retrieve data in the accompanying lab. There are also links to resources to help you get started. Thanks for watching.