I recently created a Next.js app using the CLI, and when I tried to run the development server with npm run dev, I encountered this error: You are using Node.js 18.15.0. For Next.js, Node.js version >= 18.17.0 is required. However,…
So I use Chakra in my Nextjs 13 project, I have this code: const Home = () => { const color = useColorModeValue("telegram.500", "telegram.400"); return <div>something here</div> } I get this error: Error: (0 , _chakra_ui_react__WEBPACK_IMPORTED_MODULE_2__.useColorModeValue) is not a function…
I'm working on a Next.js API route to handle user registration. The code is supposed to check if a username is already taken and return an appropriate response. However, I'm encountering an issue with the Response.json method. import dbConnect from…
In my nextjs app, I am trying to fetch data by using async await mechanism like this export const getHomeData = async (tokenCalled4PublicApis: string) => { try { // const all = getCookie('XSRF-TOKEN', { cookies }); // console.log('all cookies', all);…
I have a theme switch toggle on the top AppBar which is a client component. The main layout is SSR and uses the nextjs App router. It has theme settings <ThemeProvider theme={lightOrDarkTheme}>. Prior to App router/SSR I was able to…
For this question I have created the following demo Next.js application using the App directory: It has a standard RootLayout in app/layout.tsx. It has a nested Layout in a route group app/(app)/layout.tsx. This layout contains <nav />. It has two…
I have been following a tutorial which uses the /pages directory, however, the newer versions of NextJS are using the /app directory. How to adapt the following pages into the new behavior. /pages/index.tsx import Head from "next/head"; import { useState…
Ok. So. I'm building a simple e-commerce site using Next.js (version 13.4) and React; I am using the app router and server actions. I've successfully integrated the PayPal SDK for payments. Right now, I'm using react-paypal-js to render the buttons…
I'm working on a Next.js 14 project and I need to fetch data in a client component. I've come across two different methods and I'm unsure which one is the best practice. Method 1: useEffect with an Async Function and…
I have a Next.js project where users can upload properties and apply various filters such as amenities, minPrice, maxPrice, etc. I created a custom hook to reset specific query parameters when the user clicks a "Reset Filter" button. However, after…