przechowywanie stanu zmiennych

Piszę właśnie swój pierwszy projekt w js (restauracje) i ciężko mi się w tym odaleźć.
Mam w związku z tym pytanie.

Obecnie mam pliki:
menu.html
menu.js

Napisałem 2 metody dzięki którym mogę dodawać potrawy z poziomu menu (na razie tylko efekt wizualny (przyciski: +/wyświetlIość/-)).
Teraz chciałbym utworzyć plik koszyk.html który byłby wypełniany treścią na podstawie informacji z dokumentu menu.html, np. jeśli przy potrawie mam wartość 2 to chciałbym żeby w koszyku pojawiły się odpowiednie informacje.
Następnie jeśli wróce do strony menu.html chciałbym żeby informacje o dodanych uprzednio potrawach zostały zachowane.

Ogólnie zastanawiam się jak powinno się przekazywać informację pomiędzy plikami html i jak przechowywać ich stan w pamięci podczas przełączania się między stronami.

Czy powinienem utworzyć jakiegoś singletona (np. potrawaStan.js) który będzie zawierał mape (klucz: nazwa, wartość: ilość) i używać jej z poziomu menu.js tak żeby później z tego obiektu korzystały pliki menu.html i koszyk.html i odpytywały go przy ładowaniu (window.onload())?

Poczytaj o

 localStorage

Tak tylko zapytam, żeby mieć pewność - Ty ten projekt piszesz w celach edukacyjnych, prawda?

Bo jakby miał to być jakiś projekt realne używany, to jedyną sensowną opcją jest postawienie jakiegoś serwera, który będzie gromadzić wszystkie dane.
localStorage po pierwsze nie jest wiarygodny, bo w każdej chwili może zostać wyczyszczony, a po drugie to jest on jedynie widoczny z poziomu tej przeglądarki, na której została wartość zapisana. A główną ideą pisania aplikacji webowych jest wielodostęp z dowolnego miejsca - co w przypadku localStorage nie ma prawa zadziałać.

@cerrato: Tak, piszę to edukacyjnie. To znaczy mam już część implementacji REST Api w Javie i Springu który używa Hibernate do persystencji na MySQL.
Zamierzam w tym projekcie używać Jsonów to zasilania GUI treścią i wysyłania danych na serwer.