روتینگ چیه؟

روتینگ یعنی مدیریت صفحات مختلف توی یک برنامه وب. فرض کن یه سایت داری که چند تا صفحه مثل صفحه اصلی، درباره ما، یا تماس با ما داره. روتینگ بهمون این امکان رو می‌ده که بر اساس آدرس URL، صفحه‌ی مناسب رو به کاربر نشون بدیم.

چرا از React Router استفاده کنیم؟

React Router یه ابزار قدرتمنده که چند تا مزیت مهم داره:

  • ناوبری ساده: می‌تونیم راحت بین صفحات جابه‌جا شیم.
  • مدیریت URL: هر صفحه یه آدرس منحصر به فرد داره.
  • بدون رفرش صفحه: جابه‌جایی بین صفحات بدون نیاز به بارگذاری مجدد کل صفحه اتفاق می‌افته.

نصب React Router

برای شروع، باید React Router رو نصب کنیم. توی ترمینال این دستور رو بزن:

npm install react-router-dom

ساخت صفحات و ناوبری

بیایم یه مثال بزنیم. فرض کن می‌خوایم دو تا صفحه داشته باشیم: صفحه اصلی (Home) و درباره ما (About).

۱. ساخت کامپوننت‌های صفحه

اول دو تا کامپوننت ساده می‌سازیم:

import React from 'react';

function Home() {
  return <h1>Home Page</h1>;
}

export default Home;

import React from 'react';

function About() {
  return <h1>About Page</h1>;
}

export default About;

خلاصه درس

تمرین


مشاهده پاسخ
توسعه دهندگان
نیما عراقی