React Components

1

Am developing a react application and one of the requirement is that the user should be forced through
the whole workflow. (i.e.) the user should jump to any page directly but rather go from first page. Basically url shouldn’t change when navigating from one page to another.

I am currently rendering the components directly in the root element using ReactDom.render method but i guess this is not efficient. I might also have some props to pass down. Any siggestions?

2

have you checked React Router? It’s a very popular integration to achieve client-side navigation.

Hope it helps :+1:

3

Ok. I would like to add few more points. I dont want to change the url at all. That means the whole of my website would be in same url (www.example.com), for all the pages.

Will react-router help me in this? can you please provide me a link or something to a relevant concept?

Thanks.

4

React router adds Links to your project, “www.example.com/about”, that kind of.
If you do that way you could just navigate normally.

But if you don’t need to change your url, you can try something like having a Master Component, where are the rest of the main components

  • Master
    • Contact
    • About
    • Home

and, you can render the components depending on your state; so, your buttons will be state-changers, and you can do it in the order that you wish it to be, so you can force to go through the workflow.

1 Like
5

React Router does exactly that, achieve the feeling of navigation through an app without actually sending any request to a serve, so yes, your url will stay the same.

Also the link to relevant documentation is already in my previous comment :+1:

1 Like