⏰ 15 mins


  1. In this exercise, let’s save user’s data to local storage whenever it changes
  2. Then initialize the user with the data from local storage if it exists

<aside> 💡 HINT: You should use watch or watchEffect to do this!

</aside>

  1. By the end of the exercise you should be able to
    1. edit the user’s data
    2. refresh the page
    3. still see the users data

<aside> 💡 HINT: You can use localStorage.getItem('some_key') and localStorage.setItem('some_key', value) to interact with this browser native API

</aside>

💪 Bonus

In exercise-11-zbonus-begin.vue, I’ve added the code from one of the earlier exercises. It’s the list of paginated users. Currently it works as expected but I’d like you to refactor it to automatically refetch the users whenever the page value changes.

Helpful Resources

  1. Vue.js Docs - Watchers