Persistence with Local Storage

We will keep track of the state in our Pomodoro app by storing it locally.


Store the state of the application in local storage. Make sure the application state is reloaded once you refresh the page.

Source code:

Use the PomodoroTracker2 folder as a starting point. The end result is in PomodoroTracker3.


Clone PomodoroTracker2 from my GitHub repository as a starting point. Alternatively, you can use your own solution too. We will only modify the JavaScript code, js/pomodoro.js.

Local storage is straightforward. There is a localStorage variable in the global scope. localStorage may contain keys with string values that persist in your browser. This is client-side persistence, so your changes do not carry over to a different browser or computer.

As you can only use strings as values in the local storage, you have to stringify your object or array using JSON.stringify.

Let’s write a function to save the application state to the local storage:

Level up your interview prep. Join Educative to access 70+ hands-on prep courses.