Nextjs is a very popular framework build above react and also a frontend+backend framework. It comes with a very interesting routing which resides inside its folder structure.
So let's dive into it.
we are following 'src' directory as our root and a 'app' folder we generally put everything inside this only, whatever we make inside it become a route
we know that a basic frontend route looks like -
localhost:3000contact
in nextjs we need to make sure that we keep the name of folder as name of the route, since it is a framework therefore a lot depends on the names .To create a route for contact we will create a folder named 'contact' inside the app folder and a file page.tsx/jsx inside it this page.tsx is common for all the routes
Creating API's in nextjs
To create a api we will create an api folder and the folder inside it will become the name of the route for backend api's , followed by a common file route.ts similar to page.tsx for frontend folders.
