Server-side state passing in NextJS - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is server-side state passing in Next.js?

It means sending data from the server to the client during page rendering, so the page loads with the needed information already available.

beginner

Which Next.js function is commonly used to fetch data on the server before rendering a page?

getServerSideProps is used to fetch data on the server at request time and pass it as props to the page component.

intermediate

How does getServerSideProps help with SEO?

Because data is fetched on the server and included in the HTML sent to the browser, search engines can see the full content immediately.

intermediate

What is the difference between getServerSideProps and getStaticProps in Next.js?

getServerSideProps runs on every request to fetch fresh data, while getStaticProps runs at build time to generate static pages.

advanced

Why should you avoid putting sensitive information directly in the props returned by getServerSideProps?

Because props are sent to the client and can be seen by users, sensitive data should be kept secure and not exposed in props.

Which Next.js function fetches data on the server for each request?

A useEffect

B getStaticProps

C getServerSideProps

D getInitialProps

getServerSideProps runs on the server at every request to fetch data.

What does server-side state passing improve in a Next.js app?

A Page load speed and SEO

B Client-side animations

C Browser caching

D CSS styling

Passing state from server helps pages load faster with data and improves SEO by sending full HTML.

Where is the data returned by getServerSideProps available?

A As props in the page component

B Only in the browser console

C In the CSS files

D In the database

Data returned by getServerSideProps is passed as props to the page component.

Which method runs only once at build time in Next.js?

A getInitialProps

B getStaticProps

C useEffect

D getServerSideProps

getStaticProps runs once at build time to generate static pages.

Why avoid sending sensitive data in server-side props?

A Props cannot be accessed by the client

B Props are encrypted automatically

C Props are stored only on the server

D Props are visible to users in the browser

Props are sent to the client and can be viewed, so sensitive data should not be included.

Explain how server-side state passing works in Next.js and why it is useful.

Think about how data is prepared before the page reaches the browser.

Describe the difference between getServerSideProps and getStaticProps in Next.js.

Consider when the data is fetched and how often.