Stack Overflow
Stack Overflow

Questions tagged [server-side-rendering]

Serverside rendering is a technique for rendering a client-side app on the server.

Rendering a client application on the server results in a faster experience for end users since they do not have to wait for assets to load before they can see and interact with an app. This is accomplished by using isomorphic code: code which is used on both the server and the client.

4406 questions
15
votes
1 answer

react sever-side rendering dealing with `window`, `localStorage`

When server-side rendering a React component that uses window or localStorage these browser global variables, I always need to add if (typeof localStorage !== 'undefined') { // then do stuff } to get rid of those 'localStorage is not defined'…
xiaofan2406
  • 3,250
  • 5
  • 26
  • 34
14
votes
2 answers

Unsupported Server Component type: undefined / next js 13

I ran into some weird behavior in Next js 13 while trying to do a simple action. I have prepared the most simple example showing the problem. I hope you can help me figure out why this is happening. There are 3 components. page: import {Container}…
Roman
  • 175
  • 2
  • 3
  • 15
14
votes
2 answers

Does 'use client' in Next.js 13 root layout make whole routes client component?

I was trying Nextjs 13 with Next-auth and Apollo Client. For that we wrap the root layout with the providers but we also need 'use client' to be specified. I have no problem with the libraries. But what is confusing to me is that nextjs 13 app dir…
A.Anvarbekov
  • 955
  • 1
  • 7
  • 21
14
votes
3 answers

Does Next js production build need node_modules folder in the server?

I am fairly new to Next js and its deployment process. I have recently converted one of my react js projects to Next js in order to advantage of the server-side rendering feature Next js offers. Now comes the deployment time, I figured out the Next…
Lance
  • 231
  • 1
  • 3
  • 9
14
votes
2 answers

mocking server for SSR react app e2e tests with cypress.io

I'm building a single page web application (SPA) with server side rendering (SSR). We have a node backend API which is called both from the node server during SSR and from the browser after initial rendering. I want to write e2e tests that…
sylvain
  • 1,951
  • 2
  • 19
  • 34
14
votes
4 answers

How to deploy an Angular 4 app with server-side rendering on prod server

I've been looking for about 3 hours for hosting an Angular 4 app on a server with "server-side rendering" enabled. For note - I have a AWS server which has Apache installed (Ubuntu). First of all, I already know how can we host an Angular 4 app…
Saumya Rastogi
  • 13,159
  • 5
  • 42
  • 45
13
votes
13 answers

Nuxt 3 SSR: useFetch() returning null on page refresh

(After having edited my original question many times over, I have decided to completely rework it as to make it more clear and succinct. This is in accordance with StackOverflow recommendations.) The setup: Create a new Nuxt 3 project: pnpm dlx nuxi…
wire417
  • 150
  • 1
  • 12
13
votes
2 answers

Search params for server components in Next JS 13 app directory

When using the file structure app -> explore -> page.tsx and using the following code to get the search params: export default function ExplorePage({ searchParams }: { searchParams: { search: string | undefined } }) { const { search } =…
Carl Hugo
  • 131
  • 1
  • 3
13
votes
1 answer

How is server-side rendering compatible with single-page applications?

My problem is that I'm unable to understand how server-side rendering single-page application frameworks like Next.js receive prerendered, full HTML on the front end without having to rewrite the entire page. For example, the nextjs website states…
Lenny Zhou
  • 233
  • 2
  • 5
13
votes
5 answers

ERROR Error: Uncaught (in promise): TypeError: i.BehaviorSubject is not a constructor in Angular 10 SSR

I'm getting this issue after build successfully and run on browser with angular universal Here is my package json : { "name": "ssr", "version": "1.0.0", "private": true, "dependencies": { "@angular/animations": "10.0.5", …
Rahul Nakum
  • 171
  • 1
  • 8
13
votes
2 answers

How to fix `Warning: Text content did not match. Server: "Some Data" Client: "Loading..."`

I'm getting this error on initial load of my SSR application: Warning: Text content did not match. Server: "SOME DATA" Client: "Loading..." How to initialize client side of the app without setting loading flag to true? I’m setting up a SSR with…
rreckonerr
  • 387
  • 1
  • 3
  • 12
13
votes
3 answers

Angular Universal - Pre-render only for web crawlers?

I am intending to user Angular Universal for server side rendering (SSR) but this should only be done for crawlers and bots from selected search engines. What I want is the following schema: source:…
Stefan Falk
  • 23,898
  • 50
  • 191
  • 378
13
votes
2 answers

Angular Universal and external apis

Having searched for angular universal for many days I see there is a lack of information of how actually ServerSideRendering works . Let me guide you through my concerns and help me clarify some blur spots. There are pretty many guides telling you…
Dionisis K
  • 614
  • 5
  • 17
13
votes
1 answer

Conditional redirection in Next.js

Is it possible to conditionally redirect a user to another Url based on cookie value? I know I can inspect cookie on a server & then redirect. But what should I do if a user came through Link. (I can't use Route.push because it's undefined on the…
Yanis Urbis
  • 399
  • 1
  • 4
  • 12
12
votes
6 answers

in NEXTJS Warning: Expected server HTML to contain a matching

I am using nextjs and mui. I am facing a warning when rendering pages. Here is my code. Please help to solve the issue!!! import "../styles/globals.scss"; import { AppProps } from "next/app"; import useGetAuthentication from…
Boburmirzo Muhibullaev
  • 145
  • 1
  • 1
  • 5
1 2 3
…
99 100