From 2e34bf570285d6c9e5dd6ff69791338debf62be5 Mon Sep 17 00:00:00 2001 From: xiaoyu2er Date: Sun, 8 Jun 2025 05:18:05 +0000 Subject: [PATCH] docs: update nextjs documentation --- .../{04-images.mdx => 05-images.mdx} | 4 +- .../{05-fonts.mdx => 06-fonts.mdx} | 4 +- .../{06-css.mdx => 07-css.mdx} | 4 +- ...dx => 08-server-and-client-components.mdx} | 4 +- ...fetching-data.mdx => 09-fetching-data.mdx} | 0 ...ng.mdx => 10-caching-and-revalidating.mdx} | 4 +- ...updating-data.mdx => 11-updating-data.mdx} | 4 +- ...ror-handling.mdx => 12-error-handling.mdx} | 4 +- ...dering.mdx => 13-partial-prerendering.mdx} | 4 +- ...ages.mdx => 14-metadata-and-og-images.mdx} | 4 +- .../{14-deploying.mdx => 15-deploying.mdx} | 4 +- .../{15-upgrading.mdx => 16-upgrading.mdx} | 4 +- .../01-routing/04-linking-and-navigating.mdx | 322 ------------ .../06-loading-ui-and-streaming.mdx | 197 -------- .../{04-images.mdx => 05-images.mdx} | 4 +- .../{05-fonts.mdx => 06-fonts.mdx} | 4 +- .../{06-css.mdx => 07-css.mdx} | 4 +- ...dx => 08-server-and-client-components.mdx} | 4 +- ...fetching-data.mdx => 09-fetching-data.mdx} | 0 ...ng.mdx => 10-caching-and-revalidating.mdx} | 4 +- ...updating-data.mdx => 11-updating-data.mdx} | 4 +- ...ror-handling.mdx => 12-error-handling.mdx} | 4 +- ...dering.mdx => 13-partial-prerendering.mdx} | 4 +- ...ages.mdx => 14-metadata-and-og-images.mdx} | 4 +- .../{14-deploying.mdx => 15-deploying.mdx} | 4 +- .../{15-upgrading.mdx => 16-upgrading.mdx} | 4 +- .../01-routing/04-linking-and-navigating.mdx | 322 ------------ .../06-loading-ui-and-streaming.mdx | 197 -------- .../02-project-structure.mdx | 2 +- .../03-layouts-and-pages.mdx | 5 +- .../04-linking-and-navigating.mdx | 464 ++++++++++++++++++ .../{04-images.mdx => 05-images.mdx} | 0 .../{05-fonts.mdx => 06-fonts.mdx} | 0 .../{06-css.mdx => 07-css.mdx} | 0 ...dx => 08-server-and-client-components.mdx} | 0 ...fetching-data.mdx => 09-fetching-data.mdx} | 2 +- ...ng.mdx => 10-caching-and-revalidating.mdx} | 0 ...updating-data.mdx => 11-updating-data.mdx} | 0 ...ror-handling.mdx => 12-error-handling.mdx} | 0 ...dering.mdx => 13-partial-prerendering.mdx} | 0 ...ages.mdx => 14-metadata-and-og-images.mdx} | 0 .../{14-deploying.mdx => 15-deploying.mdx} | 0 .../{15-upgrading.mdx => 16-upgrading.mdx} | 0 .../docs/01-app/02-guides/authentication.mdx | 4 +- .../en/docs/01-app/02-guides/lazy-loading.mdx | 2 +- .../migrating/app-router-migration.mdx | 2 +- .../migrating/from-create-react-app.mdx | 4 +- .../01-app/02-guides/migrating/from-vite.mdx | 4 +- .../01-app/02-guides/production-checklist.mdx | 10 +- .../en/docs/01-app/02-guides/self-hosting.mdx | 2 +- .../02-guides/single-page-applications.mdx | 2 +- .../en/docs/01-app/02-guides/videos.mdx | 2 +- .../01-routing/04-linking-and-navigating.mdx | 320 ------------ .../06-loading-ui-and-streaming.mdx | 195 -------- .../en/docs/01-app/04-deep-dive/caching.mdx | 8 +- .../05-api-reference/02-components/form.mdx | 8 +- .../05-api-reference/02-components/link.mdx | 4 +- .../03-file-conventions/default.mdx | 2 +- .../03-file-conventions/layout.mdx | 2 +- .../03-file-conventions/loading.mdx | 143 +++++- .../03-file-conventions/parallel-routes.mdx | 4 +- .../route-segment-config.mdx | 2 +- .../04-functions/redirect.mdx | 20 +- .../04-functions/use-link-status.mdx | 2 +- .../04-functions/use-router.mdx | 6 +- .../04-functions/use-search-params.mdx | 6 +- .../05-config/01-next-config-js/appDir.mdx | 2 +- .../01-next-config-js/devIndicators.mdx | 2 +- .../01-next-config-js/staleTimes.mdx | 2 +- .../docs/01-app/05-api-reference/07-edge.mdx | 2 +- .../01-app/05-api-reference/08-turbopack.mdx | 2 + .../02-rendering/05-client-side-rendering.mdx | 3 +- .../{04-images.mdx => 05-images.mdx} | 4 +- .../{05-fonts.mdx => 06-fonts.mdx} | 4 +- .../{06-css.mdx => 07-css.mdx} | 4 +- ...dx => 08-server-and-client-components.mdx} | 4 +- ...fetching-data.mdx => 09-fetching-data.mdx} | 0 ...ng.mdx => 10-caching-and-revalidating.mdx} | 4 +- ...updating-data.mdx => 11-updating-data.mdx} | 4 +- ...ror-handling.mdx => 12-error-handling.mdx} | 4 +- ...dering.mdx => 13-partial-prerendering.mdx} | 4 +- ...ages.mdx => 14-metadata-and-og-images.mdx} | 4 +- .../{14-deploying.mdx => 15-deploying.mdx} | 4 +- .../{15-upgrading.mdx => 16-upgrading.mdx} | 4 +- .../01-routing/04-linking-and-navigating.mdx | 322 ------------ .../06-loading-ui-and-streaming.mdx | 197 -------- .../{04-images.mdx => 05-images.mdx} | 4 +- .../{05-fonts.mdx => 06-fonts.mdx} | 4 +- .../{06-css.mdx => 07-css.mdx} | 4 +- ...dx => 08-server-and-client-components.mdx} | 4 +- ...fetching-data.mdx => 09-fetching-data.mdx} | 0 ...ng.mdx => 10-caching-and-revalidating.mdx} | 4 +- ...updating-data.mdx => 11-updating-data.mdx} | 4 +- ...ror-handling.mdx => 12-error-handling.mdx} | 4 +- ...dering.mdx => 13-partial-prerendering.mdx} | 4 +- ...ages.mdx => 14-metadata-and-og-images.mdx} | 4 +- .../{14-deploying.mdx => 15-deploying.mdx} | 4 +- .../{15-upgrading.mdx => 16-upgrading.mdx} | 4 +- .../01-routing/04-linking-and-navigating.mdx | 322 ------------ .../06-loading-ui-and-streaming.mdx | 197 -------- .../{04-images.mdx => 05-images.mdx} | 4 +- .../{05-fonts.mdx => 06-fonts.mdx} | 4 +- .../{06-css.mdx => 07-css.mdx} | 4 +- ...dx => 08-server-and-client-components.mdx} | 4 +- ...fetching-data.mdx => 09-fetching-data.mdx} | 0 ...ng.mdx => 10-caching-and-revalidating.mdx} | 4 +- ...updating-data.mdx => 11-updating-data.mdx} | 4 +- ...ror-handling.mdx => 12-error-handling.mdx} | 4 +- ...dering.mdx => 13-partial-prerendering.mdx} | 4 +- ...ages.mdx => 14-metadata-and-og-images.mdx} | 4 +- .../{14-deploying.mdx => 15-deploying.mdx} | 4 +- .../{15-upgrading.mdx => 16-upgrading.mdx} | 4 +- .../01-routing/04-linking-and-navigating.mdx | 322 ------------ .../06-loading-ui-and-streaming.mdx | 197 -------- .../{04-images.mdx => 05-images.mdx} | 4 +- .../{05-fonts.mdx => 06-fonts.mdx} | 4 +- .../{06-css.mdx => 07-css.mdx} | 4 +- ...dx => 08-server-and-client-components.mdx} | 4 +- ...fetching-data.mdx => 09-fetching-data.mdx} | 0 ...ng.mdx => 10-caching-and-revalidating.mdx} | 4 +- ...updating-data.mdx => 11-updating-data.mdx} | 4 +- ...ror-handling.mdx => 12-error-handling.mdx} | 4 +- ...dering.mdx => 13-partial-prerendering.mdx} | 4 +- ...ages.mdx => 14-metadata-and-og-images.mdx} | 4 +- .../{14-deploying.mdx => 15-deploying.mdx} | 4 +- .../{15-upgrading.mdx => 16-upgrading.mdx} | 4 +- .../01-routing/04-linking-and-navigating.mdx | 322 ------------ .../06-loading-ui-and-streaming.mdx | 197 -------- .../{04-images.mdx => 05-images.mdx} | 4 +- .../{05-fonts.mdx => 06-fonts.mdx} | 4 +- .../{06-css.mdx => 07-css.mdx} | 4 +- ...dx => 08-server-and-client-components.mdx} | 4 +- ...fetching-data.mdx => 09-fetching-data.mdx} | 0 ...ng.mdx => 10-caching-and-revalidating.mdx} | 4 +- ...updating-data.mdx => 11-updating-data.mdx} | 4 +- ...ror-handling.mdx => 12-error-handling.mdx} | 4 +- ...dering.mdx => 13-partial-prerendering.mdx} | 4 +- ...ages.mdx => 14-metadata-and-og-images.mdx} | 4 +- .../{14-deploying.mdx => 15-deploying.mdx} | 4 +- .../{15-upgrading.mdx => 16-upgrading.mdx} | 4 +- .../01-routing/04-linking-and-navigating.mdx | 322 ------------ .../06-loading-ui-and-streaming.mdx | 197 -------- .../{04-images.mdx => 05-images.mdx} | 4 +- .../{05-fonts.mdx => 06-fonts.mdx} | 4 +- .../{06-css.mdx => 07-css.mdx} | 4 +- ...dx => 08-server-and-client-components.mdx} | 4 +- ...fetching-data.mdx => 09-fetching-data.mdx} | 0 ...ng.mdx => 10-caching-and-revalidating.mdx} | 4 +- ...updating-data.mdx => 11-updating-data.mdx} | 4 +- ...ror-handling.mdx => 12-error-handling.mdx} | 4 +- ...dering.mdx => 13-partial-prerendering.mdx} | 4 +- ...ages.mdx => 14-metadata-and-og-images.mdx} | 4 +- .../{14-deploying.mdx => 15-deploying.mdx} | 4 +- .../{15-upgrading.mdx => 16-upgrading.mdx} | 4 +- .../01-routing/04-linking-and-navigating.mdx | 322 ------------ .../06-loading-ui-and-streaming.mdx | 198 -------- 156 files changed, 841 insertions(+), 4904 deletions(-) rename apps/docs/content/ar/docs/01-app/01-getting-started/{04-images.mdx => 05-images.mdx} (98%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{05-fonts.mdx => 06-fonts.mdx} (98%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{06-css.mdx => 07-css.mdx} (99%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{07-server-and-client-components.mdx => 08-server-and-client-components.mdx} (99%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{08-fetching-data.mdx => 09-fetching-data.mdx} (100%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{09-caching-and-revalidating.mdx => 10-caching-and-revalidating.mdx} (99%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{10-updating-data.mdx => 11-updating-data.mdx} (99%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{11-error-handling.mdx => 12-error-handling.mdx} (99%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{12-partial-prerendering.mdx => 13-partial-prerendering.mdx} (99%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{13-metadata-and-og-images.mdx => 14-metadata-and-og-images.mdx} (99%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{14-deploying.mdx => 15-deploying.mdx} (98%) rename apps/docs/content/ar/docs/01-app/01-getting-started/{15-upgrading.mdx => 16-upgrading.mdx} (95%) delete mode 100644 apps/docs/content/ar/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx delete mode 100644 apps/docs/content/ar/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx rename apps/docs/content/de/docs/01-app/01-getting-started/{04-images.mdx => 05-images.mdx} (98%) rename apps/docs/content/de/docs/01-app/01-getting-started/{05-fonts.mdx => 06-fonts.mdx} (98%) rename apps/docs/content/de/docs/01-app/01-getting-started/{06-css.mdx => 07-css.mdx} (99%) rename apps/docs/content/de/docs/01-app/01-getting-started/{07-server-and-client-components.mdx => 08-server-and-client-components.mdx} (99%) rename apps/docs/content/de/docs/01-app/01-getting-started/{08-fetching-data.mdx => 09-fetching-data.mdx} (100%) rename apps/docs/content/de/docs/01-app/01-getting-started/{09-caching-and-revalidating.mdx => 10-caching-and-revalidating.mdx} (98%) rename apps/docs/content/de/docs/01-app/01-getting-started/{10-updating-data.mdx => 11-updating-data.mdx} (99%) rename apps/docs/content/de/docs/01-app/01-getting-started/{11-error-handling.mdx => 12-error-handling.mdx} (99%) rename apps/docs/content/de/docs/01-app/01-getting-started/{12-partial-prerendering.mdx => 13-partial-prerendering.mdx} (99%) rename apps/docs/content/de/docs/01-app/01-getting-started/{13-metadata-and-og-images.mdx => 14-metadata-and-og-images.mdx} (99%) rename apps/docs/content/de/docs/01-app/01-getting-started/{14-deploying.mdx => 15-deploying.mdx} (97%) rename apps/docs/content/de/docs/01-app/01-getting-started/{15-upgrading.mdx => 16-upgrading.mdx} (95%) delete mode 100644 apps/docs/content/de/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx delete mode 100644 apps/docs/content/de/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx create mode 100644 apps/docs/content/en/docs/01-app/01-getting-started/04-linking-and-navigating.mdx rename apps/docs/content/en/docs/01-app/01-getting-started/{04-images.mdx => 05-images.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{05-fonts.mdx => 06-fonts.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{06-css.mdx => 07-css.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{07-server-and-client-components.mdx => 08-server-and-client-components.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{08-fetching-data.mdx => 09-fetching-data.mdx} (98%) rename apps/docs/content/en/docs/01-app/01-getting-started/{09-caching-and-revalidating.mdx => 10-caching-and-revalidating.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{10-updating-data.mdx => 11-updating-data.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{11-error-handling.mdx => 12-error-handling.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{12-partial-prerendering.mdx => 13-partial-prerendering.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{13-metadata-and-og-images.mdx => 14-metadata-and-og-images.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{14-deploying.mdx => 15-deploying.mdx} (100%) rename apps/docs/content/en/docs/01-app/01-getting-started/{15-upgrading.mdx => 16-upgrading.mdx} (100%) delete mode 100644 apps/docs/content/en/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx delete mode 100644 apps/docs/content/en/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx rename apps/docs/content/es/docs/01-app/01-getting-started/{04-images.mdx => 05-images.mdx} (98%) rename apps/docs/content/es/docs/01-app/01-getting-started/{05-fonts.mdx => 06-fonts.mdx} (98%) rename apps/docs/content/es/docs/01-app/01-getting-started/{06-css.mdx => 07-css.mdx} (99%) rename apps/docs/content/es/docs/01-app/01-getting-started/{07-server-and-client-components.mdx => 08-server-and-client-components.mdx} (99%) rename apps/docs/content/es/docs/01-app/01-getting-started/{08-fetching-data.mdx => 09-fetching-data.mdx} (100%) rename apps/docs/content/es/docs/01-app/01-getting-started/{09-caching-and-revalidating.mdx => 10-caching-and-revalidating.mdx} (98%) rename apps/docs/content/es/docs/01-app/01-getting-started/{10-updating-data.mdx => 11-updating-data.mdx} (99%) rename apps/docs/content/es/docs/01-app/01-getting-started/{11-error-handling.mdx => 12-error-handling.mdx} (99%) rename apps/docs/content/es/docs/01-app/01-getting-started/{12-partial-prerendering.mdx => 13-partial-prerendering.mdx} (99%) rename apps/docs/content/es/docs/01-app/01-getting-started/{13-metadata-and-og-images.mdx => 14-metadata-and-og-images.mdx} (99%) rename apps/docs/content/es/docs/01-app/01-getting-started/{14-deploying.mdx => 15-deploying.mdx} (97%) rename apps/docs/content/es/docs/01-app/01-getting-started/{15-upgrading.mdx => 16-upgrading.mdx} (95%) delete mode 100644 apps/docs/content/es/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx delete mode 100644 apps/docs/content/es/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx rename apps/docs/content/fr/docs/01-app/01-getting-started/{04-images.mdx => 05-images.mdx} (98%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{05-fonts.mdx => 06-fonts.mdx} (98%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{06-css.mdx => 07-css.mdx} (99%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{07-server-and-client-components.mdx => 08-server-and-client-components.mdx} (99%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{08-fetching-data.mdx => 09-fetching-data.mdx} (100%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{09-caching-and-revalidating.mdx => 10-caching-and-revalidating.mdx} (98%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{10-updating-data.mdx => 11-updating-data.mdx} (99%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{11-error-handling.mdx => 12-error-handling.mdx} (99%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{12-partial-prerendering.mdx => 13-partial-prerendering.mdx} (99%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{13-metadata-and-og-images.mdx => 14-metadata-and-og-images.mdx} (99%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{14-deploying.mdx => 15-deploying.mdx} (98%) rename apps/docs/content/fr/docs/01-app/01-getting-started/{15-upgrading.mdx => 16-upgrading.mdx} (95%) delete mode 100644 apps/docs/content/fr/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx delete mode 100644 apps/docs/content/fr/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx rename apps/docs/content/ja/docs/01-app/01-getting-started/{04-images.mdx => 05-images.mdx} (98%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{05-fonts.mdx => 06-fonts.mdx} (98%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{06-css.mdx => 07-css.mdx} (99%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{07-server-and-client-components.mdx => 08-server-and-client-components.mdx} (99%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{08-fetching-data.mdx => 09-fetching-data.mdx} (100%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{09-caching-and-revalidating.mdx => 10-caching-and-revalidating.mdx} (98%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{10-updating-data.mdx => 11-updating-data.mdx} (99%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{11-error-handling.mdx => 12-error-handling.mdx} (99%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{12-partial-prerendering.mdx => 13-partial-prerendering.mdx} (99%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{13-metadata-and-og-images.mdx => 14-metadata-and-og-images.mdx} (99%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{14-deploying.mdx => 15-deploying.mdx} (98%) rename apps/docs/content/ja/docs/01-app/01-getting-started/{15-upgrading.mdx => 16-upgrading.mdx} (95%) delete mode 100644 apps/docs/content/ja/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx delete mode 100644 apps/docs/content/ja/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx rename apps/docs/content/ru/docs/01-app/01-getting-started/{04-images.mdx => 05-images.mdx} (98%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{05-fonts.mdx => 06-fonts.mdx} (98%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{06-css.mdx => 07-css.mdx} (99%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{07-server-and-client-components.mdx => 08-server-and-client-components.mdx} (99%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{08-fetching-data.mdx => 09-fetching-data.mdx} (100%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{09-caching-and-revalidating.mdx => 10-caching-and-revalidating.mdx} (99%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{10-updating-data.mdx => 11-updating-data.mdx} (99%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{11-error-handling.mdx => 12-error-handling.mdx} (99%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{12-partial-prerendering.mdx => 13-partial-prerendering.mdx} (99%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{13-metadata-and-og-images.mdx => 14-metadata-and-og-images.mdx} (99%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{14-deploying.mdx => 15-deploying.mdx} (98%) rename apps/docs/content/ru/docs/01-app/01-getting-started/{15-upgrading.mdx => 16-upgrading.mdx} (96%) delete mode 100644 apps/docs/content/ru/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx delete mode 100644 apps/docs/content/ru/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{04-images.mdx => 05-images.mdx} (98%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{05-fonts.mdx => 06-fonts.mdx} (98%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{06-css.mdx => 07-css.mdx} (98%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{07-server-and-client-components.mdx => 08-server-and-client-components.mdx} (99%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{08-fetching-data.mdx => 09-fetching-data.mdx} (100%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{09-caching-and-revalidating.mdx => 10-caching-and-revalidating.mdx} (98%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{10-updating-data.mdx => 11-updating-data.mdx} (98%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{11-error-handling.mdx => 12-error-handling.mdx} (98%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{12-partial-prerendering.mdx => 13-partial-prerendering.mdx} (98%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{13-metadata-and-og-images.mdx => 14-metadata-and-og-images.mdx} (99%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{14-deploying.mdx => 15-deploying.mdx} (97%) rename apps/docs/content/zh-hans/docs/01-app/01-getting-started/{15-upgrading.mdx => 16-upgrading.mdx} (94%) delete mode 100644 apps/docs/content/zh-hans/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx delete mode 100644 apps/docs/content/zh-hans/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{04-images.mdx => 05-images.mdx} (98%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{05-fonts.mdx => 06-fonts.mdx} (98%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{06-css.mdx => 07-css.mdx} (98%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{07-server-and-client-components.mdx => 08-server-and-client-components.mdx} (99%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{08-fetching-data.mdx => 09-fetching-data.mdx} (100%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{09-caching-and-revalidating.mdx => 10-caching-and-revalidating.mdx} (98%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{10-updating-data.mdx => 11-updating-data.mdx} (98%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{11-error-handling.mdx => 12-error-handling.mdx} (98%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{12-partial-prerendering.mdx => 13-partial-prerendering.mdx} (99%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{13-metadata-and-og-images.mdx => 14-metadata-and-og-images.mdx} (99%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{14-deploying.mdx => 15-deploying.mdx} (97%) rename apps/docs/content/zh-hant/docs/01-app/01-getting-started/{15-upgrading.mdx => 16-upgrading.mdx} (94%) delete mode 100644 apps/docs/content/zh-hant/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx delete mode 100644 apps/docs/content/zh-hant/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/04-images.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/05-images.mdx similarity index 98% rename from apps/docs/content/ar/docs/01-app/01-getting-started/04-images.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/05-images.mdx index bfed2b90..a516a19b 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/04-images.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/05-images.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-06-02T15:30:01.000Z -translation-updated-at: 2025-06-02T20:02:40.002Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية تحسين الصور nav_title: الصور description: تعلم كيفية تحسين الصور في Next.js diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/05-fonts.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/06-fonts.mdx similarity index 98% rename from apps/docs/content/ar/docs/01-app/01-getting-started/05-fonts.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/06-fonts.mdx index 602c8833..f2b223e7 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/05-fonts.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/06-fonts.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-06-01T01:32:20.000Z -translation-updated-at: 2025-06-02T20:02:27.277Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية استخدام الخطوط nav_title: الخطوط description: تعلم كيفية استخدام الخطوط في Next.js diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/06-css.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/07-css.mdx similarity index 99% rename from apps/docs/content/ar/docs/01-app/01-getting-started/06-css.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/07-css.mdx index 71c103ec..08512eae 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/06-css.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/07-css.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-05-25T15:16:02.000Z -translation-updated-at: 2025-06-02T20:03:14.510Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية استخدام CSS في تطبيقك nav_title: CSS description: تعرف على الطرق المختلفة لإضافة CSS إلى تطبيقك، بما في ذلك وحدات CSS (CSS Modules)، وCSS العام (Global CSS)، وتيلويند CSS (Tailwind CSS)، وغيرها. diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/07-server-and-client-components.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/08-server-and-client-components.mdx similarity index 99% rename from apps/docs/content/ar/docs/01-app/01-getting-started/07-server-and-client-components.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/08-server-and-client-components.mdx index d72e5adc..29f28278 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/07-server-and-client-components.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/08-server-and-client-components.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-05-22T15:18:56.000Z -translation-updated-at: 2025-06-02T20:04:48.815Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية استخدام مكونات الخادم والعميل nav_title: مكونات الخادم والعميل description: تعلم كيف يمكنك استخدام مكونات React للخادم والعميل لتقديم أجزاء من تطبيقك على الخادم أو العميل. diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/08-fetching-data.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/09-fetching-data.mdx similarity index 100% rename from apps/docs/content/ar/docs/01-app/01-getting-started/08-fetching-data.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/09-fetching-data.mdx diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/09-caching-and-revalidating.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/10-caching-and-revalidating.mdx similarity index 99% rename from apps/docs/content/ar/docs/01-app/01-getting-started/09-caching-and-revalidating.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/10-caching-and-revalidating.mdx index 4f4f4430..4a871359 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/09-caching-and-revalidating.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/10-caching-and-revalidating.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-06-01T01:32:20.000Z -translation-updated-at: 2025-06-02T20:02:39.535Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية تخزين البيانات مؤقتًا وإعادة التحقق منها nav_title: التخزين المؤقت وإعادة التحقق description: تعلم كيفية تخزين البيانات مؤقتًا وإعادة التحقق منها في تطبيقك. diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/10-updating-data.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/11-updating-data.mdx similarity index 99% rename from apps/docs/content/ar/docs/01-app/01-getting-started/10-updating-data.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/11-updating-data.mdx index c74cfc64..4ea82aea 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/10-updating-data.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/11-updating-data.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-06-03T15:30:49.000Z -translation-updated-at: 2025-06-06T17:18:45.960Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية تحديث البيانات nav_title: تحديث البيانات description: تعلم كيفية تحديث البيانات في تطبيق Next.js الخاص بك. diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/11-error-handling.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/12-error-handling.mdx similarity index 99% rename from apps/docs/content/ar/docs/01-app/01-getting-started/11-error-handling.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/12-error-handling.mdx index 8a7140d5..230da587 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/11-error-handling.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/12-error-handling.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-06-01T01:32:20.000Z -translation-updated-at: 2025-06-02T20:02:26.256Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية التعامل مع الأخطاء nav_title: معالجة الأخطاء description: تعلم كيفية عرض الأخطاء المتوقعة والتعامل مع الاستثناءات غير الملتقطة. diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/12-partial-prerendering.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/13-partial-prerendering.mdx similarity index 99% rename from apps/docs/content/ar/docs/01-app/01-getting-started/12-partial-prerendering.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/13-partial-prerendering.mdx index a91063b8..2db1bfcd 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/12-partial-prerendering.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/13-partial-prerendering.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-06-01T01:32:20.000Z -translation-updated-at: 2025-06-02T20:02:38.632Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية استخدام التصيير الجزئي المسبق (Partial Prerendering) nav_title: التصيير الجزئي المسبق description: تعلم كيفية الجمع بين مزايا التصيير الثابت والديناميكي باستخدام التصيير الجزئي المسبق. diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/13-metadata-and-og-images.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/14-metadata-and-og-images.mdx similarity index 99% rename from apps/docs/content/ar/docs/01-app/01-getting-started/13-metadata-and-og-images.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/14-metadata-and-og-images.mdx index 696c218f..42cca8bf 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/13-metadata-and-og-images.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/14-metadata-and-og-images.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-06-01T01:32:20.000Z -translation-updated-at: 2025-06-02T20:02:43.106Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية إضافة بيانات وصفية وإنشاء صور OG nav_title: البيانات الوصفية وصور OG description: تعلم كيفية إضافة بيانات وصفية إلى صفحاتك وإنشاء صور OG ديناميكية. diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/14-deploying.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/15-deploying.mdx similarity index 98% rename from apps/docs/content/ar/docs/01-app/01-getting-started/14-deploying.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/15-deploying.mdx index b9f99aea..163968e2 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/14-deploying.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/15-deploying.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-06-05T23:52:35.000Z -translation-updated-at: 2025-06-06T17:17:41.883Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية نشر تطبيق Next.js الخاص بك nav_title: النشر description: تعلم كيفية نشر تطبيق Next.js الخاص بك. diff --git a/apps/docs/content/ar/docs/01-app/01-getting-started/15-upgrading.mdx b/apps/docs/content/ar/docs/01-app/01-getting-started/16-upgrading.mdx similarity index 95% rename from apps/docs/content/ar/docs/01-app/01-getting-started/15-upgrading.mdx rename to apps/docs/content/ar/docs/01-app/01-getting-started/16-upgrading.mdx index 80da2c2d..d1023b66 100644 --- a/apps/docs/content/ar/docs/01-app/01-getting-started/15-upgrading.mdx +++ b/apps/docs/content/ar/docs/01-app/01-getting-started/16-upgrading.mdx @@ -1,6 +1,6 @@ --- -source-updated-at: 2025-06-01T01:32:20.000Z -translation-updated-at: 2025-06-02T20:00:52.683Z +source-updated-at: 2025-06-08T05:18:03.000Z +translation-updated-at: 2025-06-08T05:18:03.000Z title: كيفية ترقية تطبيق Next.js الخاص بك nav_title: الترقية description: تعلم كيفية ترقية تطبيق Next.js إلى أحدث إصدار. diff --git a/apps/docs/content/ar/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx b/apps/docs/content/ar/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx deleted file mode 100644 index cf78dc3a..00000000 --- a/apps/docs/content/ar/docs/01-app/03-building-your-application/01-routing/04-linking-and-navigating.mdx +++ /dev/null @@ -1,322 +0,0 @@ ---- -source-updated-at: 2025-06-01T01:32:20.000Z -translation-updated-at: 2025-06-02T20:12:10.880Z -title: الربط والتنقل -description: تعرف على كيفية عمل التنقل في Next.js، وكيفية استخدام مكون Link وربط `useRouter`. -related: - links: - - app/deep-dive/caching - - app/api-reference/config/typescript ---- - -هناك أربع طرق للتنقل بين المسارات في Next.js: - -- استخدام [مكون ``](#link-component) -- استخدام [ربط `useRouter`](#userouter-hook) ([مكونات العميل](/docs/app/getting-started/server-and-client-components)) -- استخدام [دالة `redirect`](#redirect-function) ([مكونات الخادم](/docs/app/getting-started/server-and-client-components)) -- استخدام [واجهة History الأصلية](#using-the-native-history-api) - -ستغطي هذه الصفحة كيفية استخدام كل من هذه الخيارات، والتعمق في كيفية عمل التنقل. - -## مكون `` - -`` هو مكون مدمج يمتد علامة HTML `` لتوفير [الجلب المسبق](#2-prefetching) والتنقل من جانب العميل بين المسارات. إنها الطريقة الأساسية والموصى بها للتنقل بين المسارات في Next.js. - -يمكنك استخدامه عن طريق استيراده من `next/link`، وتمرير خاصية `href` إلى المكون: - -```tsx filename="app/page.tsx" switcher -import Link from 'next/link' - -export default function Page() { - return لوحة التحكم -} -``` - -```jsx filename="app/page.js" switcher -import Link from 'next/link' - -export default function Page() { - return لوحة التحكم -} -``` - -هناك خصائص اختيارية أخرى يمكنك تمريرها إلى ``. راجع [مرجع API](/docs/app/api-reference/components/link) للمزيد. - -## ربط `useRouter()` - -يسمح لك ربط `useRouter` بتغيير المسارات برمجيًا من [مكونات العميل](/docs/app/getting-started/server-and-client-components). - -```tsx filename="app/page.tsx" switcher -'use client' - -import { useRouter } from 'next/navigation' - -export default function Page() { - const router = useRouter() - - return ( - router.push('/dashboard')}> - لوحة التحكم - - ) -} -``` - -```jsx filename="app/page.js" switcher -'use client' - -import { useRouter } from 'next/navigation' - -export default function Page() { - const router = useRouter() - - return ( - router.push('/dashboard')}> - لوحة التحكم - - ) -} -``` - -للحصول على قائمة كاملة بطرق `useRouter`، راجع [مرجع API](/docs/app/api-reference/functions/use-router). - -> **التوصية:** استخدم مكون `` للتنقل بين المسارات ما لم يكن لديك متطلب محدد لاستخدام `useRouter`. - -## دالة `redirect` - -بالنسبة لـ [مكونات الخادم](/docs/app/getting-started/server-and-client-components)، استخدم دالة `redirect` بدلاً من ذلك. - -```tsx filename="app/team/[id]/page.tsx" switcher -import { redirect } from 'next/navigation' - -async function fetchTeam(id: string) { - const res = await fetch('https://...') - if (!res.ok) return undefined - return res.json() -} - -export default async function Profile({ - params, -}: { - params: Promise<{ id: string }> -}) { - const { id } = await params - if (!id) { - redirect('/login') - } - - const team = await fetchTeam(id) - if (!team) { - redirect('/join') - } - - // ... -} -``` - -```jsx filename="app/team/[id]/page.js" switcher -import { redirect } from 'next/navigation' - -async function fetchTeam(id) { - const res = await fetch('https://...') - if (!res.ok) return undefined - return res.json() -} - -export default async function Profile({ params }) { - const { id } = await params - if (!id) { - redirect('/login') - } - - const team = await fetchTeam(id) - if (!team) { - redirect('/join') - } - - // ... -} -``` - -> **معلومة مفيدة**: -> -> - تُرجع `redirect` رمز حالة 307 (إعادة توجيه مؤقت) افتراضيًا. عند استخدامها في إجراء خادم، تُرجع 303 (انظر آخر)، والذي يُستخدم عادةً لإعادة التوجيه إلى صفحة نجاح نتيجة لطلب POST. -> - تُطلق `redirect` خطأ داخليًا لذا يجب استدعاؤها خارج كتل `try/catch`. -> - يمكن استدعاء `redirect` في مكونات العميل أثناء عملية التصيير ولكن ليس في معالج الأحداث. يمكنك استخدام [ربط `useRouter`](#userouter-hook) بدلاً من ذلك. -> - تقبل `redirect` أيضًا عناوين URL المطلقة ويمكن استخدامها لإعادة التوجيه إلى روابط خارجية. -> - إذا كنت ترغب في إعادة التوجيه قبل عملية التصيير، استخدم [`next.config.js`](/docs/app/guides/redirecting#redirects-in-nextconfigjs) أو [الوسيط](/docs/app/guides/redirecting#nextresponseredirect-in-middleware). - -راجع [مرجع API لـ `redirect`](/docs/app/api-reference/functions/redirect) للمزيد من المعلومات. - -## استخدام واجهة History الأصلية - -يسمح لك Next.js باستخدام الطرق الأصلية [`window.history.pushState`](https://developer.mozilla.org/en-US/docs/Web/API/History/pushState) و [`window.history.replaceState`](https://developer.mozilla.org/en-US/docs/Web/API/History/replaceState) لتحديث مكدس تاريخ المتصفح دون إعادة تحميل الصفحة. - -تتكامل استدعاءات `pushState` و `replaceState` مع موجه Next.js، مما يسمح لك بالمزامنة مع [`usePathname`](/docs/app/api-reference/functions/use-pathname) و [`useSearchParams`](/docs/app/api-reference/functions/use-search-params). - -### `window.history.pushState` - -استخدمه لإضافة إدخال جديد إلى مكدس تاريخ المتصفح. يمكن للمستخدم التنقل للخلف إلى الحالة السابقة. على سبيل المثال، لفرز قائمة المنتجات: - -```tsx fileName="app/ui/sort-products.tsx" switcher -'use client' - -import { useSearchParams } from 'next/navigation' - -export default function SortProducts() { - const searchParams = useSearchParams() - - function updateSorting(sortOrder: string) { - const params = new URLSearchParams(searchParams.toString()) - params.set('sort', sortOrder) - window.history.pushState(null, '', `?${params.toString()}`) - } - - return ( - <> - updateSorting('asc')}>فرز تصاعدي - updateSorting('desc')}>فرز تنازلي - > - ) -} -``` - -```jsx fileName="app/ui/sort-products.js" switcher -'use client' - -import { useSearchParams } from 'next/navigation' - -export default function SortProducts() { - const searchParams = useSearchParams() - - function updateSorting(sortOrder) { - const params = new URLSearchParams(searchParams.toString()) - params.set('sort', sortOrder) - window.history.pushState(null, '', `?${params.toString()}`) - } - - return ( - <> - updateSorting('asc')}>فرز تصاعدي - updateSorting('desc')}>فرز تنازلي - > - ) -} -``` - -### `window.history.replaceState` - -استخدمه لاستبدال الإدخال الحالي في مكدس تاريخ المتصفح. لا يمكن للمستخدم التنقل للخلف إلى الحالة السابقة. على سبيل المثال، لتبديل لغة التطبيق: - -```tsx fileName="app/ui/locale-switcher.tsx" switcher -'use client' - -import { usePathname } from 'next/navigation' - -export function LocaleSwitcher() { - const pathname = usePathname() - - function switchLocale(locale: string) { - // مثال: '/en/about' أو '/fr/contact' - const newPath = `/${locale}${pathname}` - window.history.replaceState(null, '', newPath) - } - - return ( - <> - switchLocale('en')}>الإنجليزية - switchLocale('fr')}>الفرنسية - > - ) -} -``` - -```jsx fileName="app/ui/locale-switcher.js" switcher -'use client' - -import { usePathname } from 'next/navigation' - -export function LocaleSwitcher() { - const pathname = usePathname() - - function switchLocale(locale) { - // مثال: '/en/about' أو '/fr/contact' - const newPath = `/${locale}${pathname}` - window.history.replaceState(null, '', newPath) - } - - return ( - <> - switchLocale('en')}>الإنجليزية - switchLocale('fr')}>الفرنسية - > - ) -} -``` - -## كيف يعمل التوجيه والتنقل - -يستخدم موجه التطبيق نهجًا هجينًا للتوجيه والتنقل. على الخادم، يتم [تقسيم الكود](#1-code-splitting) تلقائيًا حسب مقاطع المسار. وعلى العميل، يقوم Next.js [بجلب مسبق](#2-prefetching) و[تخزين مؤقت](#3-caching) لمقاطع المسار. هذا يعني أنه عندما ينتقل المستخدم إلى مسار جديد، لا يعيد المتصفح تحميل الصفحة، ويعاد تصيير فقط مقاطع المسار التي تتغير - مما يحسن تجربة التنقل والأداء. - -### 1. تقسيم الكود - -يسمح لك تقسيم الكود بتقسيم كود التطبيق إلى حزم أصغر ليتم تنزيلها وتنفيذها بواسطة المتصفح. هذا يقلل من كمية البيانات المنقولة ووقت التنفيذ لكل طلب، مما يؤدي إلى تحسين الأداء. - -تسمح لك [مكونات الخادم](/docs/app/getting-started/server-and-client-components) بتقسيم كود التطبيق تلقائيًا حسب مقاطع المسار. هذا يعني أنه يتم تحميل الكود المطلوب فقط للمسار الحالي عند التنقل. - -### 2. الجلب المسبق - -الجلب المسبق هو طريقة لتحميل مسار مسبقًا في الخلفية قبل أن يزوره المستخدم. - -هناك طريقتان لجلب المسارات مسبقًا في Next.js: - -- **مكون ``**: يتم جلب المسارات مسبقًا تلقائيًا عندما تصبح مرئية في نافذة عرض المستخدم. يحدث الجلب المسبق عند تحميل الصفحة لأول مرة أو عندما تظهر في العرض من خلال التمرير. -- **`router.prefetch()`**: يمكن استخدام ربط `useRouter` لجلب المسارات مسبقًا برمجيًا. - -يختلف سلوك الجلب المسبق الافتراضي لـ `` (أي عندما تكون خاصية `prefetch` غير محددة أو مضبوطة على `null`) اعتمادًا على استخدامك لـ [`loading.js`](/docs/app/api-reference/file-conventions/loading). يتم جلب التخطيط المشترك فقط، أسفل "شجرة" المكونات المصيرية حتى ملف `loading.js` الأول، وتخزينه مؤقتًا لمدة `30s`. هذا يقلل من تكلفة جلب مسار ديناميكي كامل، ويعني أنه يمكنك عرض [حالة تحميل فورية](/docs/app/building-your-application/routing/loading-ui-and-streaming#instant-loading-states) لردود فعل مرئية أفضل للمستخدمين. - -يمكنك تعطيل الجلب المسبق عن طريق ضبط خاصية `prefetch` على `false`. بدلاً من ذلك، يمكنك جلب بيانات الصفحة الكاملة مسبقًا خارج حدود التحميل عن طريق ضبط خاصية `prefetch` على `true`. - -راجع [مرجع API لـ ``](/docs/app/api-reference/components/link) للمزيد من المعلومات. - -> **معلومة مفيدة**: -> -> - لا يتم تمكين الجلب المسبق في وضع التطوير، فقط في الإنتاج. - -### 3. التخزين المؤقت - -يحتوي Next.js على **تخزين مؤقت من جانب العميل في الذاكرة** يسمى [تخزين مؤقت للموجه](/docs/app/deep-dive/caching#client-side-router-cache). بينما يتنقل المستخدمون في التطبيق، يتم تخزين حمولة مكون خادم React لمقاطع المسار [المجموعة مسبقًا](#2-prefetching) والمسارات التي تمت زيارتها في التخزين المؤقت. - -هذا يعني عند التنقل، يتم إعادة استخدام التخزين المؤقت قدر الإمكان، بدلاً من إجراء طلب جديد إلى الخادم - مما يحسن الأداء عن طريق تقليل عدد الطلبات والبيانات المنقولة. - -تعرف على المزيد حول كيفية عمل [تخزين مؤقت للموجه](/docs/app/deep-dive/caching#client-side-router-cache) وكيفية تكوينه. - -### 4. التصيير الجزئي - -يعني التصيير الجزئي أنه يتم إعادة تصيير فقط مقاطع المسار التي تتغير عند التنقل على العميل، ويتم الحفاظ على أي مقاطع مشتركة. - -على سبيل المثال، عند التنقل بين مسارين شقيقين، `/dashboard/settings` و `/dashboard/analytics`، سيتم إلغاء تحميل صفحة `settings`، وسيتم تحميل صفحة `analytics` بحالة جديدة، وسيتم الحفاظ على تخطيط `dashboard` المشترك. هذا السلوك موجود أيضًا بين مسارين على نفس المقطع الديناميكي مثل `/blog/[slug]/page` والتنقل من `/blog/first` إلى `/blog/second`. - - - -بدون التصيير الجزئي، سيؤدي كل تنقل إلى إعادة تصيير الصفحة الكاملة على العميل. يؤدي تصيير المقطع الذي يتغير فقط إلى تقليل كمية البيانات المنقولة ووقت التنفيذ، مما يؤدي إلى تحسين الأداء. - -### 5. التنقل الناعم - -يقوم المتصفحات بتنفيذ "تنقل صعب" عند التنقل بين الصفحات. يمكّن موجه تطبيق Next.js "التنقل الناعم" بين الصفحات، مما يضمن إعادة تصيير فقط مقاطع المسار التي تغيرت (تصيير جزئي). هذا يمكّن من الحفاظ على حالة React للعميل أثناء التنقل. - -### 6. التنقل للخلف وللأمام - -افتراضيًا، ستحافظ Next.js على موضع التمرير للتنقل للخلف وللأمام، وإعادة استخدام مقاطع المسار في [تخزين مؤقت للموجه](/docs/app/deep-dive/caching#client-side-router-cache). - -### 7. التوجيه بين `pages/` و `app/` - -عند الترحيل التدريجي من `pages/` إلى `app/`، سيتعامل موجه Next.js تلقائيًا مع التنقل الصلب بين الاثنين. للكشف عن الانتقالات من `pages/` إلى `app/`، هناك مرشح موجه عميل يستخدم التحقق الاحتمالي لمسارات التطبيق، مما قد يؤدي في بعض الأحيان إلى نتائج إيجابية خاطئة. افتراضيًا، يجب أن تكون مثل هذه الحالات نادرة جدًا، حيث نقوم بتكوين احتمالية النتيجة الإيجابية الخاطئة لتكون 0.01%. يمكن تخصيص هذه الاحتمالية عبر خيار `experimental.clientRouterFilterAllowedRate` في `next.config.js`. من المهم ملاحظة أن خفض معدل النتائج الإيجابية الخاطئة سيزيد من حجم المرشح الذي تم إنشاؤه في حزمة العميل. - -بدلاً من ذلك، إذا كنت تفضل تعطيل هذه المعالجة تمامًا وإدارة التوجيه بين `pages/` و `app/` يدويًا، يمكنك ضبط `experimental.clientRouterFilter` على false في `next.config.js`. عند تعطيل هذه الميزة، لن يتم التنقل بشكل صحيح افتراضيًا إلى أي مسارات ديناميكية في الصفحات التي تتداخل مع مسارات التطبيق. \ No newline at end of file diff --git a/apps/docs/content/ar/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx b/apps/docs/content/ar/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx deleted file mode 100644 index b451a04c..00000000 --- a/apps/docs/content/ar/docs/01-app/03-building-your-application/01-routing/06-loading-ui-and-streaming.mdx +++ /dev/null @@ -1,197 +0,0 @@ ---- -source-updated-at: 2025-05-16T04:52:11.000Z -translation-updated-at: 2025-06-02T20:11:37.831Z -title: واجهة التحميل والبث المباشر -description: مبنية على Suspense، تتيح لك واجهة التحميل إنشاء واجهة احتياطية لأجزاء مسار محددة، وبث المحتوى تلقائيًا بمجرد استعداده. ---- - -يساعدك الملف الخاص `loading.js` في إنشاء واجهة تحميل ذات معنى باستخدام [React Suspense](https://react.dev/reference/react/Suspense). باستخدام هذه الاتفاقية، يمكنك عرض [حالة تحميل فورية](#instant-loading-states) من الخادم أثناء تحميل محتوى جزء المسار. يتم استبدال المحتوى الجديد تلقائيًا بمجرد اكتمال التقديم. - - - -## حالات التحميل الفورية - -حالة التحميل الفورية هي واجهة مستخدم احتياطية تُعرض فورًا عند التنقل. يمكنك تقديم مؤشرات تحميل مسبقًا مثل الهياكل العظمية (skeletons) والدوائر الدوارة (spinners)، أو جزء صغير ولكن ذو معنى من الشاشات المستقبلية مثل صورة الغلاف، العنوان، إلخ. هذا يساعد المستخدمين على فهم أن التطبيق يستجيب ويوفر تجربة مستخدم أفضل. - -قم بإنشاء حالة تحميل عن طريق إضافة ملف `loading.js` داخل مجلد. - - - -```tsx filename="app/dashboard/loading.tsx" switcher -export default function Loading() { - // يمكنك إضافة أي واجهة مستخدم داخل Loading، بما في ذلك الهيكل العظمي. - return -} -``` - -```jsx filename="app/dashboard/loading.js" switcher -export default function Loading() { - // يمكنك إضافة أي واجهة مستخدم داخل Loading، بما في ذلك الهيكل العظمي. - return -} -``` - -في نفس المجلد، سيتم تداخل `loading.js` داخل `layout.js`. سيتم لف ملف `page.js` وأي أطفال تحته تلقائيًا في حدود ``. - - - -> **معلومة مفيدة**: -> -> - التنقل فوري، حتى مع [التوجيه المركزي للخادم](/docs/app/building-your-application/routing/linking-and-navigating#how-routing-and-navigation-works). -> - التنقل قابل للمقاطعة، مما يعني أن تغيير المسارات لا يحتاج إلى انتظار تحميل محتوى المسار بالكامل قبل التنقل إلى مسار آخر. -> - تبقى التخطيطات المشتركة قابلة للتشغيل أثناء تحميل أجزاء المسار الجديدة. - -> **توصية:** استخدم اتفاقية `loading.js` لأجزاء المسار (التخطيطات والصفحات) حيث يقوم Next.js بتحسين هذه الوظيفة. - -## البث المباشر مع Suspense - -بالإضافة إلى `loading.js`، يمكنك أيضًا إنشاء حدود Suspense يدويًا لمكونات واجهة المستخدم الخاصة بك. يدعم موجه التطبيق (App Router) البث المباشر باستخدام [Suspense](https://react.dev/reference/react/Suspense). - -> **معلومة مفيدة**: -> -> - [بعض المتصفحات](https://bugs.webkit.org/show_bug.cgi?id=252413) تقوم بتخزين استجابة البث مؤقتًا. قد لا ترى الاستجابة المبثوثة حتى تتجاوز الاستجابة 1024 بايت. هذا يؤثر عادةً فقط على تطبيقات "hello world" البسيطة، وليس التطبيقات الحقيقية. - -### ما هو البث المباشر؟ - -لفهم كيفية عمل البث المباشر في React وNext.js، من المفيد فهم **التقديم من جانب الخادم (SSR)** ومحدودياته. - -مع SSR، هناك سلسلة من الخطوات التي يجب إكمالها قبل أن يتمكن المستخدم من رؤية الصفحة والتفاعل معها: - -1. أولاً، يتم جلب جميع البيانات لصفحة معينة على الخادم. -2. ثم يقوم الخادم بتقديم HTML للصفحة. -3. يتم إرسال HTML وCSS وJavaScript للصفحة إلى العميل. -4. يتم عرض واجهة مستخدم غير تفاعلية باستخدام HTML المُنشأ وCSS. -5. أخيرًا، يقوم React [بترطيب (hydrate)](https://react.dev/reference/react-dom/client/hydrateRoot#hydrating-server-rendered-html) واجهة المستخدم لجعلها تفاعلية. - - - -هذه الخطوات متسلسلة وحظرية، مما يعني أن الخادم يمكنه فقط تقديم HTML للصفحة بمجرد جلب جميع البيانات. وعلى العميل، يمكن لـ React فقط ترطيب واجهة المستخدم بمجرد تنزيل كود جميع المكونات في الصفحة. - -يساعد SSR مع React وNext.js في تحسين أداء التحميل الملحوظ عن طريق عرض صفحة غير تفاعلية للمستخدم في أسرع وقت ممكن. - - - -ومع ذلك، يمكن أن يظل بطيئًا حيث يجب إكمال جلب جميع البيانات على الخادم قبل إمكانية عرض الصفحة للمستخدم. - -**البث المباشر** يسمح لك بتقسيم HTML للصفحة إلى أجزاء أصغر وإرسال تلك الأجزاء تدريجيًا من الخادم إلى العميل. - - - -هذا يمكّن أجزاء من الصفحة من الظهور عاجلاً، دون انتظار تحميل جميع البيانات قبل أن يمكن تقديم أي واجهة مستخدم. - -يعمل البث المباشر بشكل جيد مع نموذج مكونات React حيث يمكن اعتبار كل مكون جزءًا. يمكن إرسال المكونات ذات الأولوية الأعلى (مثل معلومات المنتج) أو التي لا تعتمد على البيانات أولاً (مثل التخطيط)، ويمكن لـ React بدء الترطيب مبكرًا. يمكن إرسال المكونات ذات الأولوية المنخفضة (مثل المراجعات، المنتجات ذات الصلة) في نفس طلب الخادم بعد جلب بياناتها. - - - -البث المباشر مفيد بشكل خاص عندما تريد منع طلبات البيانات الطويلة من حظر عرض الصفحة حيث يمكنه تقليل [وقت أول بايت (TTFB)](https://web.dev/ttfb/) و[أول رسم للمحتوى (FCP)](https://web.dev/first-contentful-paint/). كما أنه يساعد في تحسين [الوقت للتفاعل (TTI)](https://developer.chrome.com/en/docs/lighthouse/performance/interactive/)، خاصة على الأجهزة الأبطأ. - -### مثال - -يعمل `` عن طريق لف مكون يقوم بإجراء عمل غير متزامن (مثل جلب البيانات)، وعرض واجهة مستخدم احتياطية (مثل هيكل عظمي، دائرة دوارة) أثناء حدوثه، ثم استبدال مكونك بمجرد اكتمال الإجراء. - -```tsx filename="app/dashboard/page.tsx" switcher -import { Suspense } from 'react' -import { PostFeed, Weather } from './Components' - -export default function Posts() { - return ( - - جاري تحميل التغذية...