alternative to getServerSideProps() for /app router era?
1. why is getServerSideProps() depreciated in nextjs 13.4+ ?
2. what are best practices for data fetching at request time from the server but rendering data on the client component?
2.1 => context: currently working on fetching data on the server with an API key but pushing this data to localstorage, ultimately to have it searchable in a simple search bar. let me know if my logic is wrong here or any improvements or more resources to help me better understand this topic :)
2 Replies
😳
1. if you're talking about when opting for the app router, it's because with server components you have a ´nicer´ api
2. the page component on each route, if you need querying should be an async server component, you can just fetch the data through
Fetch API
or directly querying it through the database, using prisma/drizzle for example,
in order to have the getServerSideProps
behavio (no-cache), you can:
if you're using the Fetch API, just use
if you're not using Fetch API, just add to page.tsx
:
All this info is available here: https://nextjs.org/docs/app/building-your-application/data-fetching/fetching
2.1
since the results came from the server, you shouldn't need push to them into local storage, just save the search in a state, and then calculate the filtered items at rendering, like this: https://react.dev/learn/thinking-in-react