43,078
questions
-1
votes
0
answers
10
views
How to Cache API Data for a Landing Page in Next.js and Only Re-fetch When Admin Updates the Data?
I'm working on a Next.js application where I need to display data on a landing page. The data is managed by an admin and doesn't change frequently. I want to avoid making an API call every time a user ...
-2
votes
0
answers
9
views
"PrismaClient AdapterError: Not Configured for Edge Runtime"
`[auth][error] AdapterError: Read more at https://errors.authjs.dev#adaptererror
[auth][cause]: Error: PrismaClient is not configured to run in Edge Runtime (Vercel Edge Functions, Vercel Edge ...
0
votes
1
answer
9
views
next-auth v4 forwards to /store
I am not setting a callbackURL and I do have NEXT_AUTH_URL defined but it does not include the substring store and neither do I have any code pointing to /store in my app and neither do I have a store ...
- 2,387
0
votes
0
answers
16
views
Vercel Serverless Functions Size Exceeds 250 MB - How to Optimize NPM Packages
I'm working on a small puzzle app that uses Python as the backend and a React frontend with NextJS.
While I'm trying to deploy on Vercel, I fail with the error of "Serverless Function has ...
0
votes
0
answers
6
views
Problem with redirecting the user after sucessful login on Next.js with Next-auth v5
I'm making an app using Next.js 14.2.5, tRPC and Next-auth 5.0.0-beta.20 (or Auth.js) for the authentication. After the user logs in the app i want to redirect him to another page, however, when i try ...
- 1
0
votes
0
answers
13
views
How to deploy Node.js server on Vercel properly?
I am new in Next js and also in MERN stack; recently I have completed a mern stack LMS (Learning Management System) website using Next js for client (front end) and Node.js , Express, TypeScript for ...
0
votes
0
answers
8
views
Next-themes doesn't change theme
I am using next-themes in my project to enable dark-mode. Theme changes based on the system preferences due to attribute="class". The icons change on click but the theme doesn't.
==> _app....
- 1
0
votes
0
answers
11
views
useActionState use in Next server actions
I am trying to use the new useActionState from React 19 in my Next js project using a form.
I managed to import it by installing the latest releases :
//package.json
"next": "v15.0.0-...
- 972
0
votes
0
answers
12
views
Next.js suspense server-side doesn't work
I'm encountering an issue with Next.js 14. I want to load an Async component in the Page component. In the component, I simulate a server delay of 5 seconds. However, what happens is that I end up ...
- 3
-1
votes
1
answer
21
views
Generating static pages fails at build time
I am new to nextjs. My application has pages that call the backend API using axios. The application is a template and it came with mocked API. For production, obviously I want to disable mocking and ...
0
votes
1
answer
18
views
Passing data from a component to children inside a layout
Going through the tutorial for NextJS, their provided the following Layout
import SideNav from '@/app/ui/dashboard/sidenav';
export default function Layout({ children }: { children: React.ReactNode }...
- 93
0
votes
0
answers
14
views
Why am I getting a 500 error when sending emails using Resend in my Next.js API route?
I'm building a Next.js application where I'm trying to send emails using the Resend service within an API route. However, I keep encountering a 500 error, and I'm not sure what's causing it. Below are ...
- 31
0
votes
0
answers
11
views
NeonDB Fetch Error with drizzleORM: Cannot connect to neon database from Next js 14 app to fetch data but connects for mutations
I'm trying to fetch data from my db in a server component but I keep getting this connection error
⨯ NeonDbError: Error connecting to database: fetch failed
at async page (./src/app/tailor-cv/job/[id]/...
- 29
1
vote
0
answers
17
views
implementing Incremental Static Regeneration(ISR) without keyword "fetch"
I've tried many ways to make my one page in this web app build in ISR- this app uses Google Spreadsheets as a database and the user fills out the spreadsheet, and it populates the page. I want it to ...
- 13
-1
votes
0
answers
22
views
How to move a file from Google Drive to Firebase storage? [closed]
I have an app (NextJS, TypeScript) that allows you to upload your files (images, pdfs, texts) and then we do some AI magic on them to help solve a certain usecase (can't talk about that).
However, my ...
0
votes
1
answer
20
views
Why are images not appearing on my nextjs app running on Ubuntu server?
I've got a weird issue with my nextjs app on a ubuntu box. I'm using nginx. I have the uploads folder in the nginx config for the site:
location /uploads {
alias /home/ubuntu/staging/thomson-...
- 970
0
votes
0
answers
9
views
How to get online status of my users on my NextJs App
My NextAuth Option Code is (only the important part)
callbacks: {
async jwt({ token, user }) {
if (user) {
token.id = user.id;
token.email = user.email;
token.role = ...
0
votes
0
answers
12
views
User exists in the Database, but returns null when called
//schema.prisma
model User {
id String @id @default(uuid())
email String
firstName String
...
- 71
0
votes
0
answers
5
views
How to import a monorepo package into an app with hot-reload?
I have a turborepo monorepo with the following structure:
- apps
- a
- packages
- x
The packages/x folder exports some components in a index.tsx file.
The apps/a folder needs to import these ...
- 6,029
0
votes
0
answers
6
views
next-auth loading wrong env info on AWS Amplify
my Nextjs application works as expected on local machine.
See whole project on GitHub
When I run it with npm run dev and access http://localhost:3000/api/auth/providers I can see:
{
google: {
id: &...
- 333
-1
votes
1
answer
46
views
Fetching API/JSON For A NextJS Application
I am creating a NextJs website related to crop disease detection which sends photo and environmental factors to a fastapi python server where the data gets processed and then display that in a ...
- 13
0
votes
0
answers
33
views
<Select> elements not displaying properly after form submission
In my Next.js app, I have a form that calls a server action on submit. When the server action finishes saving the data, it uses revalidatePath() and redirect() to direct the user back to that page.
...
- 9,232
0
votes
0
answers
10
views
LinkedIn and Twitter Not Scraping My Next.js Page
I'm facing a bit of a challenge with getting LinkedIn and Twitter to properly scrape and preview one of my pages built with Next.js. Here’s what’s happening:
The Issue:
LinkedIn Post Inspector: When ...
- 101
0
votes
1
answer
18
views
Firestore error "User document does not exist"
I'm working on a project similar to Linktree and have implemented Firebase for authentication and Firestore for the database. The authentication system is functioning correctly, and user data is being ...
0
votes
0
answers
18
views
Next and Previous button [closed]
how i can add next and previous button for a multiple cards in one card i am using next js and itried multiple things like React paginate and react Slick, but am unable to add it.
Can anyone help me ...
0
votes
0
answers
21
views
Cloudfront causing site score to go down on mobile [closed]
I have a NextJS site that is being cached using Cloudfront.
If I am enabling Cloudfront and then deploying the site and then trying to measure its performance using pagespeed.web.dev it is showing me ...
0
votes
0
answers
13
views
Nextjs middleware exclude homepage from matcher
I'm checking user auth in the middleware and redirecting to a sign in page if not logged in. This works well but I want to exclude the middleware on the homepage which is the root of the site /. I ...
- 1,190
0
votes
0
answers
5
views
Change filter date format of MUI Data Grid
I'm currently working with a Material-UI (MUI) Data Grid and have encountered a challenge with the date format in the filter field. By default, the filter date field seems to display dates in the DD....
- 449
-2
votes
0
answers
20
views
What is the mechanism of to fetch and listen data in React [closed]
I would like to learn best approach to use SSR and CSR in React/NextJS. I watch a lot videos on Youtube about SSR and I learn the basics and theoretical knowledge about the theory of rendering.
Even ...
- 1
0
votes
0
answers
18
views
Next JS app had jwt secret error when 2 applications running together
pages/api/auth/[...nextauth].ts
export const authOptions: NextAuthOptions = {
providers: [
CredentialsProvider({
name: 'Credentials',
credentials: {
...
-1
votes
1
answer
28
views
Next.js access (req) in Server Action
So i have a client side where there's a button. The button calls a Server Action (Server Function) and it all works well. But i can't access the request of the client. Such as if i want to rate limit ...
- 1
0
votes
0
answers
10
views
Images Uploaded to Strapi Are Not Visible in Admin Panel or Frontend
Hello Stack Overflow Community,
I'm experiencing an issue with viewing images uploaded to Strapi. Despite being logged in as a super admin and having connected to PostgreSQL, I am unable to see the ...
0
votes
1
answer
48
views
How to solve "Next Build: Permission Denied" On Server?
So I have a NextJS application running on a server with pm2. I was writing a Github Actions workflow to sync the repo on the server, build the application again and restart the pm2 process. However ...
0
votes
2
answers
34
views
framer-motion gesture animation
i would like to create a framer motion animation in React that removes and element on click and visualizes another element.
Here is an example
example
This is my code:
{!tileOpen ? (
...
- 1
0
votes
0
answers
12
views
How to render specific pages (not entire PDF file) using react-pdf?
I am working on a React project for displaying pdf file as a flipbook using Nextjs and react-pageflip.
'use client'
import { useResizeObserver } from '@wojtekmaj/react-hooks'
import {
ForwardedRef,
...
1
vote
1
answer
22
views
layout remounts when navigating to root
I'm using Nextjs 14.2.5 app router. Per documentation on layouts, "On navigation, layouts preserve state, remain interactive, and do not re-render." When navigating to or between nested ...
- 173
0
votes
1
answer
36
views
How to communicate page properties to the layout in nextjs?
I'm using the app mode in a new nextjs project, and I have the requirement to update the favicon so that it's different for different pages. I am doing this by having a global object like this:
...
- 13.7k
0
votes
1
answer
48
views
Do you need to use Suspense when using async React Server Component inside client component in Next.js?
I'm learning Next.js, and I'm trying to render Server async Component inside client Component:
Gallery.tsx
import { get_images } from '@/utils';
import styles from './Gallery.module.css';
export ...
- 65.7k
-1
votes
4
answers
70
views
I can not make proper use of useState in Nextjs
When the first request is sent, isVoting will be set to "true". In this case, until isVoting is set to "false", another request should not be allowed to be sent. But somehow ...
- 15
0
votes
0
answers
15
views
Challenges with Supporting Server Components Due to Bundling Configuration
I'm facing an issue with bundling my React library using Tsup, specifically when trying to support server components. The previous configuration bundled everything into one file, which caused ...
0
votes
0
answers
13
views
Meta tags are not showing up in the HTML source directly in next js
I'm working on a Next.js project and I'm trying to figure out why meta tags aren't showing up in the page source. Here's the problem I'm running into and the steps I'm taking:
Problem:
Meta tags aren'...
0
votes
0
answers
10
views
Any ideas for how to recreate functionality of iOS Photos app zoomable grid view in React?
building a mobile-friendly web app in React that is supposed to mimic the layout of the iOS Photos app Grid View:
When you pinch in or out to zoom, as the number of columns change, the item you're ...
- 23
0
votes
1
answer
25
views
document is not defined in Next JS Zego cloud
I have been implementing zego cloud to my next js application, it throws error which shows document is not defined
I am using the "use client" in my next js application to access react hooks ...
0
votes
1
answer
31
views
Not getting a return when calling an async function through useTransition() in NextJS
I'm using NextJS 14 with Shadcn for components. I have a component with a form that uses the useTransition hook to send the form data to an action, and then gets a success or error return in the data. ...
0
votes
0
answers
4
views
Properly handle TransformStream on EventSource.close()
I'm trying to set up a SSE mechanism on my NextJS app to send messages from the backend to the client while some data processing is happening on the server.
I have setup a route endpoint like so:
...
- 1,263
-1
votes
1
answer
17
views
Access to XMLHttpRequest at 'http://localhost:3001/auth/register' from origin 'http://localhost:3000' has been blocked by CORS policy:
Hi I am using NestJs to build Api endpoint and NextJs for Authentication system I got this error when submit a form form Nextjs:
Access to XMLHttpRequest at 'http://localhost:3001/auth/register' from ...
0
votes
0
answers
15
views
Prime react nested TabMenu active index not working
I'm using Next.js(14) with the PrimeReact library to create a navigation component with tab menus. I have a main parent tab (like "Manager," "Reviewer," etc.) and each parent tab ...
0
votes
0
answers
18
views
Slow Navigation and Delayed Backend Request in Next.js Using `router.push(href)`
I'm working on a Next.js project and have implemented a SideNav component that dynamically generates navigation items based on the modules returned from an API. Each nav item has an href that is ...
0
votes
0
answers
10
views
Next.js, typescript and PostgreSQL filter for a GenericTable component
I am creating an application in Next.js that uses Typescript. It fetches data from a database table customers and shows it.
I have programmed the table so that it has the following functions
Search
...
- 1,112
0
votes
0
answers
29
views
Trying to add records in RAG vector database Pinecone
Hello All I am trying creating a RAG chatbot, that does a POST request when user clicks add. The purpose of the add, is to add the record in the RAG vector database. I can't seem to format the data ...
- 43