Next.js

من موسوعة حسوب

البدء مع Next.js

مرحبًا بك إلى توثيقات Next.js باللغة العربية!

متطلبات النظام:

  • حزمة Node.js نسختها 12.22.0 أو أعلى
  • نظام تشغيل ماك أو ويندوز (بما في ذلك منظومة ويندوز الفرعية لدعم لينكس WSL) أو لينكس.

التثبيت التلقائي لإطار عمل Next.js

من الأفضل أن تُنشئ تطبيقًا جديدًا باستخدام create-next-app وستثبت هذه العملية كل ما تحتاجه تلقائيًا. لإنشاء تطبيق جديد في Next.js، اكتب التعليمات التالية في طرفية Node.js:

npx create-next-app@latest
# or
yarn create next-app
# or
pnpm create next-app

بإمكانك استخدام الراية typescript-- إن أردت ان تبدأ بمشروع TypeScript:

npx create-next-app@latest --typescript
# or
yarn create next-app --typescript
# or
pnpm create next-app -- --typescript

عند اكتمال التثبيت:

  • شغل خادم التطوير على العنوان http://localhost:3000 مستخدمًا إحدى التعليمات التالية:
    • npm run dev
    • yarn dev
    • pnpm dev
  • زر العنوان السابق للاطلاع على تطبيقك.
  • عدّل الصفحة pages/index.js وراقب نتيجة ما فعلته في المتصفح.

الميزات الأساسية

Pages

Data Fetching

Built-in CSS Support

Layouts

Image Optimization

Font Optimization

Static File Serving

Fast Refresh

ESLint

TypeScript

Environment Variables

Supported Browsers and Features

Handling Scripts

Routing

API Routes

Going to Production

Deployment

Authentication

Testing

Guides

ميزات متقدمة

Next.js Compiler

Preview Mode

Dynamic Import

Automatic Static Optimization

Static HTML Export

Absolute Imports and Module Path Aliases

Using MDX

AMP Support

Customizing Babel Config

Customizing PostCSS Config

Custom Server

Custom `App`

Custom `Document`

Custom Error Page

`src` Directory

Multi Zones

Measuring performance

Middleware (Beta)

Debugging

Error Handling

Source Maps

Codemods

Internationalized Routing

Output File Tracing

Security Headers

React 18

Upgrade Guide

Migrating to Next.js

FAQ

مرجع الواجعة البرمجية API Reference

CLI

Create Next App

next/router

next/link

next/image

next/script

next/head

next/amp

next/server

next/streaming

Edge Runtime

Data Fetching

Static Optimization Indicator

next.config.js