React Data Fetching

A repository to showcase different ways to fetch data in React.

• 0-json-server - backend server for the apps - pnpm serve

Single Page Applications (Client-Side Only)

• 1-1-vite-componentdidmount - pnpm dev1-1 http://localhost:3311/
• 1-2-vite-useeffect - pnpm dev1-2 http://localhost:3312/
• 1-3-vite-reactquery - pnpm dev1-3 http://localhost:3313/
• 1-4-vite-reactquery-hooks - pnpm dev1-4 http://localhost:3314/
• 1-5-vite-reactquery-query-options - pnpm dev1-5 http://localhost:3315/
• 1-6-vite-tanstack-router - pnpm dev1-6 http://localhost:3316/
• 1-7-vite-tanstack-router-loaders - pnpm dev1-7 http://localhost:3317/
• 1-8-vite-tanstack-router-file-based-routing - pnpm dev1-8 http://localhost:3318/
• 1-9-astro-react-spa - pnpm dev1-9 http://localhost:3319/

Static Site Generation (SSG)

• 2-1-nextjs-ssg - pnpm dev2-1 http://localhost:3321/
• 2-2-astro-ssg - pnpm dev2-2 http://localhost:3322/
• 2-3-astro-react-ssg - pnpm dev2-3 http://localhost:3323/

Server-Side Rendering (SSR)

• 3-1-nextjs-ssr - pnpm dev3-1 http://localhost:3331/
• 3-2-remix-ssr - pnpm dev3-2 http://localhost:3332/
• 3-3-sveltekit-ssr - pnpm dev3-3 http://localhost:3333/
• 3-4-astro-ssr - pnpm dev3-4 http://localhost:3334/
• 3-5-tanstack-start-ssr - pnpm dev3-5 http://localhost:3335/

HTML Streaming (RSC / Astro Server Islands)

• 4-1-nextjs-rsc - pnpm dev4-1 http://localhost:3341/
• 4-2-nextjs-rsc-react-query - pnpm dev4-2 http://localhost:3342/
• 4-3-nextjs-rsc-react-query-streaming - pnpm dev4-3 http://localhost:3343/
• 4-4-astro-server-islands - pnpm dev4-4 http://localhost:3344/