React.js که معمولاً React نامیده می شود، یک کتابخانه جاوا اسکریپت است که برای ساخت رابط کاربری استفاده می شود. هر برنامه وب React از اجزای قابل استفاده مجدد تشکیل شده است که بخشهایی از رابط کاربری را تشکیل میدهند . ما میتوانیم یک مؤلفه جداگانه برای نوار ناوبری، یکی برای پاورقی، دیگری برای محتوای اصلی و غیره داشته باشیم.
React نیز یک اپلیکیشن تک صفحه ای است. بنابراین به جای ارسال درخواست به سرور هر بار که قرار است صفحه جدیدی ارائه شود، محتویات صفحه مستقیماً از اجزای React بارگذاری می شود. این منجر به رندر سریعتر بدون بارگیری مجدد صفحه می شود.
در بیشتر موارد، سینتکس مورد استفاده برای ساخت برنامههای React JSX (JavaScript XML) نامیده میشود که یک پسوند نحوی برای جاوا اسکریپت است. این به ما امکان می دهد که هم منطق جاوا اسکریپت و هم منطق رابط کاربری را به روشی منحصر به فرد ترکیب کنیم. با JSX، ما نیاز به تعامل با DOM را با استفاده از روشهایی مانند querySelector و سایر روشهای دستکاری DOM حذف میکنیم. اگرچه استفاده از JSX اجباری نیست، اما توسعه برنامههای React را آسانتر میکند. در اینجا مثالی از نحوه استفاده از JSX در React آورده شده است:
function App() }
const greetings = “Hello World”;
return (
<div className=”App”>
<h1> {greetings} </h1>
</div>
);
{
{
در کد بالا، ما از یک کامپوننت تابعی React برای ارائه یک متن به مرورگر استفاده کردیم. نام کامپوننت App است. قبل از تابع render() یک متغیر ایجاد کردیم. سپس این متغیر را با استفاده از براکت به نشانه گذاری منتقل کردیم. این HTML نیست بلکه نحوی برای نوشتن کد با استفاده از JSX است.
مهم ترین عاملی که باعث شد ری اکت ساخته شود و برنامه نویسان از آن استفاده کنند، سرعت بالا و همچنین سادگی کار با آن و مقیاس پذیری بسیار عالی آن است.کتابخانه ری اکت روی رابط کاربری تمرکز بالایی دارد و در بحث معماری mvc تطابق ایجاد می کند. همچنین کتابخانه React به آسانی و بدون دردسر با کتابخانه های دیگر و فریم ورک هایی که در جاوا اسکریپت هستند ادغام می شود و مورد استفاده قرار می گیرد.
بسیاری از توسعهدهندگان و سازمانها React را به جای دیگر کتابخانهها و چارچوبها انتخاب کردهاند. در اینجا چند مزایای آن آورده شده است:
React به راحتی قابل یادگیری و درک است تا زمانی که پیش نیازها را به خوبی درک کنید. React دارای اسناد محکم و منابع رایگان زیادی است که توسط سایر توسعه دهندگان آنلاین از طریق انجمن بسیار فعال React ایجاد شده است.
هر کامپوننت در React منطق خاص خود را دارد که می تواند در هر نقطه از برنامه دوباره استفاده شود. این امر نیاز به بازنویسی چندین بار یک قطعه کد را کاهش می دهد.
درصد بیشتری از فرصت های توسعه وب فرانت اند در حال حاضر دارای React به عنوان یکی از مهارت های مورد نیاز هستند. بنابراین داشتن درک درستی از نحوه عملکرد React و توانایی کار با آن، شانس شما را برای یافتن شغل افزایش می دهد.
با DOM مجازی React، رندر کردن صفحات سریعتر انجام می شود. هنگام استفاده از یک کتابخانه مسیریابی مانند React Router، صفحات مختلفی را بدون بارگیری مجدد صفحه ارائه خواهید کرد.
React کتابخانه ای است که فقط رابط کاربری برنامه ما را ارائه می کند. این به توسعه دهنده بستگی دارد که انتخاب کند با کدام ابزار کار کند، مانند کتابخانه هایی برای رندر صفحات مختلف، کتابخانه های طراحی و غیره.
React توسط بسیاری از مهندسان فرانتاند هم در استارتآپها و هم در شرکتهای تأسیسشده مانند فیسبوک، نتفلیکس، اینستاگرام، یاهو، اوبر، نیویورک تایمز و غیره استفاده شده است. اگرچه همه شرکت های ذکر شده در بالا کل محصول خود را با استفاده از React نساخته اند، برخی از صفحات آنها با استفاده از React ساخته شده اند. این به دلیل عملکرد بالا، سهولت استفاده و مقیاس پذیری React است.
React به طور کلی برای ساخت رابط کاربری فرانت اند برنامه های کاربردی وب استفاده می شود. با رندر سریع صفحات و افزایش کارایی همراه است. React می تواند برای ساخت هر محصولی که در وب اجرا می شود استفاده شود. در اینجا فقط چند مورد از چیزهایی که React معمولاً برای ساخت استفاده می شود آورده شده است:
React دارای انبوهی از ویژگی های شگفت انگیز است که همچنان آن را به یک گزینه محبوب برای توسعه دهندگان تبدیل می کند. در اینجا برخی از ویژگی های اصلی React آورده شده است:
JSX: این یک پسوند نحوی جاوا اسکریپت است که ویژگی های ES6 (ECMAScript 2015) را گسترش می دهد. این به ما اجازه می دهد تا منطق جاوا اسکریپت و نشانه گذاری را در یک جزء ترکیب کنیم.
Virtual DOM: این یک کپی از شی DOM است که ابتدا صفحات ما را بهروزرسانی میکند و زمانی که تغییرات ایجاد میشود، دوباره ارائه میشود. سپس وضعیت فعلی را با DOM اصلی مقایسه می کند تا آن را با تغییرات هماهنگ نگه دارد. این منجر به رندر سریعتر صفحه می شود.
کامپوننت ها: برنامه های React از اجزای مختلف قابل استفاده مجدد ساخته شده اند که منطق و UI مربوط به خود را دارند. این باعث میشود که برای مقیاسبندی برنامهها و بالا نگه داشتن عملکرد کارآمد باشد، زیرا شما به اندازه سایر فریم ورکها کد را تکرار نمیکنید.
React ممکن است یک ابزار محبوب برای ساختن رابط کاربری ما باشد، اما هنوز دلایلی وجود دارد که برخی از توسعهدهندگان یا مبتدیان از آن استفاده نمیکنند.
دو نوع کامپوننت اصلی در React وجود دارد: کامپوننت های کلاسی و تابعی. مستندات React در حال حاضر با استفاده از Hooks بازنویسی میشوند، که ویژگیای است که در اجزای عملکردی یافت میشود. ما در این آموزش از مؤلفه های کاربردی نیز استفاده خواهیم کرد زیرا آنها به پرکاربردترین مؤلفه های برنامه های React تبدیل شده اند. در بیشتر موارد، کامپوننتها مقداری کد HTML را با ترکیبی از مقادیر پویا ایجاد شده با استفاده از جاوا اسکریپت برمیگردانند. کامپوننت ها مانند توابع در جاوا اسکریپت ایجاد می شوند.
Angular یک چارچوب جاوا اسکریپت است که با استفاده از Typescript ساخته شده است، در حالی که Reactjs یک کتابخانه جاوا اسکریپت است و با استفاده از JSX ساخته شده است. Angular بیشتر برای ساخت برنامه های پیچیده در سطح سازمانی مانند برنامه های تک صفحه ای و برنامه های وب استفاده می شود، در حالی که React برای ساخت اجزای رابط کاربری در هر برنامه ای با داده های اغلب متغیر استفاده می شود. منحنی یادگیری Angular به دلیل عملکردهای داخلی بسیار زیاد آن شیب بیشتری دارد در حالی که اندازه بسته کوچکتر React است. اینها و برخی ویژگیهای متمایز دیگر Angular و React را اساساً متفاوت میسازند، و از این رو، باید زمینههای مشترکی را ایجاد شود تا بتوان این دو را با هم مقایسه کرد.
هدف
اتصال داده ها
زبان
اجزای رابط کاربری
تزریق وابستگی
DOM
React بهعنوان یک کتابخانه فرانت اند در مقایسه با سایر کتابخانهها/چارچوبها در جامعه توسعهدهنده به طور گسترده رشد کرده است و هیچ نشانهای از توقف نشان نمیدهد. میتوانید React را در نقشه راه توسعهدهندگان وب مدرن بیابید. با پذیرش کنونی فناوری web3 توسط توسعه دهندگان بیشتر، React همچنان ابزار مورد علاقه برای ساختن برنامه های غیرمتمرکز باقی مانده است. شما می توانید برنامه های مختلفی را با React بسازید، از برنامه های وب لیست کارهای ساده گرفته تا بازار، داشبورد و غیره.
React را می توان با بسیاری از فناوری ها مانند Bootstrap، Tailwind CSS، Axios، Redux، Firebase و بسیاری دیگر استفاده کرد. همچنین میتوانیم از React با Node.js و سایر زبانهای باطن برای ساخت برنامههای فول استک و برنامههای وب که با سرعت رعد و برق اجرا میشوند، استفاده کنیم.
پیام بگذارید