When implementing a query or mutation using React Query in Next.js 13-14, is it acceptable to substitute an actual function with a server action?
When implementing a query or mutation using React Query in Next.js 13-14, is it acceptable to substitute an actual function with a server action?
Yes, I have experimented with it and found success. The key is to not call the queryFn directly; instead, encase it within an async function initially.
I am currently experimenting with setting up a nextjs index.tsx page that will display a specific component if the user is authenticated, and another one if they are not. While I have successfully rendered the component for non-authenticated users, I am f ...
Recently, I encountered an issue with my API route handler: import { NextRequest, NextResponse } from "next/server"; import dbConnect from "@/lib/dbConnect"; import User from "@/models/User"; interface ErrorMessage { mess ...
Suppose that I have the following file structure: /store/index.ts /store/pants/[slug].ts Is it possible to redirect 404 errors to /store/ so that the user is directed to the parent directory instead of a 404 page? ...
I am experiencing an issue with navigation between my pages. Here is the structure of my app: /app /example /page.tsx /example-2 /page.tsx /pages /test-page.tsx Currently, redirects between example and example-2 are working smoothly without ...
I'm new to Next.js and have a question about database connections. In Express projects, we typically establish the connection in the main file (app.js), but it seems like in Next.js, the database connection needs to be inside the API file. Will this r ...
Although this question has been asked previously, I am struggling to make it work. The backend is sending the file using wb.write('filename.xlsx', res), but on the frontend, I only receive an object response. How can I ensure that the browser dow ...
Having trouble displaying a maintenance message to users based on an environment value. In my .env.local file, I have the following value set: NEXT_PUBLIC_SHOW_MAINTENANCE=true This is how my page is structured: const Index = () => { const showMai ...
In an attempt to address the lack of pagination handling on the backend in this NextJS application, I proposed passing it as query parameters in the URL, like localhost:3000/patients?page=. My initial approach was close: import React, { useEffect } from & ...
In my Next.js application using Ant Design v5, I am working on implementing a dynamic theme toggle to switch between light and dark modes. The issue I'm facing is that the initial theme settings work correctly, but subsequent changes to the isDarkMode ...
After setting up a monorepo for a NextJS + Expo React Native cross-platform application using Solito (), I successfully deployed both web and iOS apps. However, I encountered a build error in the Expo iOS app after accidentally wiping my local repository a ...
Currently, I am facing an issue with a simple map function in React that is supposed to create a set amount of times. {times.map((time) => ( <Pill value={time} handleTimes={handleTimes} key={time} /> ))} The error being thrown i ...
I need to dynamically change the colors based on a hex code retrieved from a database. In my variables.js file: const primaryColor = "#000000"; const secondaryColor = "#ff0000"; const notCheckedColor = "#9CA3AF"; export { primaryColor, secondaryColor, no ...
Table: Director (id, director_name, director_image) Table: movies (id, movie_name, movie_description) Table: movie_director (director_id, movie_id) // Foreign keys: movie_id and director_id const { data, error } = await supabase .from(&a ...
My NextJS app has a dynamic route called posts/[id].js. When the page initially loads, everything works perfectly. However, upon refreshing the page, the dynamically fetched data becomes undefined, resulting in the following error: Server Error TypeErr ...
I have set up a NestJS backend with a NextJS frontend, both hosted separately. NestJS Backend To enable CORS in the backend, I included the following code: app.enableCors({ credentials: true, origin: process.env.FRONTEND_URL }); After checking the CORS ...
In my current project using nextjs, I am dealing with fetching images via an API. Right now, I am receiving the "Full image path" (for example, "https://myurl.com/image/imagename.jpg") without any issue. However, I need to figure out how to fetch the image ...
I have a URL that looks like this: manage/text_U2FsdGVkX1/7AucFzVPX7OpRHb8Dlk/ApiJsTvYroROv4Ds4oshwC+cg3a7Mz/aO This URL needs to be processed by the route/directory /pages/manage/[id] The ID is test_someEncryptedString However, because of the forward s ...
I have developed a website using NextJS. It functions perfectly when I run it through npm run dev, but when I try to build and deploy it on Vercel, I encounter an error stating that it cannot find the module. However, the module is found without any issues ...
Despite scouring numerous StackOverflow questions, I haven't been able to find a solution that fits my specific issue. It seems like there might be a CSS attribute preventing the div from centering properly. Could utilizing flexbox help resolve this? ...
Recently, I started using Next.js and ran into a bit of trouble. Here's the issue: When I'm in the connectToMongo function, my variable is coming through just fine. However, when I switch over to Main/index.tsx, my process.env appears as an emp ...