Next.js Discord

Discord Forum

Error: An error occurred in the Server Components render.

Unanswered
Romanian Raven Shepherd Dog posted this in #help-forum
Open in Discord
Romanian Raven Shepherd DogOP
page-163a81697dacd890.js:1 Uncaught (in promise) Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.
i dont know why its giving me this error though i have pretty simple code
HomePage.tsx
import { CreateSection, GetSection } from "./action/action";

export default function HomePage()
{
    const handleGetSections = async () => {
        const response = await GetSection(`${window.location.origin}/api/section/get`);
        console.log(response);
    }

    return (
        <div className='dark:bg-black min-h-screen max-h-auto no-scrollbar overflow-y-auto'>
            <h1 className="text-center text-4xl mt-10">CRUD OPERATION WITH SERVER ACTION</h1>
            <button className="border-none outline-none px-4 py-2 rounded-lg bg-neutral-900" onClick={handleGetSections}>Get Secitons</button>
        </div>
    )
}


action.ts
"use server"

import { revalidatePath } from "next/cache";

export async function GetSection (url : string) 
{
    const response = await fetch(url, {
        method : 'GET',
        cache : 'no-store',
        next : { revalidate : 0 }
    })

    const resJson = await response.json();

    revalidatePath('/');

    return resJson;
}

24 Replies

B33fb0n3
can you provide additional details:
A digest property is included on this error instance which may provide additional details about the nature of the error.
Romanian Raven Shepherd DogOP
@B33fb0n3 please brother help
@Romanian Raven Shepherd Dog <@301376057326567425> please brother help
B33fb0n3
You need to check your server logs for more details. You shared the client logs
Romanian Raven Shepherd DogOP
what server log
where
B33fb0n3
in your server. Where you start your server. For example a terminal, console, ...
Romanian Raven Shepherd DogOP
i depolyed it on vercel
this is the prodcution deploy
B33fb0n3
then check your vercel logs
@Romanian Raven Shepherd Dog Click to see attachment
B33fb0n3
this ^ is client log
vercel logs are your server logs
Romanian Raven Shepherd DogOP
TypeError: fetch failed
at node:internal/deps/undici/undici:12345:11
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async globalThis.fetch (/var/task/.next/server/chunks/638.js:1:36484)
at async i (/var/task/.next/server/app/page.js:3:83080)
at async /var/task/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:16:406
at async rm (/var/task/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:15:6342)
at async rq (/var/task/node_modules/next/dist/compiled/next-server/app-page.runtime.prod.js:18:1249)
at async Y (/var/task/node_modules/next/dist/compiled/next-server/server.runtime.prod.js:16:25520)
at async Q.responseCache.get.routeKind (/var/task/node_modules/next/dist/compiled/next-server/server.runtime.prod.js:17:1025)
at async r2.renderToResponseWithComponentsImpl (/var/task/node_modules/next/dist/compiled/next-server/server.runtime.prod.js:17:507) {
cause: Error: connect ECONNREFUSED 127.0.0.1:3000
at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1605:16)
at TCPConnectWrap.callbackTrampoline (node:internal/async_hooks:130:17) {
errno: -111,
code: 'ECONNREFUSED',
syscall: 'connect',
address: '127.0.0.1',
port: 3000
}
}


the f is this i got it on logs
B33fb0n3
that looks better. It seems like your fetch failed:
TypeError: fetch failed
And that's because of the server seems to be offline:
cause: Error: connect ECONNREFUSED 127.0.0.1:3000
Romanian Raven Shepherd DogOP
man i now feel like i should abort next js
it sucks hard
i have stuck for 4 days right now
Romanian Raven Shepherd DogOP
yes
B33fb0n3
In developement you can't just start by watching a youtube video and follow every step the guy in the video does. That works, until you get an error, but the person in the video not. So start by learning the basics and then one after another. Right now it seems like you are learning React, Nextjs, Typescript, (Libraries like this cart), JSX, (Javascript), CSS, HTML.

That's way to much to start. So, start with the basics: Javascript, CSS, HTML. Then go in the advanced direction: JSX, React, important Libraries. And then go in the OP stuff like: NextJs and Typescript.

I learned all these stuff from this guy: [Codevolution](https://www.youtube.com/@Codevolution)
Very much recommended.

For the beginning I recommend you, you using his crash course, for the topics I wrote down: https://www.youtube.com/watch?v=N8YMl4Ezp4g&list=PLC3y8-rFHvwhuX4qGvFx-wPy_MEi6Jdp7
Please do it, else you won't make it that long in programming
After this playlist you know the basics of webdevelopement and can start big projects like a ecommerce store or even bigger projects

Enjoy the developement journey and best of luck ^^

Of course you can still share you details to get it resolved, but the point will come where you will have an error again
Romanian Raven Shepherd DogOP
your making me a kiddo dude iam a i did fullstack on react i have 2 years of expereince
react js *
Romanian Raven Shepherd DogOP
iam quiting netx