JavaScript Cookies vs Local Storage vs Session Storage

แชร์
ฝัง
  • เผยแพร่เมื่อ 20 พ.ย. 2024

ความคิดเห็น • 467

  • @Jhonny610
    @Jhonny610 3 ปีที่แล้ว +159

    0:00 Overview
    4:56 LocalStorage
    8:10 SessionStorage
    9:43 Cookies

  • @oldbootz
    @oldbootz 5 ปีที่แล้ว +546

    and on the eve of the year 10000 there was the great cookie expiration crisis...

    • @dawid_dahl
      @dawid_dahl 4 ปีที่แล้ว +65

      oldbootz I’m here from the future to warn all you guys that you shouldn’t be setting your cookies to expire in the year 9999. Please. Human civilization depends on it.

    • @reveluv8851
      @reveluv8851 4 ปีที่แล้ว +4

      @@gl3nda96 set it to 1 ad

    • @nedaltrebor8553
      @nedaltrebor8553 4 ปีที่แล้ว +8

      @@gl3nda96 couldn't you set it programmatic. Like, get current year > add 2

    • @barbelljoe
      @barbelljoe 4 ปีที่แล้ว +16

      @@dawid_dahl shit I will have to find my password to login again.

    • @Ginfio
      @Ginfio 4 ปีที่แล้ว +3

      What kind cookies? Chocolate chip.. cookies..? Or
      Ok nvm.

  • @somehappyguy6598
    @somehappyguy6598 4 หลายเดือนก่อน +2

    July 2024. I was having a hard time working on NextJs, trying to learn how the server rendered pages were accessing my local data before actually generating (I did not want a client page), I did not know that cookies are sent with my requests. Now I can process some data on the server specific for the user, as I am getting the user email from the request as a cookie. I love this channel.

  • @EduardKaresli
    @EduardKaresli 5 ปีที่แล้ว +384

    Man, you're as good as The Net Ninja, which is my current source of information. I hope you'll get many subscribers soon, your style is clear, short and to the point.
    Thanks!

    • @WebDevSimplified
      @WebDevSimplified  5 ปีที่แล้ว +113

      Thank you! That is a huge compliment. The Net Ninja has amazing content and was one of the sources of inspiration for my channel.

    • @dangerdoctor920
      @dangerdoctor920 2 ปีที่แล้ว +5

      Same I only watch net ninja and kyle

    • @shaikhasad2911
      @shaikhasad2911 2 ปีที่แล้ว +1

      Brad Traversy aka TraversyMedia, Shaun aka Net Ninja and Kyle aka WebDevSimplified, these guys are gold for webdevelopers especially for beginners!

    • @101kawsar
      @101kawsar 2 ปีที่แล้ว +1

      Three years later, they have same amount of subscribers.
      Congrats Kyle 🤞

    • @tigana
      @tigana 5 หลายเดือนก่อน

      Yes! Him and Net ninja are so gifted at explaining

  • @pastorfred2543
    @pastorfred2543 5 ปีที่แล้ว +57

    Today is my first time of seeing JS cookies and session storage.. I learnt local storage through MDN some time past.. Thanks Sir, I pray your Channel grows rapidly.

    • @WebDevSimplified
      @WebDevSimplified  5 ปีที่แล้ว +4

      Thank you! I'm glad my video was insightful for you.

    • @sumanthchippagiri1687
      @sumanthchippagiri1687 3 ปีที่แล้ว

      @@WebDevSimplified Hi bro.Your content is awesome and the way you simplifies is above that.I have some real doubts. I can explain in detail if you provide me your mail id.

  • @BoLeee
    @BoLeee 4 ปีที่แล้ว +19

    Yo! Thanks for breaking down topics like this, many youtube searches lead to you and i'm never dissapointed. Thank you

  • @viajeromero
    @viajeromero 4 ปีที่แล้ว +72

    It would be great also if you explain the different situations you may use each of them and which security problems you could have, like for example, storing user session data (auth).
    Great video. Thanks

  • @bohdanromanovich4912
    @bohdanromanovich4912 2 ปีที่แล้ว +20

    This is simply the best TH-cam channel to quickly get to the bottom of a particular issue that you have without long explanations of things you don't need. For everything else, there is documentation. You help a lot of people, thank you so much!

    • @firezunami
      @firezunami 5 หลายเดือนก่อน

      That is so true

  • @nehakumar9889
    @nehakumar9889 4 ปีที่แล้ว

    Crisp and clear explanation. Sir I have an interview tomorrow for an internship. I am watching this to revise the concepts and I chose the correct channel for this purpose. Amazingly explained and straight to the point.

  • @shawnyiwerd
    @shawnyiwerd ปีที่แล้ว

    Tack för att du delar med dig. Jag har använt Morelogin nyligen och det skyddar integriteten.

  • @langsonchibili1329
    @langsonchibili1329 5 ปีที่แล้ว

    THERE IS A REASON WHY *I'VE SUBSCRIBED* TO THIS GUYS CHANNEL, HE'S SO HUMBLE, AND VERY INTELLIGENT AT GETTING THE CONCEPTS IN ONE'S HEAD, AND HE'S SO KNOWLEDGE-PACKED. I AM A FAN AND A STUDENT OF YOURS NOW. MR.

  • @pallad1461
    @pallad1461 ปีที่แล้ว

    Best tutorials about web developing on TH-cam

  • @breebw
    @breebw 4 ปีที่แล้ว +11

    3:31 mid 2020, Apple(iOS and desktop Safari, is implementing a new localstorage rule. Its a game changer.
    "Specifically, Safari will erase IndexedDB, LocalStorage, Media keys,
    SessionStorage, and Service Worker registrations after seven days if the
    user does not interact with the associated website during this period."

  • @TimothySmithii
    @TimothySmithii 4 ปีที่แล้ว +42

    Best cookie video I've seen. You can tell this guy has a deep knowledge of the material with the way he effortlessly explains all the moving pieces.
    I know this is written with for Devs, but it's also a really good sort of introductory deep-dive into cookies. He did a great job of explaining the different types of cookies, how to identify them, what they do, and the reasons for why they are needed. Most concise yet jam packed with info video on any subject I've seen recently. Surprised to find it on the subject of web cookies, as in my experience it has been difficult to find videos that aren't either too shallow or too deep in their scope. This was perfect and I feel like I can take the next step without any huge gaps in my understanding now.
    Great job, thank you!

    • @CJFX_
      @CJFX_ 3 ปีที่แล้ว

      When you know what you're talking about you can put it in simple terms 😆

    • @jellegalgenbeld7226
      @jellegalgenbeld7226 2 ปีที่แล้ว

      lastName=Smith

    • @DenzelHooke
      @DenzelHooke 2 ปีที่แล้ว

      @@CJFX_ Sometimes yes, sometimes no

    • @ojasdighe991
      @ojasdighe991 2 ปีที่แล้ว

      @@DenzelHooke precise

    • @youvegotmail9385
      @youvegotmail9385 2 ปีที่แล้ว

      He's the man. Crazy knowledgeable.

  • @Alireza-kw6fj
    @Alireza-kw6fj ปีที่แล้ว

    missed your voice for about 6 month after you full javascript course, I'm happy to hear you again ;)

  • @harshilparmar9076
    @harshilparmar9076 5 ปีที่แล้ว +36

    bro... thanks for putting much effort..this channel is awesome!!

    • @WebDevSimplified
      @WebDevSimplified  5 ปีที่แล้ว +10

      Thanks! I love making these videos so it doesn't even feel like work. Well at least most of the time :P

    • @jeromelanteri6469
      @jeromelanteri6469 4 ปีที่แล้ว

      @@WebDevSimplified even if you do not copy what is existing already (and that is exactly the same) ?

  • @anikdas5218
    @anikdas5218 3 ปีที่แล้ว +3

    Why I love his videos! Because his contents is to the point. No extra shit.

  • @TaskSwitcherify
    @TaskSwitcherify 2 ปีที่แล้ว +3

    Great video. FYI: 10 MB and 5 MB means MEGABYTES, which is 8x larger than megabits.

  • @bahramiwd4812
    @bahramiwd4812 3 หลายเดือนก่อน

    I had a question and a problem and the theoretical stuff (the table) at the first of the video just solved everything! Thanks!

  • @AlekVila
    @AlekVila 4 หลายเดือนก่อน

    I appreciate that you share solid information. You are consistently good. Thank you!

  • @TradingBloke
    @TradingBloke 10 หลายเดือนก่อน +1

    web dev of non cs bckgrnd -best channel

  • @_briantravis
    @_briantravis ปีที่แล้ว

    Your videos on JS are simply the best. Explain exactly what you need to know, nothing more and nothing less, in the most efficient way. Thank you so much!

  • @karlomoonblade
    @karlomoonblade 5 ปีที่แล้ว

    keep the very detailed straight to point explanation , i really can understand the topic without watching several times

  • @ridl27
    @ridl27 5 ปีที่แล้ว +6

    Bro, You have a talent to share knowledge with us! So easy to follow and understand. You will have much more subscribers in the future for sure! Its all about of time =)

  • @aaronmacken
    @aaronmacken 5 ปีที่แล้ว

    Encountered an interesting bug when working with redux-persist recently. Redux-persist was working just fine on my desktop computer by saving the current redux state to my web browser's local storage.
    I pulled from my local git repo on my mac and begin implementing a new action for my reducer. Next thing I know, all of my redux related functions are causing the application to break.
    As it turns out, I had created a logic error within my reducer, but fixing the logic error itself did not solve the problem. Why? Because redux-persist had already saved that logic error into that browsers local storage. Local storage also does not automatically purge itself, so the solution was for me to delete that browsers local storage and then re-run the application.
    Lucky for me, I had watched this useful video before using redux-persist to figure out how local storage actually works, as I had not previously used it in the past.
    Great learning experience and the video really helped!

  • @indestructible-today
    @indestructible-today 3 ปีที่แล้ว +1

    Great tutorial, thanks.
    It's crazy how express-session uses cookies for server-side.

  • @NITESHSINGHNRS
    @NITESHSINGHNRS 4 ปีที่แล้ว +1

    Every day I am learning from your channel...great work ..

  • @govinda399
    @govinda399 3 ปีที่แล้ว

    you are my favourite content creator. I watch alot of your videos nowadays.

  • @alanhunt3772
    @alanhunt3772 4 ปีที่แล้ว

    This is fantastic, I've been scratching my head a lot lately trying to differentiate session, storage, and cookies and then lining it up with session on the server side. I've started looking at how other websites do it through the browser dev tools and cookies seem to be the weapon of choice.

  • @bdk9830
    @bdk9830 3 ปีที่แล้ว +1

    The best lecture of cookies and storages in the world. thanks Kyle !

  • @jayreyes828
    @jayreyes828 3 ปีที่แล้ว

    My goodness you are covering all the necessary topics, my friend

  • @giorgieliozashvili633
    @giorgieliozashvili633 2 ปีที่แล้ว

    Hey Kyle! Thanks. basically, you taught me React and these little things in javascript. Thank you. You're a huge time saver

  • @Koenv3
    @Koenv3 5 ปีที่แล้ว +17

    Nice video! The size of localstorage and sessionstorage in the video is in megabytes not megabits.

  • @horrorbreakdown
    @horrorbreakdown 5 ปีที่แล้ว +15

    Great channel, I've learned a lot. You're very clear and to the point.

  • @steves1015
    @steves1015 4 ปีที่แล้ว +1

    You have a very clear and concise way of approaching the subject. I felt like I learned quite a lot in 15 minutes! Thank you!
    I hope you get many more views on your videos.

  • @ZazaMasta
    @ZazaMasta 3 ปีที่แล้ว +10

    This guy has done everything I need, he is a walking institution !

  • @tremolony4924
    @tremolony4924 3 ปีที่แล้ว

    Hi, I time travelled back from the future.... The year was 10,000 & I can confirm that this cookie did in fact expire.

  • @WilsonGalter
    @WilsonGalter 5 ปีที่แล้ว +1

    Dude, I had to learn about session storage today on the go in order to create a user login in system!
    I wish I had seen this video before that!

  • @youvegotmail9385
    @youvegotmail9385 2 ปีที่แล้ว

    Opening chart was super helpful .

  • @underwater2003
    @underwater2003 3 ปีที่แล้ว

    First working tutorial i found in half of year! Thanks!

  • @Sh0Eng
    @Sh0Eng 7 หลายเดือนก่อน

    i liked the video before watching it. this is how much i trust this guy.

  • @rahulbhatia1313
    @rahulbhatia1313 4 ปีที่แล้ว +1

    I did not knew Jordi el niño also had a web development youtube channel. great work, keep it!

  • @erykczajkowski8226
    @erykczajkowski8226 3 ปีที่แล้ว +4

    Great explanation of the differences! I think it would be useful if you provided some info on the security concerns and proposed some actual libraries for cookies management.

  • @ekaterinaastrid2636
    @ekaterinaastrid2636 4 ปีที่แล้ว +4

    I really love u, man! this is the best channel about coding.

  • @Sam-xv5ko
    @Sam-xv5ko 4 ปีที่แล้ว +1

    I was searching here and there to learn these things and you really simplified them. Thank you, man, you saved my day. Subscribed

  • @jayteecollins1279
    @jayteecollins1279 10 หลายเดือนก่อน

    Your explanation is always on point! Good job!

  • @erikstone8336
    @erikstone8336 3 ปีที่แล้ว

    First: nice.
    Second: thank you, I’ve been trying to understand cookies vs session storage and which to use and when, your video cleared up a lot!
    Thanks again

  • @frontend3409
    @frontend3409 2 ปีที่แล้ว

    That table at the beginning is helpful. You could show however how (or when) cookies are sent to the server. As i checked in developer tools, they're sent before first call to the webpage

  • @asimgiri4269
    @asimgiri4269 4 ปีที่แล้ว +3

    In order to pass object as values in local/session storage :
    const obj = {value: 1, state: true, name: 'I am object one'};
    localStorage.setItem('myObject', JSON.stringify(obj));

  • @videogamesare1
    @videogamesare1 4 ปีที่แล้ว

    This video, the CSS position video...you are the real deal

  • @gossgorl
    @gossgorl ปีที่แล้ว

    I've been browsing through videos on this and just felt relief when I saw your face lol

  • @master_ofnone
    @master_ofnone 2 ปีที่แล้ว

    This was a great video! Detailed yet concise. Defs subscribing :)

  • @steven5712
    @steven5712 3 ปีที่แล้ว

    Thanks, man. You are awesome. I was just wondering how Redux persist works and this video came up in my recommendation. Great stuff!

  • @a_maxed_out_handle_of_30_chars
    @a_maxed_out_handle_of_30_chars ปีที่แล้ว +2

    thank you, simple and to the point :)

  • @BORIS_DIGITAL_HUB
    @BORIS_DIGITAL_HUB 3 ปีที่แล้ว +1

    Thank you for that good explanation, Kyle!

  • @happyv6872
    @happyv6872 5 ปีที่แล้ว +8

    Man, what a beautiful set of eyes! Your voice is also very nice to listen to. You deserve more subs and views.

  • @cr_spirit3986
    @cr_spirit3986 ปีที่แล้ว

    I'm building a user system right now, this thing came just in time

  • @jevessonsouza7947
    @jevessonsouza7947 ปีที่แล้ว

    2 words: Thank You!
    Your videos have been help me a lot!!!

  • @ahmadjunaidi21-l6l
    @ahmadjunaidi21-l6l หลายเดือนก่อน +1

    goated yt channel

  • @doylemcteller1335
    @doylemcteller1335 5 ปีที่แล้ว +1

    Dude, you‘re always on point. Thanks a lot.

  • @kagisohadebe9913
    @kagisohadebe9913 4 ปีที่แล้ว

    my first web dev video and it was hella helpful thanks for it , liked & subscribed looking forward to more content

  • @_wekesar_6639
    @_wekesar_6639 3 ปีที่แล้ว

    Web dev has never been simpler.. Thanks wds 😌

  • @briandacallos4234
    @briandacallos4234 3 ปีที่แล้ว +1

    You never disappoint me kyle

  • @rohitkudalkar92
    @rohitkudalkar92 5 ปีที่แล้ว +1

    Thank you sir. This is what I was searching for. Thanks bro all your unique videos with best example. Love and support ❤️

  • @a4yster
    @a4yster ปีที่แล้ว

    Kyle is rockin' it!

  • @lucaspedro6488
    @lucaspedro6488 3 ปีที่แล้ว +1

    Thank you very much for the explanation. Very helpful content. Keep it up!!

  • @swibay
    @swibay 4 ปีที่แล้ว +1

    You inspire me a lot dude! Tanzania🇹🇿

  • @quicksilvuhh
    @quicksilvuhh 4 ปีที่แล้ว +1

    You're great at explaining things. I'm very grateful!

  • @leg3ndtariq
    @leg3ndtariq 5 ปีที่แล้ว +7

    Sir, can I just give you a hug if thats not inappropriate in your country 💘
    YOu are making our life easier. Love from all of US 💥💥💥

  • @InnaKasyan-f8h
    @InnaKasyan-f8h 2 ปีที่แล้ว

    Many thanks for such clear and structured explanation!

  • @19jewels95
    @19jewels95 4 ปีที่แล้ว

    Amazing. Clear, concise, straight to the point and beginner-friendly examples. You provide the perfect platform for beginners like me, and I'm always grateful :)

  • @jagdishshetty4782
    @jagdishshetty4782 5 ปีที่แล้ว +3

    Really useful !!! Thx so much !!! Keeping making more videos !!!

  • @Hangoutapp
    @Hangoutapp 3 ปีที่แล้ว

    Kyle the thumbnail you got on this video an other is awesome

  • @musiclovers8488
    @musiclovers8488 3 ปีที่แล้ว +1

    You are the best !!
    Thank you ☺️ man ...

  • @吳文進-j4x
    @吳文進-j4x 3 ปีที่แล้ว

    Thanks Kyle! you explained it very clearly !!!

  • @michalkrajewski7092
    @michalkrajewski7092 10 หลายเดือนก่อน

    You did it, thanks, that's the explanation I was looking for, Regards

  • @devanshishah9481
    @devanshishah9481 2 ปีที่แล้ว

    Nicely explained. Thank you for passing the knowledge!!

  • @riznimohamed
    @riznimohamed 2 ปีที่แล้ว

    Best explanation. I learned what I exactly need to know

  • @adonsav
    @adonsav ปีที่แล้ว

    Thanks for your videos! Great work 🙏

  • @kj6372
    @kj6372 4 ปีที่แล้ว

    Thank you so much for uploading such a simple and easy to understand tutorial video

  • @ca7986
    @ca7986 2 ปีที่แล้ว

    What an amazing explaination! you are amazing dude!

  • @SepSol75
    @SepSol75 4 ปีที่แล้ว

    As always fantastic explanation

  •  3 ปีที่แล้ว

    thank you so much. make me clearly about the concept of them.

  • @azimmalpekar9072
    @azimmalpekar9072 3 ปีที่แล้ว +1

    Very good explanation, to the point.

  • @faithyintii8457
    @faithyintii8457 4 ปีที่แล้ว

    Thanks man... it was quick, straight to the point and informative... i am grateful.
    you just earned a new sub... :)

  • @tronganhnguyenthanh1157
    @tronganhnguyenthanh1157 9 หลายเดือนก่อน +1

    In my opinion, the three main difference between localStorage, sessionStorage and cookie are:
    localStorage: It will save your data forever even if you close your tab
    sessionStorage: It will save your data temporary and when you close your tab, your data will be disappeared
    cookie: Save your data with an expiry date
    Am I right ?

  • @SubhobrotoRoy
    @SubhobrotoRoy 5 ปีที่แล้ว +4

    Thank you for making such an informative video!!!

  • @samcodes2912
    @samcodes2912 4 ปีที่แล้ว

    short explanation and clear as water 👍

  • @avvinashjha
    @avvinashjha 3 ปีที่แล้ว

    These videos are good please share more ...🙏

  • @arnobislam1615
    @arnobislam1615 2 ปีที่แล้ว

    amazing and simplest explanation

  • @smurffronda2951
    @smurffronda2951 3 ปีที่แล้ว

    thanks man, have a great week

  • @avi12
    @avi12 3 ปีที่แล้ว +1

    6:19 You don't actually need to use these methods
    If you want to set a value, you can use: localStorage.someProperty = "value"
    To retrieve: console.log(localStorage.someProperty)
    To delete: delete localStorage.someProperty

  • @大盗江南
    @大盗江南 5 ปีที่แล้ว +1

    Thank you man, simple and clear

  • @joseantoniovela9599
    @joseantoniovela9599 2 ปีที่แล้ว

    thanks for all, you are the best !!!!!!!!!!

  • @sruthisoman6533
    @sruthisoman6533 4 ปีที่แล้ว

    Excellent presentation. This helped me understand the concept so much better. Thank you✌️

  • @anakreonmh87
    @anakreonmh87 3 ปีที่แล้ว +3

    0:52 it's browser dependent, not independent. But otherwise a great explanation

  • @ray_bags
    @ray_bags 4 ปีที่แล้ว +1

    Thank you so much. This really explained everything really well.

  • @ghazanfarabbas4187
    @ghazanfarabbas4187 3 ปีที่แล้ว

    Thank for such valuable tutorial.

  • @giordanovaldez8348
    @giordanovaldez8348 4 ปีที่แล้ว

    Liked and subscribed. Great explanation for everything. Keep up the good work!

  • @paulshoultz9706
    @paulshoultz9706 5 ปีที่แล้ว

    99% of these type of tutorials are bullshit, this guy is in the 1% you look for!