fetching data

• APIs
• databases

Route handlers

• you can create API endpoints using route handlers (docs) directly within your Next.js application
  • ideal for full-stack Next.js development where you want to handle data fetching and manipulation on the server-side within the same project
• in the app/api directory
  • functions that run on the server and define the backend API for your app
  • handles http requests (get, post, put, delete, etc)
• purpose
  • data fetching for client components

Database queries

• For relational databases like Postgres, you can do this with SQL or with an ORM
• cases where you need to write database queries
  • creating your API endpoints, you need to write logic to interact with your database
  • If you are using React Server Components (fetching data on the server), you can skip the API layer, and query your database directly without risking exposing your database secrets to the client

things to be aware of

1. The data requests are unintentionally blocking each other, creating a Request waterfall
   • do parallel data fetching
     • Promise.all() or Promise.allSettled()
     • u can start executing all data fetches at the same time, which is faster than waiting for each request to complete in a waterfall
2. By default, Next.js prerenders routes to improve performance, this is called Static Rendering. So if your data changes, it won’t be reflected in your dashboard
   • static rendering is the default