آموزش شروع به کار با ری اکت نیتیو React Native

آموزش ویدئویی شروع به کار با React Native یکی دیگر از آموزش های گروه آموزشی پرووید می باشد که در این قسمت آن را به شما معرفی می کنیم. این بسته ی آموزشی نیز یکی از دوره های آموزشی دیگر که در حوزه ی فارسی سازی آموزش های انگلیسی تنظیم شده است می باشد. عنوان این بسته ی آموزشی یادگیری React Native است که با نام اصلی Learning React Native از شرکت Lynda منتشر شده است.

React چیست؟

React که تحت عناوین React.js و یا ReactJS نیز شناخته می شود یک کتابخانه جاوااسکریپت برای ساختن واسط کاربری برنامه و یا UI می باشد. این کتابخانه توسط فیس‌ بوک نگهداری می شود و جامعه‌ای از برنامه نویسان و کمپانی های مختلف بر روی توسعه آن کار می کنند. با استفاده از کتابخانه React به سادگی می توانیم برنامه های موبایل و همچنین برنامه های تک صفحه ای و یا SPA بسازیم.

کاربرد اصلی کتابخانه React در رندر کردن داده ها به درون DOM می باشد. به همین دلیل است که استفاده از کتابخانه React اغلب نیازمند استفاده از دیگر کتابخانه ها برای انجام عملیات state management و routing می‌باشد. Redux و React Router مثالهایی از اینگونه ابزارها می باشند. برای اطلاعات بیشتر توصیه می کنیم که از آموزش شروع به کار با ری اکت جی اس React.js استفاده کنید.

React Native چیست؟

React Native یک فریم ورک open-source برای ساخت برنامه های موبایل است که توسط فیسبوک توسعه داده شده است. این فریم ورک برای ساختن اپلیکیشن های موبایل برای پلتفرم های اندروید و iOS و وب و UWP مورد استفاده قرار می‌گیرد. با استفاده از این فریم ورک به سادگی می توانید از قابلیت های موجود در این پلتفرم ها برای ساخت برنامه های موبایل به صورت native استفاده کرد. علاوه بر این، در فریم ورک React Native یک‌ قسمت ناکامل برای QT نیز وجود دارد.

روند کار کردن و اصول فریم ورک React Native تقریباً شبیه به کتابخانه React می‌باشد. تفاوت اصلی بین React Native و کتابخانه React در این است که فریم ورک React Native بر خلاف React اقدامی برای تغییر دادن DOM از طریق Virtual DOM نمی کند. در عوض فریم ورک React Native در یک background process اجرا شده و کدهای جاوا اسکریپت نوشته شده توسط برنامه نویس را تفسیر می کند. این موضوع به طور مستقیم بر روی دستگاه موبایل کاربر اتفاق می‌افتد و از طریق یک پل ارتباطی و یا Bridge که به صورت asynchronous کار میکند از قابلیت های native مربوط به دستگاه کاربر استفاده می شود.

راه‌اندازی محیط توسعه و اجرای اپلیکیشن روی iOS و Android

در آموزش Learning React Native، مسیر شروع توسعه اپلیکیشن موبایل با آماده‌سازی محیط کار آغاز می‌شود. در این مرحله با نصب React Native، اجرای اپلیکیشن روی iOS و ایجاد Android AVD آشنا می‌شوید تا بتوانید برنامه خود را در محیط‌های شبیه‌سازی‌شده اجرا کنید. آشنایی با این مراحل به شما کمک می‌کند پیش از اضافه کردن قابلیت‌های بیشتر، ابزارهای لازم برای ساخت و بررسی اپلیکیشن را آماده کنید. همچنین استفاده از فایل‌های تمرینی آموزش، امکان دنبال کردن نمونه‌های عملی و بررسی کدهای مورد استفاده در درس‌ها را فراهم می‌کند.

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

ساخت رابط کاربری موبایل با Flexbox و دریافت ورودی کاربر

یکی از بخش‌های کاربردی Learning React Native، آشنایی با ساخت رابط کاربری و مدیریت تعاملات کاربران است. در درس‌های مربوط به Flexbox یاد می‌گیرید عناصر صفحه را برای نمایش در فضای محدود دستگاه‌های موبایل سازمان‌دهی کنید. همچنین با ScrollView آشنا می‌شوید که برای نمایش محتوای قابل پیمایش کاربرد دارد؛ قابلیتی که در صفحه‌های بلند یا فهرست‌هایی که تمام محتوای آن‌ها هم‌زمان دیده نمی‌شود، اهمیت پیدا می‌کند. این مباحث به شما کمک می‌کنند ساختار صفحه را متناسب با محتوای اپلیکیشن طراحی کنید.

در ادامه، پاسخ دادن به لمس صفحه دستگاه و جمع‌آوری داده از کاربر بررسی می‌شود. این قابلیت‌ها پایه ساخت صفحه‌هایی هستند که صرفاً اطلاعات ثابت نشان نمی‌دهند، بلکه به اقدامات کاربر واکنش دارند و ورودی دریافت می‌کنند. ترکیب Native Component ها با چیدمان Flexbox و ابزارهایی مانند ScrollView، زمینه لازم را برای ساخت صفحه‌های واقعی‌تر فراهم می‌کند. اگر قصد دارید پس از آشنایی با مفاهیم اولیه React وارد توسعه اپلیکیشن موبایل شوید، این درس‌ها نمونه‌ای از اتصال ساختار بصری صفحه به رفتارهای تعاملی آن را ارائه می‌کنند.