React Server Components is a subset of React.js, it allows loading components from the backend. The components have already been rendered in the backend and can be seamlessly integrated into the running app. This feature is still in experiment.
Questions tagged [react-server-components]
123 questions
0
votes
1 answer
NextJs 13 - how to properly take advantage of SSR with folder structure
I have a question regarding the folder structure for NextJS 13 so to make use of server side rendering by default.
Currently my folder structure for my project is like this:
src/
app/
assets/
theme/
types/
utils/(contains all the api calls and…
michaelNL
- 45
- 4
0
votes
0 answers
Detect React Server Component
Is there a way to determine whether a file or function is being executed as part of a React Server Component or a client component (use client;)?
jantimon
- 36,840
- 23
- 122
- 185
0
votes
0 answers
How to do do error handling when fetching API from next 13 using server side rendering
import React from 'react'
const RightBar = async () => {
let data;
try{
const res = await fetch(`${process.env.NEXTAUTH_URL}/api/trendingtweets`);
data = await res.json();
} catch (error){
return error
…
Jyotishman Goswami
- 11
- 1
0
votes
0 answers
Passing state values from Client component to Server component: Best practices using NextJS 13 and React Server components
I'm working with NextJS 13 and exploring the capabilities of React Server components. In my current scenario, I have a "Client" component responsible for toggling between two different states. Simultaneously, I have a second component that requires…
stephdev
- 29
- 1
- 3
0
votes
0 answers
production and development sites show entirely different things on the same page when fetching (cache issue?)
i have an issue where my deployed site and my localhost are showing two totally different things for the same page.
im not sure if its a next.js caching thing that i dont understand (im using server components) or theres an error in my code…
朦朧状態
- 1
- 1
0
votes
0 answers
Nesting Server Component inside Client Component, and running a script on DOM nodes in Next.JS 13
js developers, I've been searching for this specific usage in the docs and not finding exactly what I was looking for.
I'm trying to integrate the Tailwind Elements Carousel inside a SSG component using Next's Page Router.
I've read in Tailwind…
raaaahman
- 80
- 11
0
votes
0 answers
Swiper in hero section of server component causing too much layout shift
I have used swiper in my hero section of my next.js app. And I have used server components for most of my page. The problem is swiper doesn't have placeholder for this content. So it is causing too much layout shift after loading js file. I cannot…
0
votes
0 answers
Dockerizing Next.js 13 that has dynamic server functions
So I'm trying to dockerize Next.js 13 app router with Nginx for production deployment. To do so, I use static export in my Next.js app. However, as written in the docs…
gidgud
- 71
- 1
- 6
0
votes
1 answer
Next.js 13: How to Automatically Redirect After Image Generation?
I'm working on a Next.js 13 project and have implemented a functionality that allows users to generate images based on their input. The image generation process is handled by the generateImage function, and it successfully generates the image and…
Brayan Cuenca
- 1
- 1
0
votes
0 answers
How to ignore a spurious ReactServerComponentsError error
I have a Next.js project using the App router.
One of my API routes wants to import a function "X" from a library that also happens to import another library that imports useEffect. Function X itself doesn't rely on useEffect, or any of…
0
votes
0 answers
Is there way to use context on Server Component when pass a Server Component as a child prop to a Client Component
I'm developing an applycation by Next.js13.
I want to get datas from DB and display lists with serching function.
I use useContext to manage what I want to search. I want to use this context as query of request to DB.However I can’t do it well.
I…
sugi
- 1
0
votes
0 answers
¿How to pass an in memory access token to a server component? - nextjs 13
I have a refresh token in a cookie, and also an access token in memory.
So, in this client component, i'm gettin the access token, and saving it to a zustand store
"use client";
import Image from "next/image";
import { motion } from…
Diego-mike
- 31
- 4
0
votes
2 answers
How to do an authentication between django and nextjs 13?
Can I build authentication system between django and nextjs 13 ?
If yes, How can I do that ?
I'm really stuck
I wanted to use JWT token based authentication but because nextjs 13 uses server components I didn't
know how and where can I store access…
Saif
- 1
- 1
0
votes
0 answers
How can I use one NextJS util function to get cookies in either a RSC or a client component?
I have a middleware file that makes a GQL request in it (using the library graphql-request) - which I then use to set the default value of a cookie (standard process).
However, I am encountering this issue:
And then when I fix it with the proposed…
Psuedo
- 29
- 8
0
votes
1 answer
make client component layout to server component
I am making a responsive sidebar with headlessui Transition.
"use client";
export default function Layout({ children }: { children: React.ReactNode }) {
const [sidebarOpen, setSidebarOpen] = useState(false);
return (
<>
…
Evilolipop
- 109
- 5