🛣️ ReactJS – Programmatic Navigation

Navigating Programmatically Using React Router

Programmatic navigation means changing routes using code instead of links. For example, using navigate('/home') inside a function to go to the Home page after a button click or form submission.

This makes navigation dynamic and event-driven, useful in many real-world apps.

We can use useNavigate() from react-router-dom and call it inside a button's onClick event.

We can define navigation logic inside functions and reuse them across multiple buttons.

We can create a reusable function that accepts a url argument and navigates accordingly.

We can use conditions to decide which route to navigate to.

React Router also allows navigating back using navigate(-1).