docs/
└── tutorials/
└── nextjs/
├── index.mdx
├── 01-introduction/
│ ├── what-is-nextjs.mdx
│ ├── why-use-nextjs.mdx
│ ├── nextjs-features.mdx
│ ├── nextjs-vs-react.mdx
│ ├── nextjs-architecture.mdx
│ ├── app-router-vs-pages-router.mdx
│ └── nextjs-rendering-strategies.mdx
├── 02-prerequisites/
│ ├── html-css-and-javascript.mdx
│ ├── modern-javascript.mdx
│ ├── react-fundamentals.mdx
│ ├── jsx-and-tsx.mdx
│ ├── react-components-and-props.mdx
│ ├── react-state-and-hooks.mdx
│ └── typescript-for-nextjs.mdx
├── 03-environment-setup/
│ ├── install-nodejs.mdx
│ ├── setup-vscode.mdx
│ ├── install-nextjs.mdx
│ ├── create-nextjs-project.mdx
│ ├── configure-typescript.mdx
│ ├── configure-tailwind-css.mdx
│ └── run-development-server.mdx
├── 04-project-structure/
│ ├── nextjs-directory-layout.mdx
│ ├── app-directory.mdx
│ ├── public-directory.mdx
│ ├── package-json-explained.mdx
│ ├── next-config.mdx
│ ├── environment-files.mdx
│ └── conventions-and-file-naming.mdx
├── 05-routing-and-navigation/
│ ├── file-system-routing.mdx
│ ├── pages-and-layouts.mdx
│ ├── nested-routes.mdx
│ ├── dynamic-route-segments.mdx
│ ├── catch-all-routes.mdx
│ ├── route-groups.mdx
│ ├── private-folders.mdx
│ ├── navigation-with-link.mdx
│ ├── usepathname-and-useparams.mdx
│ ├── redirects-and-not-found.mdx
│ ├── loading-ui.mdx
│ └── parallel-and-intercepting-routes.mdx
├── 06-react-server-and-client-components/
│ ├── server-components-explained.mdx
│ ├── client-components-explained.mdx
│ ├── use-client-directive.mdx
│ ├── component-boundaries.mdx
│ ├── passing-serializable-props.mdx
│ ├── server-and-client-composition.mdx
│ ├── client-side-interactivity.mdx
│ └── common-component-boundary-errors.mdx
├── 07-styling-and-ui/
│ ├── global-css.mdx
│ ├── css-modules.mdx
│ ├── tailwind-css.mdx
│ ├── responsive-design.mdx
│ ├── fonts-with-next-font.mdx
│ ├── images-with-next-image.mdx
│ ├── component-libraries.mdx
│ ├── design-systems.mdx
│ └── dark-mode-and-theming.mdx
├── 08-data-fetching/
│ ├── data-fetching-overview.mdx
│ ├── fetch-in-server-components.mdx
│ ├── async-server-components.mdx
│ ├── fetching-from-external-apis.mdx
│ ├── loading-and-error-states.mdx
│ ├── parallel-and-sequential-fetching.mdx
│ ├── request-deduplication.mdx
│ ├── client-side-data-fetching.mdx
│ ├── pagination-and-filtering.mdx
│ └── data-validation-with-zod.mdx
├── 09-rendering-and-caching/
│ ├── static-rendering.mdx
│ ├── dynamic-rendering.mdx
│ ├── server-side-rendering.mdx
│ ├── static-site-generation.mdx
│ ├── streaming-and-suspense.mdx
│ ├── cache-components-and-caching.mdx
│ ├── revalidation-and-invalidation.mdx
│ ├── client-router-cache.mdx
│ ├── cache-debugging.mdx
│ └── rendering-strategy-selection.mdx
├── 10-server-actions-and-mutations/
│ ├── server-functions-overview.mdx
│ ├── server-actions-fundamentals.mdx
│ ├── form-submissions.mdx
│ ├── useactionstate.mdx
│ ├── usetransition.mdx
│ ├── optimistic-updates.mdx
│ ├── server-side-validation.mdx
│ ├── mutation-error-handling.mdx
│ └── revalidate-after-mutations.mdx
├── 11-route-handlers-and-api-development/
│ ├── route-handlers-fundamentals.mdx
│ ├── get-post-put-and-delete.mdx
│ ├── request-and-response-objects.mdx
│ ├── query-parameters.mdx
│ ├── dynamic-route-handlers.mdx
│ ├── request-validation.mdx
│ ├── api-error-handling.mdx
│ ├── cors-and-api-security.mdx
│ └── api-documentation.mdx
├── 12-forms-and-validation/
│ ├── react-forms-in-nextjs.mdx
│ ├── controlled-and-uncontrolled-inputs.mdx
│ ├── server-side-form-validation.mdx
│ ├── client-side-validation.mdx
│ ├── zod-and-typescript.mdx
│ ├── accessible-form-errors.mdx
│ ├── file-uploads.mdx
│ └── secure-form-submissions.mdx
├── 13-database-and-orm/
│ ├── database-integration-overview.mdx
│ ├── postgresql-setup.mdx
│ ├── prisma-orm.mdx
│ ├── drizzle-orm.mdx
│ ├── database-schema-design.mdx
│ ├── migrations-and-seeding.mdx
│ ├── queries-and-transactions.mdx
│ ├── connection-pooling.mdx
│ ├── server-only-database-access.mdx
│ └── database-error-handling.mdx
├── 14-authentication-and-authorization/
│ ├── authentication-fundamentals.mdx
│ ├── authentication-library-selection.mdx
│ ├── login-and-registration.mdx
│ ├── sessions-and-cookies.mdx
│ ├── oauth-and-social-login.mdx
│ ├── route-protection.mdx
│ ├── authorization-and-permissions.mdx
│ ├── server-side-session-validation.mdx
│ ├── secure-password-storage.mdx
│ └── authentication-security-checklist.mdx
├── 15-state-management/
│ ├── react-state-in-nextjs.mdx
│ ├── context-api.mdx
│ ├── zustand-integration.mdx
│ ├── redux-toolkit-integration.mdx
│ ├── url-state-and-search-params.mdx
│ ├── server-state-vs-client-state.mdx
│ └── state-management-best-practices.mdx
├── 16-metadata-seo-and-content/
│ ├── metadata-api.mdx
│ ├── dynamic-metadata.mdx
│ ├── open-graph-and-social-images.mdx
│ ├── sitemap-generation.mdx
│ ├── robots-txt.mdx
│ ├── canonical-urls.mdx
│ ├── structured-data.mdx
│ ├── mdx-and-content-collections.mdx
│ └── seo-audit-checklist.mdx
├── 17-performance-and-optimization/
│ ├── core-web-vitals.mdx
│ ├── image-optimization.mdx
│ ├── font-optimization.mdx
│ ├── code-splitting.mdx
│ ├── lazy-loading-components.mdx
│ ├── bundle-analysis.mdx
│ ├── reducing-client-javascript.mdx
│ ├── performance-profiling.mdx
│ └── production-performance-checklist.mdx
├── 18-security-and-reliability/
│ ├── nextjs-security-fundamentals.mdx
│ ├── server-side-secrets.mdx
│ ├── environment-variable-security.mdx
│ ├── xss-and-safe-rendering.mdx
│ ├── csrf-and-origin-validation.mdx
│ ├── rate-limiting.mdx
│ ├── authorization-in-server-functions.mdx
│ ├── secure-redirects.mdx
│ └── dependency-security.mdx
├── 19-testing-and-code-quality/
│ ├── testing-strategy.mdx
│ ├── vitest-setup.mdx
│ ├── react-testing-library.mdx
│ ├── component-testing.mdx
│ ├── server-component-testing.mdx
│ ├── api-route-testing.mdx
│ ├── end-to-end-testing-with-playwright.mdx
│ ├── mock-data-and-test-fixtures.mdx
│ ├── eslint-and-formatting.mdx
│ └── continuous-integration.mdx
├── 20-advanced-nextjs/
│ ├── middleware-and-request-interception.mdx
│ ├── edge-and-nodejs-runtimes.mdx
│ ├── internationalization.mdx
│ ├── multi-tenant-applications.mdx
│ ├── background-jobs-and-queues.mdx
│ ├── webhooks.mdx
│ ├── streaming-large-responses.mdx
│ ├── progressive-enhancement.mdx
│ └── migrating-from-pages-router.mdx
├── 21-deployment-and-devops/
│ ├── production-builds.mdx
│ ├── deployment-environments.mdx
│ ├── deploy-to-vercel.mdx
│ ├── self-hosted-deployment.mdx
│ ├── dockerize-nextjs.mdx
│ ├── reverse-proxy-and-cdn.mdx
│ ├── ci-cd-with-github-actions.mdx
│ ├── environment-configuration.mdx
│ ├── logging-and-monitoring.mdx
│ └── production-deployment-checklist.mdx
├── 22-pages-router/
│ ├── pages-directory-overview.mdx
│ ├── file-based-routing.mdx
│ ├── getstaticprops.mdx
│ ├── getserversideprops.mdx
│ ├── getstaticpaths.mdx
│ ├── api-routes.mdx
│ ├── custom-app-and-document.mdx
│ └── pages-router-migration.mdx
├── 23-projects/
│ ├── personal-portfolio.mdx
│ ├── markdown-blog.mdx
│ ├── weather-dashboard.mdx
│ ├── task-management-app.mdx
│ ├── ecommerce-storefront.mdx
│ ├── admin-dashboard.mdx
│ ├── authentication-platform.mdx
│ └── production-capstone.mdx
├── reference/
│ ├── app-router-file-conventions.mdx
│ ├── nextjs-directives-cheatsheet.mdx
│ ├── rendering-and-caching-reference.mdx
│ ├── environment-variables-reference.mdx
│ ├── common-errors-and-solutions.mdx
│ ├── glossary.mdx
│ └── official-resources.mdx
└── assets/
├── images/
├── diagrams/
└── examples/