How to keep NgRx state on refresh in Angular

Click for: original source

It’s a common requirement: persisting NgRx state in order to load it back up when your Angular application is restarted. This process of populating an empty object with domain data is called re-hydration. While it’s common to persist the store data to the browser storage (mostly localStorage), you might also re-hydrate from a server-side cache. By Nils Mehlhorn.

There are some pitfalls to watch out for when applying this pattern. For one thing, you should take care not to store sensitive data in potentially insecure storages. Consider factors such as multiple users working on the same machine. Additionally, the state you’re storing can become outdated. Consequently, you might incorporate techniques like validation and partial re-hydration.

The article pays attention to:

  • Persist with Redux DevTools
  • Re-Hydration Meta-Reducer
  • Re-Hydration Meta-Reducer + Effects

You will find detailed code examples for each of the discussed topics. The only disadvantage To learn about advantages and disadvantages of re-hydration follow the link to full article. Nice one!

[Read More]

Tags frontend nodejs angular javascript web-development