Very much liking the auth0-spa-js approach. I created a todo sample project with Redux. When logging in existing Redux state is lost due to navigating away from the page. I’m wondering what the recommended approach is for maintaining Redux state while logging in?
The best way to have persistence after a page refresh is to create your own server and connect it to a database.
Since you’re using redux, you might need to create an action creator that does a GET request to your server and then call that using a componentDidMount or a useEffect. This action creator should have an action that then receives the return value of that GET request to your payload. Which essentially means, if you’re using the axios library, just do something like this:
const getTodos = () = dispatch () => {
axios.get('url')
.then(res => {
dispatch({payload: res.data})
})
.catch()
}
Oh… you also need redux-thunk here so that you can make asynchronous requests using redux.
And lastly, to create new todo’s, you also need to create an action creator that does a POST request to add a new todo to the server
tldr: Doing a simple todo list is cool. Using redux for a todo list is great, a bit overpowered, but making a persistent todo list using redux takes a bit of work. There’s a lot of components that needs to be set and you’re essentially asking to make a fullstack to-do app.
This is not really an auth0 question, but more so a “how do I make my todos persistent on page refresh” question.
@klequis Actually now that i think about it more, you can use localstorage to create psudo persistence.
Let us know @klequis if those tips worked for you! One more thing to add here we recommend avoiding storing stuff in local storage as it’s not a secure way.
After thinking about this changed the flow of the app so there is no state to maintain before login. Thanks for you help.
No worries! We’re here for you!
This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.