This was the way to do it using Pages Router import { useRouter } from "next/router"; import React from "react"; function ShowroomListings({}) { const router = useRouter(); const { listingId } = router.query as { listingId: string }; return <div>This…
I was trying to update metadata dynamically in NextJS 13. For this I have a rest api as backend that sends metadata like title, description, keywords, images etc . My goal was, by this approach I can update the sites…
I'm learning the new App router using NextJS 13.4 and have come across an error when attempting to make an external api call. I actually receive all of the data properly from Airtable but because Next throws this error it…
I am using next js 13 route handler to get a login form data . I think I should be able to get it using formData method but it returns an empty object. My login page in app/login/page.jsx: export default…
I would like to add fontawesome to my nextjs 13 project. I'm trying to implement solution #3 which was asked a long time ago. I've tried the solution in the fontawesome documentation as well. I'm just starting out with nextjs…
I am using Next.js version 13.4.4 and have an endpoint at http://localhost:5000/logout. In my src/app/logout/route.tsx file, I have the following code: import { NextRequest, NextResponse } from "next/server"; export async function POST(req: NextRequest) { return new NextResponse("POST: /logout"); } Now,…
I'm currently working with Next.js and using the fetch method to retrieve data: const res = await fetch(`${process.env.url}/test`, { cache: 'no-store', }) As I understand it, specifying cache: 'no-store' should force a new data fetch each time a user loads…
I want to link to just a plain css file in my Next 13 app, but adding it to a Head component does nothing. I also tried creating a custom _document both in app and pages, and that also did…
My NextJS 13 app isn't building and is returning a type error but it is completely working on development environment the type error is shown in this file import NextAuth, { AuthOptions } from "next-auth"; import GoogleProvider from "next-auth/providers/google" export…
I have a server component ChatList, that fetches data from the database and displays it: // server component import Link from "next/link"; import db from "@/prisma"; export const ChatList = async () => { const chats = await db.chat.findMany(); return…