Check out a free preview of the full Web Storage APIs course

The "Introduction" Lesson is part of the full, Web Storage APIs course featured in this preview video. Here's what you'd learn in this lesson:

Maximiliano Firtman introduces the course by providing some personal and professional background. An overview of the course material and prerequisites are also covered in this segment.

Preview
Close

Transcript from the "Introduction" Lesson

[00:00:00]
>> My name is Maximiliano, I can go by Max. This is going to be browser data storage. So we have a full day talking about how to store, retrieve and manage data client-side in the browser. So that's for websites, web apps, PWAs, even hybrid apps in case you are doing still phone gap apps, electron apps.

[00:00:21]
So we're going to cover the modern APIs available for that. So really quickly, I'm a mobile web developer. So I have been doing web development since forever and mobile apps since 2001,okay? I'm from Argentina. So I came from Buenos Aires, that's my home. And in this topic, so I've been as I was saying, since forever, since 1996 I started doing websites, designing websites and of course JavaScript like almost after that.

[00:00:55]
I authored 13 books on the topic, okay? And the latest one is available for free at web.dev/learn/learn/pwa. In terms of web apps, so I published around 160 different web apps. I'm talking about a whole range of web apps across two decades. I'm talking about web apps for mobile devices such as Blackberry, Symbian, if you have heard about that, okay?

[00:01:28]
But also for iOS, for iPads, so talking about web apps that are published on the web today, but also web apps that were actually published on different stores, even 15 years ago. I'm saying this because I have been playing with data storage since then. Because doing web apps was actually a way to use these API's a lot.

[00:01:51]
So I have all that experience to talk about what happened with those APIs, which APIs are still useful and which API's we shouldn't be using, okay? So, today we are not going to cover all the APIs available, but the APIs that you should be using, okay? And we will see why also.

[00:02:10]
So, directly into the topic. We're going to cover first the state of browser storage. So we're going to see right now, which APIs are actually not a good idea to use, even if they are still there, okay? So we're going to talk about debugging tools. So all the tools that we have available today on browsers to work with data storage.

[00:02:34]
But lets talk about something that typically we don't think too much about or we don't know what's going on. It seems like a mystery, that's Quotas. So, how does that work in terms of how much data is possible to store in a web app, okay? Client-side, we are always talking about client-side here.

[00:02:55]
Of course in the cloud you can do wherever you want because you don't have any restriction. We'll talk about persistence as well. So, what happens with our data, what's the life cycle of the data that we are going to store? And in terms of workshop and playing with the real app, adding some code on it, we are going to talk a little bit about web storage that probably you know as local storage, okay?

[00:03:21]
IndexedDB, the caches storage API, and the file system API. So those are the four APIs that we will cover deeply, okay? So, pre-requisites. So I think I'm assuming that you know JavaScript, so plain JavaScript with promises. So ES 2017 kind of if you are there, that's okay. We are not going to use any library or any framework, we are not going to use any package share.

[00:03:50]
We are just going to write plain JavaScript so you can actually apply everything that we are going to learn to any library, to TypeScript if you want. So everything will be compatible with just the web. So whatever library you're using, you can still apply what we're going to learn today, right?

[00:04:07]
And on that URL, firtman, that's my last name, .github.io/browser-storage, you have a step by step instructions of what we are going to do today. Including a PDF version of the slides that I have here in case you wanna download the slides and follow along, you have the slides there.

[00:04:27]
And also the project that I will give you in a second, you have the link there to clone the repo and then we will start coding with that project.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now