Questions tagged [nextjs-dynamic-routing]

In Next.js, dynamic routes are defined by placing the parameter inside square brackets ([]) in the page file name. For example, if you have a dynamic route for displaying a user's profile, you can create a file called [username].js. The username inside the brackets is the parameter that will be used to generate dynamic pages.

To handle dynamic routes, Next.js provides a special component called getServerSideProps or getStaticProps. These functions allow you to fetch data based on the dynamic parameter and pass it as props to the page component.

188 questions
1
vote
0 answers

NextJS seemingly ignored my homepage when I build, (and mysteriously, one other page). It's "remembering" it's very first iteration?

In local development, everything is fine. In production, my homepage "remembers" its prehistoric "first version"! along with one other page! I don't even know how it's getting information on how to look like. It's old CSS. old layout. old content.…
1
vote
0 answers

NextJS 13 Dynamic routing not working on Google Cloud Run platform

I'm encountering an issue with dynamic routing in my Next.js application when deploying it on the Google Cloud Run platform. The dynamic routing works fine locally, but when deployed on Google Cloud Run, the route parameters are not being passed…
1
vote
1 answer

Where to redirect with notFound when using generateMetadata?

Some of my pages export generateMetadata functions that fetch the same data as the Page component itself. If the data is not found (indicated by a 404 server response), do I need to redirect (by calling the notFound() function) in both functions? If…
Florian Walther
  • 6,237
  • 5
  • 46
  • 104
1
vote
0 answers

Is it ok to use Next JS 12's api routes to fetch protected images into Next Image component?

The images on the backend are behind a Basic Authentication. I've created a Next JS API route to set Basic Auth Request headers to the request and set that route as the URL to the Next Image component, since the Next Image component doesn't allow us…
Sushant Rajbanshi
  • 1,985
  • 1
  • 19
  • 20
1
vote
2 answers

How can I wrap all of the aplication inside of a Middleware in Next JS 13?

I've been trying to wrap all the application inside of a middleware. As the docs says: export const config = { matcher: [ /* * Match all request paths except for the ones starting with: * - api (API routes) * - _next/static…
RockoCH
  • 11
  • 1
1
vote
1 answer

next js 13 keeps refreshing the page on router push

I'm buildng a search app with NextJs 13 and the issue that i have is that it refresh the page every time when i click search button and that's only happening when i push it on vercel. When I run it locally both with "npm run build and npm start dev"…
1
vote
1 answer

Shallow routing not working as expected in nextjs

I am trying to change the query params using router.push without reloading the page. I tried using shallow routing as suggested by nextjs docs but it is not working as expected. It should be noted that I am using dynamic routing. So my url looks…
Rao Asim
  • 158
  • 8
1
vote
2 answers

Nextjs state not updating on route change

I know there's a lot of questions in the same topic. I've been reading for about 2 days about this and i cant make it work. So my situation is this: I have several dynamic routes in my Nextjs app and each fo these routes have a table inside the…
Ilir
  • 488
  • 5
  • 20
1
vote
1 answer

504 Error when trying to access pages with getServerSideProps

I have a NextJs Application that has been deployed to vercel that has a dashboard/users route when trying to access this route, which uses SSR in the developer console I see that a request to /_next/data/ld-OZbjuY-alZAOD8xnFp/dashboard/users.json is…
1
vote
1 answer

Next js dynamic routes work as expected in development but returns 404 page in production

I am trying to use dynamic routes to render pages using next js. When user hits the url (http://localhost:3000/post/123) it should render a page and I should be able to pull the id from the url using useRouter() hook and display it in the page as…
Karthik
  • 21
  • 3
1
vote
0 answers

How to solve 504: GATEWAY_TIMEOUT error in vercel deployment

I have deployed my next js project in vercel it's showing 504: GATEWAY_TIMEOUT error on those pages where i have added getServerSideProps function. I am not calling any api request on this getServerSideProps.I am just using this function so that i…
1
vote
0 answers

Dynamic routes in next.js and query params

in my app I am using dyanmic routes in my nextjs app for a results page. You get to the results page from the product search page where there is a form for products. The form sends the search terms as a URL string query to the results page. Hence…
strangecarr
  • 25
  • 1
  • 5
1
vote
1 answer

Next.Js - Uncaught (in promise) Error: Cancel rendering route

I am trying to create basic authentication and route protection for pages in Next.Js, before I start connecting them to the backend (Express.Js). However I am getting this error: Uncaught (in promise) Error: Cancel rendering route I have 2…
1
vote
0 answers

when I try to get data from prisma on a dynamic page, I get an error

I am creating a test website next js 13 and trying to deploy it using docker. Everything is fine in development mode, but when I use docker, I get an error. I noticed that in normal pages I can easily get data from the database, but when I try to…
1
vote
1 answer

How to fetch data using params in next js using client side rendering

I am working on a chat application. I am using next js Axios. I created a dynamic route for example chat/:pid. I want to fetch data using this pid. I used useRouter but when I load the page my values say undefined. const router = useRouter(); …