Это видео недоступно.
Сожалеем об этом.
Simple Introduction to IndexedDB with the idb-keyval Library
HTML-код
- Опубликовано: 21 фев 2021
- IndexedDB has great support in modern browsers but can be a bit intimidating to start working with. This video uses the newest version 5 of Jake Archibald's idb-keyval library to simplify what you need to know to get started.
If you have worked with localStorage or sessionStorage and like using Promises with their then( ) and catch( ) methods, then you can use IndexedDB.
Code from Video: gist.github.co...
Link to idb-keyval Github Repo: github.com/jak...
Practical LocalStorage video: • Practical Coding with ...
Upcoming Deeper Dive into vanilla JS for IndexedDB video: COMING SOON
3 years later and this jumped my knowledge by a couple of orders of magnitude. Thank you so much for doing these videos. Super well done!
Thank you for this series, it is helpful. I also want to mention that I have the limited edition 21-year-old Lagavulin. I have never opened it.
Nice.
Great tutorial, perfectly explained as always!
May I ask why? (I’m just curious for educational reasons)
Thank you for the content you are creating it's a real pleasure.
Man, you are awesomely consistent with the early morning posts. Being a very early riser myself I love to see the notification for them come in when most of RUclips is quiet. I wonder if you are up early or up late?
Both. But the videos are scheduled for release at the same time. 😀
Great video, thanks. Looking forward to the next one.
Thanks alot,
Using this library saved us from using the api directly which is very confusing
It's only confusing when your first start. Once you get past the initial learning curve you will appreciate the additional features like transactions.
Good work! I have a question though: if I have indexDB on one of the computers, can I access it and edit stuff from another computer, which has access to the first computer via shared drive?
indexedDB is data that is only internal to the browser that is holding it.
You can build websites that use WebRTC to connect its users with peer to peer connections and then people at the two computers can send their local data to each other. Or alternatively have a person uploading the data from their browser to a server and someone on another browser downloading that data. But both of these solutions need to have a system built and require interaction from a person at both ends.
You can't access the data like you can on a remote database like MongoDB Atlas.
Around the 15 minute mark, when you are using update('user_id', (val) => { return val - 10000;}), you followed up with stating that setting the user id updates the id with every refresh. So updating did not cause the update of the user_id (because it wasn't subtracted by 10000), but the refresh of the page due to set. What is the purpose of the update portion, then?
And if you have any idea how ...1.579.149 - 10.000 leads to ...1.898.114 I would appreciate any hint very much, since this library may be well meant but not a good recommendation for someone to use...
Thank you professor for the amazing videos. I have a question if I may: -is there a particular reason why you're using then & catch instead of async await?
I much prefer the then catch syntax to the async await syntax.
I have tried to use the type="module" and use the url address you provided and my console is getting a safari error. So I tried the iife method, and my console is getting the error that the page cannot be found. There is something possibly broken with those links... I'm not able to follow the tutorial because of these issues because indexedDB won't create any stores...
Finally will use IndexedDB. Do you post on Morioh for every video?
Not every video. Recently quite a few.
I have lots more indexedDB content coming this week.
Hey, thanks for another great video!
If you don't mind, here's a question that came to mind: if `undefined` is returned when one tries to use `get` on a key that does not exist, when is the `Promise.catch` method called (when using the `get` method)? I thought the `catch` would be called if a key didn't exist
Catch geta called of there is an actual error like the transaction was already closed or the database or collection dont exist
@@SteveGriffith-Prof3ssorSt3v3 Ahhh, ok. Thanks again!
Thank for the tutorial, little question, is IIFE necessary when we use type=module ? the script is scoped thanks to module no ?
It is scoped due to the module yes. I this allows me to create other scopes in the same page too and the script will work if it is not a module and the contents of the other two js files are copied in.
Hey Dr Griffith.
I was wondering how you could use the update() method to update an object/document.
I tried playing around, but it's returning undefined.
Thank you.
Sorry, not sure what you are trying to do.
@@SteveGriffith-Prof3ssorSt3v3
I have actually found out how to do it.
I was wondering how to update an object field.
But it was giving me undefined.
All I needed to do was add a return statement.
hi Steve, i got the following error when trying your code, seems i cannot import idb-keyval successfully, di d i miss something simple? thanks
Uncaught TypeError: Failed to resolve module specifier "safari-14-idb-fix". Relative references must start with either "/", "./", or "../". index.html:1
On the library page - github.com/jakearchibald/idb-keyval - in the ReadMe file, Jake Archibald references a massive bug in Safari related to indexedDB. That is likely what you are encountering.
The rest of my IndexedDB series uses vanilla IndexedDB, not this first simple library.
@@SteveGriffith-Prof3ssorSt3v3 thanks Steve for the info., very appreciated.
you really have great videos and tutorials BUT PLEASEEE UPGRADE YOUR EQIPMENT , mic in particular, its very sensitive to your "swallowings"
I have an excellent microphone. Nothing to upgrade. Some videos have better audio quality than others. Sometimes I'm closer to the mic than others. Sometimes there is more background noise.
I do not have the time to design the content, record the hundreds of videos that I make plus spend a lot of time on post production.
I do these tutorials for free. In my spare time. On top of my full time work.
@@SteveGriffith-Prof3ssorSt3v3 i get it... sorry.. ;) im grateful for awesome tutorials
Mr. Steve, programming is mainly about logic and best practice, why there is no one well maintained strongly typed functional programming language working on the web, the main operating systems, smart phones...etc
probably JavaScript is qualified for this, a new version so no need for type script, what for wasting of time and efforts each few years to learn a new programming language, competition among IT companies regarding programming languages is essential, but students, scientists,...etc has nothing to do with that.
you can call a print function like console.log Kathy or Susi or ... is that is really science ? of course programming is a science but not the programming language itself, at the end it is merely a tool.
I have been writing JS for the web for 25 years. It has grown over the years with the introduction of all the HTML5 APIs, standardization across the browsers and with Node running on the server as well. It is a well maintained and functional language. The difference between JS and something like Python is that it is maintained by the ECMA association and not a single person who makes every decision. Things move fast on the web. Lots of companies and individuals are constantly making suggestions and proposing changes to make JS and the web better. This means that things are tested live in the browsers before they become part of the standard.
Everything connected to the web is in constant change. Many companies are constantly competing to become the one best solution, framework, OS, interface, library, hardware, etc. Yet despite all that HTML is still the interface standard behind much of what we do. CSS has been the design language standard of choice for over 20 years. JS has been the client-side language since the mid 90s, and that has led to JSON, Node, and document databases.
Nothing exists in a vacuum.
@@SteveGriffith-Prof3ssorSt3v3 no doubt JavaScript will stay on the top at least within the next 7 year, I meant what about Typescript, do you think it is possible to somehow make JavaScript strongly typed after few years from now? or they will not be able to keep its backward compatibility?
JavaScript is a special language not only because of the functional programming, even its prototypal inheritance has many advantages.
I think even if they have to rebuild it to get the best of other languages too is a good idea regarding a long term strategy.
I mean like: NodeJs and Deno.
I don't see strong types ever being added to JS. The dynamic typing is a core feature of JS. Dart and Typescript are there for people who want the strong typing. As long as you are not reusing variables then you are following good habits. You can add type checking for your variables and objects with Proxies and getters and setters if you need it.
@@SteveGriffith-Prof3ssorSt3v3 I agree you totally, for me JavaScript is unique and has many advantages, this is the fifth programming language I learned, my point of view is a long term strategy similar to NodeJs and Deno.
anyhow many thanks for your reply, your are humble and professional, I like your RUclips channel, it is valuable.