Also install React Router by running yarn add/npm i react-router-dom. Create a new React project using create-react-app. With that out of the way let's get started. For achieving the same results in Gatsby or Next.js the procedure will be different and will rely on their custom routing APIs. Keep in mind that this tutorial focusses on dynamic routing in React with React Router. We'll be using the Star Wars API to get a list of users and we'll generate separate pages and routes for all of them. Let's see how we can implement this in React. This is what's known as dynamic pages and routes. ![]() ![]() You'll even notice that while all the pages have similar structure, their content is different. If you've ever visited a site with a bunch of different users with different content from each user such as a blogging site, social media or even dev.to, you've probably noticed that each page of a particular user has a route along the lines of /username or if you visit a particular article of the user on the site then a route like /username/article.
0 Comments
Leave a Reply. |