ایجاد یک اپلیکیشن ری‌اکت

اگر اپلیکیشن شما محدودیت‌هایی دارد که توسط فریم‌ورک‌های موجود به خوبی پوشش داده نمی‌شوند، یا ترجیح می‌دهید فریم‌ورک خودتان را بسازید، یا فقط می‌خواهید اصول اولیه یک اپلیکیشن ری‌اکت را یاد بگیرید، می‌توانید یک اپلیکیشن ری‌اکت را از پایه بسازید.

فریم‌ورک‌های فول‌استک

این فریم‌ورک‌های پیشنهادی از تمام قابلیت‌هایی که برای دیپلوی و مقیاس‌دهی اپلیکیشن خود در محیط پروداکشن نیاز دارید پشتیبانی می‌کنند. آن‌ها جدیدترین قابلیت‌های ری‌اکت را ادغام کرده‌اند و از معماری ری‌اکت بهره می‌برند.

Next.js (App Router)

App Router در Next.js یک فریم‌ورک ری‌اکت است که از معماری ری‌اکت به طور کامل بهره می‌برد تا اپلیکیشن‌های فول‌استک ری‌اکت را امکان‌پذیر کند.

Next.js توسط Vercel نگهداری می‌شود. شما می‌توانید یک اپلیکیشن Next.js را مستقر کنید روی هر ارائه‌دهنده‌ی میزبانی که از Node.js یا کانتینرهای Docker پشتیبانی کند، یا روی سرور خودتان. Next.js همچنین از خروجی استاتیک پشتیبانی می‌کند که به سرور نیازی ندارد.

React Router (v7)

React Router محبوب‌ترین کتابخانه مسیردهی برای ری‌اکت است و می‌تواند همراه با Vite برای ایجاد یک فریم‌ورک فول‌استک ری‌اکت استفاده شود. این فریم‌ورک بر استفاده از APIهای استاندارد وب تأکید دارد و چندین قالب آماده برای استقرار روی محیط‌ها و پلتفرم‌های مختلف جاوااسکریپت ارائه می‌دهد.

برای ایجاد یک پروژه‌ی جدید فریم‌ورک React Router، دستور زیر را اجرا کنید:

React Router توسط Shopify نگهداری می‌شود.

Expo (برای اپلیکیشن‌های نیتیو)

Expo یک فریم‌ورک ری‌اکت است که به شما اجازه می‌دهد اپلیکیشن‌های یونیورسال اندروید، iOS و وب را با رابط‌های کاربری واقعاً نیتیو بسازید. این فریم‌ورک یک SDK برای React Native فراهم می‌کند که استفاده از بخش‌های نیتیو را ساده‌تر می‌سازد. برای ایجاد یک پروژه‌ی جدید با Expo، دستور زیر را اجرا کنید:

اگر در Expo تازه‌کار هستید، آموزش Expo را بررسی کنید.

Expo توسط شرکت Expo نگهداری می‌شود. ساخت اپلیکیشن با Expo رایگان است، و شما می‌توانید اپ‌ها را بدون هیچ محدودیتی در فروشگاه‌های Google و Apple منتشر کنید. علاوه بر این، Expo سرویس‌های ابری پولی اختیاری نیز ارائه می‌دهد.

سایر فریم‌ورک‌ها

فریم‌ورک‌های دیگری نیز وجود دارند که در حال حرکت به سمت چشم‌انداز فول‌استک ری‌اکت هستند:

• TanStack Start (نسخه بتا): فریم‌ورک TanStack Start یک فریم‌ورک فول‌استک ری‌اکت است که توسط TanStack Router پشتیبانی می‌شود. این فریم‌ورک رندر سمت سرور (SSR) کامل، استریمینگ، فانکشن‌های سمت سرور، باندلینگ و امکانات بیشتر را با استفاده از ابزارهایی مانند Nitro و Vite فراهم می‌کند.
• RedwoodJS: فریم‌ورک Redwood یک فریم‌ورک فول‌استک ری‌اکت است که با تعداد زیادی پکیج و پیکربندی از پیش نصب‌شده ارائه می‌شود و ساخت اپلیکیشن‌های وب فول‌استک را آسان می‌کند.

// This component runs *only* on the server (or during the build).
async function Talks({ confId }) {
  // 1. You're on the server, so you can talk to your data layer. API endpoint not required.
  const talks = await db.Talks.findAll({ confId });

  // 2. Add any amount of rendering logic. It won't make your JavaScript bundle larger.
  const videos = talks.map(talk => talk.video);

  // 3. Pass the data down to the components that will run in the browser.
  return <SearchableVideoList videos={videos} />;
}

<Suspense fallback={<TalksLoading />}>
  <Talks confId={conf.id} />
</Suspense>

شروع از صفر

اگر اپلیکیشن شما محدودیت‌هایی دارد که توسط فریم‌ورک‌های موجود به‌خوبی پشتیبانی نمی‌شوند، یا ترجیح می‌دهید فریم‌ورک مخصوص به خود را بسازید، یا فقط می‌خواهید اصول اولیه یک اپلیکیشن ری‌اکت را یاد بگیرید، گزینه‌های دیگری برای شروع یک پروژه ری‌اکت از صفر وجود دارد.

شروع از صفر انعطاف‌پذیری بیشتری به شما می‌دهد، اما مستلزم آن است که خودتان انتخاب کنید از چه ابزارهایی برای روتینگ، واکشی داده و الگوهای رایج دیگر استفاده کنید. این کار بسیار شبیه ساختن فریم‌ورک خودتان است، به جای استفاده از یک فریم‌ورک آماده. فریم‌ورک‌هایی که ما توصیه می‌کنیم راه‌حل‌های داخلی برای این مسائل دارند.

اگر می‌خواهید راه‌حل‌های خودتان را بسازید، به راهنمای ما برای ساخت یک اپلیکیشن ری‌اکت از صفر مراجعه کنید تا با نحوه راه‌اندازی یک پروژه ری‌اکت جدید با استفاده از ابزاری مانند Vite، Parcel یا RSbuild آشنا شوید.

اگر شما نویسنده یک فریم‌ورک هستید و علاقه‌مندید که نامتان در این صفحه ذکر شود، به ما اطلاع دهید.