Search code examples
reactjsnext.jsnext-router

Problem with routes in Nextjs 13.4 - tailAdmin ui


i used https://github.com/TailAdmin/free-nextjs-admin-dashboard.

I can't acces to my new blog page (404 error)

"/app/blog/[id].tsx"

import React from "react";

function Post({ postData }) {
  return (
    <div>
      <h1>Post ID: {postData.id}</h1>
      <p>Post Content: {postData.content}</p>
    </div>
  );
}

export async function getStaticPaths() {
  const paths = [{ params: { id: "1" } }, { params: { id: "2" } }];

  return {
    paths,
    fallback: true,
  };
}

export async function getStaticProps({ params }) {
  const postData = { id: params.id, content: `Content for post ${params.id}` };

  return {
    props: {
      postData,
    },
  };
}

export default Post;

i tested the same code with another project, it work. (under '/pages/blog/[id].tsx')


Solution

  • I'd suggest reading the official documentation about dynamic routing since there were groundbreaking changes with next 13.4 (they introduced the app router, which is "quite particular")