قبل از شروع کار با این آموزش، مطمئن شوید که موارد زیر را نصب کرده اید:
مراحل:
my-react-app
کنیدnpx create-react-app my-app
این دستور، پروژه React جدید شما را با نام my-react-app در دایرکتوری فعلی ایجاد می کند.
cd my-react-app
سپس، دستور زیر را برای راه اندازی سرور توسعه محلی و باز کردن پروژه در مرورگر اجرا کنید:
npm start
با اجرای این دستور، مرورگر شما به طور خودکار به آدرس http://localhost:3000
باز می شود و می توانید رابط کاربری اولیه پروژه React خود را مشاهده کنید.
├ ── package.json # فایل پیکربندی پروژه
├── README.md # اطلاعات مربوط به پروژه
├── src/ # کد منبع پروژه
│ ├── App.js # کامپوننت اصلی React
│ ├── index.js # نقطه ورود برنامه
│ └── ... # سایر کامپوننت ها، فایل های CSS و غیره
├── public/ # پوشه برای فایل های استاتیک مانند تصاویر و فونت ها
└── ... # سایر فایل های پیکربندی
شما می توانید کد خود را در دایرکتوری src
ویرایش کنید. تغییرات شما به طور خودکار در مرورگر بازخوانی می شوند.
4. کار با کد:
فایل اصلی JavaScript در پروژه شما src/App.js
است. این فایل شامل کامپوننت اصلی React شما است که رابط کاربری برنامه را render می کند.
شما می توانید با استفاده از JSX، که ترکیبی از HTML و JavaScript است، رابط کاربری خود را بسازید.
برای آشنایی بیشتر با JSX و مفاهیم پایه ی React، می توانید به منابع زیر مراجعه کنید:
استقرار پروژه:
هنگامی که پروژه خود را به پایان رساندید، می توانید آن را برای تولید و استقرار آماده کنید. برای این کار، می توانید از ابزارهایی مانند webpack
یا Parcel
استفاده کنید.
اطلاعات بیشتر در مورد نحوه ی استقرار پروژه های React را می توانید در مستندات رسمی React بیابید: [نشانی وب نامعتبر برداشته شد]
نکات: