-2

If I have an React/Redux single page application that has - say - a customers page that lists businesses that are customers, and from there each customer can be accessed with a URL like this:

/customer/1

From there, the page lists contacts at said customer, and the user can drill into individual contacts at that customer:

/contact/58

On the contact page, there are details about the customer, and a few details about the customer they work for.

This all works fine if the user navigates through the pages as I've described. But if the user goes straight to /contact/58, there won't be any state about the customer to display.

Finally, the question: how should Redux-based SPAs cope with this?

3
  • Any explanation for the downvote?
    – Rob Grant
    Nov 1, 2017 at 12:32
  • 2
    Why are your URLs context-sensitive? Why not use /customers/1/contacts/58 to get to the 58-th contact of the 1-st customer? Thar URL should work regardless of navigation history. Nov 1, 2017 at 12:52
  • @BartvanIngenSchenau they aren't context-sensitive, in that contact/58 is the absolute URL to the contact, but still, fair point - I thought this might come up, as it seems like the most likely option to work. If I did, though, would the screen always do a get on customer and then a get on contact? And - getting to the heart of my question - what's the best way to do that sort of "chaining" of calls in React/Redux?
    – Rob Grant
    Nov 1, 2017 at 13:11

1 Answer 1

0

I would imagine it working something like this:

  1. You navigate to /customers. The browser makes a request for /customers and gets back customer data, including a list of contacts (probably just name and an id) for each customer/business.
  2. Drill down on a contact. The browser makes a request for /contact/58 and renders a new page once it has that data.

Also, your URL scheme is confusing. Why are you saying /customers/1 will bring you to the list of customers? That to me implies I'll get a view of customer data for customer id = 1. I would think just /customers would return a list of customers.

4
  • Apologies - I rewrote that top bit part way through. I'm going to edit out the change rather than show the edit publically, to avoid confusion; I hope that's okay.
    – Rob Grant
    Nov 1, 2017 at 12:28
  • On the actual question: if the user goes straight to /contact/58, and there is no customer data in the store, your description of how things should work will still error (or show empty fields where the customer data should show). How do we compose these calls (that might go further levels of nesting deep, potentially) so we make them if needed?
    – Rob Grant
    Nov 1, 2017 at 15:16
  • If a user goes straight to /contact/58, make a request to the server for that data, and then render it.
    – neilsimp1
    Nov 1, 2017 at 20:28
  • What I'm trying to say is that the Contact screen also has information about the Customer on it, so if the user goes to /contact/58, two requests are needed. I'm asking about a good way to compose those requests, or whatever is good Redux practice.
    – Rob Grant
    Nov 1, 2017 at 20:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.