آموزش ساخت اپلیکیشن های چندسکویی با .NET MAUI و Blazor
آموزش ساخت اپلیکیشن های چندسکویی با .NET MAUI و Blazor با عنوان اصلی Creating .NET MAUI Applications with Blazor یکی دیگر از آموزش های گروه آموزشی پرووید می باشد که در این قسمت آن را به شما معرفی می کنیم. در این آموزش با نحوه ترکیب قابلیت های Blazor و .NET MAUI برای توسعه اپلیکیشن های چندسکویی آشنا می شوید. همچنین یاد می گیرید چگونه رابط کاربری مشترکی برای وب و اپلیکیشن موبایل ایجاد کنید، از قابلیت های بومی دستگاه استفاده کنید و اپلیکیشن خود را به یک Back End متصل کنید.
.NET MAUI و Blazor چیست و چه کاربردی دارند؟
.NET MAUI یک فریم ورک چندسکویی از Microsoft برای ساخت اپلیکیشن های Native در پلتفرم های مختلف مانند Android، iOS، Windows و macOS است. از طرف دیگر، Blazor امکان توسعه رابط کاربری وب را با استفاده از C# و Razor فراهم می کند. ترکیب این دو فناوری به توسعه دهندگان اجازه می دهد از مهارت ها و کامپوننت های Blazor برای ساخت رابط کاربری اپلیکیشن های موبایل استفاده کنند.
در یک اپلیکیشن .NET MAUI Blazor، بخش هایی از رابط کاربری با استفاده از Blazor و داخل یک WebView اجرا می شوند و در کنار آن می توان از صفحات و قابلیت های Native مربوط به .NET MAUI نیز استفاده کرد. درک معماری این نوع اپلیکیشن ها، نحوه ترکیب صفحات Blazor و MAUI، انتقال داده بین بخش های مختلف و دسترسی به Native API ها از موضوعات مهم این حوزه است.
ساخت رابط کاربری موبایل با .NET MAUI و Blazor
یکی از چالش های توسعه اپلیکیشن موبایل، طراحی رابط کاربری مناسب برای صفحه نمایش های مختلف و مدیریت تجربه کاربری در محیط موبایل است. Blazor این امکان را فراهم می کند تا با استفاده از Razor Components رابط کاربری ایجاد کنید و در صورت نیاز از کتابخانه های JavaScript و npm نیز کمک بگیرید. در این آموزش با استفاده از Ionic و Blazor با روش های مختلف طراحی رابط کاربری موبایل آشنا می شوید.

مدیریت Navigation نیز در اپلیکیشن هایی که صفحات Native و Blazor را با هم ترکیب می کنند اهمیت زیادی دارد. در این شرایط، داشتن یک سرویس یکپارچه برای مسیریابی می تواند مدیریت انتقال بین صفحات را ساده تر کند. همچنین یاد می گیرید چگونه از ساختار و کامپوننت های Ionic در Razor Pages استفاده کنید و نوار Navigation این کتابخانه را در کنار Blazor به کار بگیرید.
ساخت اپلیکیشن مشترک برای وب و موبایل با Blazor
یکی از مزیت های مهم استفاده از Blazor در کنار .NET MAUI، امکان استفاده مجدد از بخش قابل توجهی از کد و رابط کاربری در نسخه وب و اپلیکیشن موبایل است. به جای توسعه دو رابط کاربری کاملاً جداگانه، می توانید با استفاده از Razor Class Libraries کامپوننت ها و منطق مشترک را در پروژه های مختلف به اشتراک بگذارید. البته تفاوت های محیط وب و اپلیکیشن موبایل نیز باید در طراحی و پیاده سازی رابط کاربری در نظر گرفته شوند.
در این مسیر با روش مدیریت تفاوت های UI در وب و موبایل، ذخیره سازی داده های محلی و چالش های به روزرسانی اپلیکیشن آشنا می شوید. همچنین نقش Service Worker در HTML5 و WebAssembly را بررسی می کنید و با IndexedDB برای ذخیره سازی داده در محیط وب کار خواهید کرد. این مفاهیم به شما کمک می کنند ساختاری طراحی کنید که بخش های مشترک آن در چند محیط قابل استفاده باشند.
اتصال اپلیکیشن .NET MAUI Blazor به Back End
بسیاری از اپلیکیشن های واقعی برای دریافت و ارسال اطلاعات به یک Back End نیاز دارند. برای برقراری ارتباط امن با سرویس های سمت سرور، احراز هویت و مدیریت دسترسی کاربران از موضوعات مهم در توسعه اپلیکیشن هستند. در این آموزش با استفاده از Auth0 با مفاهیم و مراحل پیاده سازی Authentication آشنا می شوید و یاد می گیرید چگونه فرآیند احراز هویت را در اپلیکیشن خود مدیریت کنید.

پس از پیاده سازی Authentication، نحوه استفاده از Token برای برقراری ارتباط با سرویس های محافظت شده اهمیت پیدا می کند. Token اطلاعات لازم برای شناسایی و تأیید هویت کاربر را در اختیار سیستم قرار می دهد و می تواند در درخواست های ارسالی به Back End استفاده شود. آشنایی با این فرآیند به شما کمک می کند ارتباط بین اپلیکیشن چندسکویی و سرویس های سمت سرور را با ساختار مناسب تری پیاده سازی کنید.
مزایای یادگیری توسعه اپلیکیشن با .NET MAUI و Blazor
یادگیری ترکیب .NET MAUI و Blazor برای توسعه دهندگانی که با C# و اکوسیستم .NET کار می کنند، فرصت استفاده از دانش فعلی در پروژه های چندسکویی را فراهم می کند. به کمک این ترکیب می توانید از کامپوننت های Razor برای ساخت رابط کاربری استفاده کنید و در عین حال به قابلیت های Native دستگاه دسترسی داشته باشید. همچنین امکان اشتراک گذاری کد بین نسخه وب و موبایل می تواند از تکرار بخش هایی از فرآیند توسعه جلوگیری کند.
این رویکرد به ویژه زمانی کاربرد دارد که یک محصول به نسخه وب و موبایل نیاز داشته باشد و بخشی از منطق و رابط کاربری آن در هر دو محیط مشترک باشد. البته انتخاب این معماری به نیازهای پروژه، میزان وابستگی به قابلیت های Native و محدودیت های رابط کاربری بستگی دارد. درک این ملاحظات به شما کمک می کند هنگام طراحی معماری یک پروژه، انتخاب آگاهانه تری داشته باشید.
این آموزش برای چه کسانی مناسب است؟
این آموزش برای توسعه دهندگانی مناسب است که با C# و مفاهیم اولیه توسعه نرم افزار آشنایی دارند و می خواهند از Blazor و .NET MAUI برای ساخت اپلیکیشن های موبایل استفاده کنند. اگر تجربه توسعه وب با ASP.NET Core و Razor دارید، یادگیری نحوه استفاده از این مهارت ها در محیط موبایل می تواند مسیر ورود شما به توسعه اپلیکیشن های چندسکویی را هموارتر کند.
همچنین توسعه دهندگانی که قصد دارند یک رابط کاربری مشترک برای وب و موبایل ایجاد کنند یا با موضوعاتی مانند Navigation، Native API، ذخیره سازی محلی و Authentication در اپلیکیشن های Blazor آشنا شوند، می توانند از مباحث این دوره استفاده کنند. در طول آموزش علاوه بر بررسی مفاهیم، چالش های عملی و راه حل آن ها نیز مطرح می شوند تا بتوانید موضوعات را در قالب مثال های کاربردی دنبال کنید.
سرفصل مطالب آموزش ویدئویی ساخت اپلیکیشن های چندسکویی با .NET MAUI و Blazor
فصل اول: مقدمه
- قدرت Blazor و .NET MAUI
- پیشنیازهای لازم برای گذراندن این دوره
- آمادهسازی سیستم برای شروع دوره
فصل دوم: استفاده از .NET MAUI و Blazor برای توسعه اپلیکیشنهای موبایل
- چه زمانی انتخاب یک اپلیکیشن .NET MAUI Blazor مناسب است؟
- معماری یک اپلیکیشن .NET MAUI Blazor
- ترکیب صفحات .NET MAUI و صفحات Blazor - بخش اول
- ترکیب صفحات .NET MAUI و صفحات Blazor - بخش دوم
- انتقال دادهها
- دسترسی به APIهای بومی دستگاه
- تمرین: پیادهسازی مسیریابی و انتقال داده
- راهحل تمرین: پیادهسازی مسیریابی و انتقال داده
فصل سوم: طراحی و استایلدهی رابط کاربری موبایل در .NET MAUI Blazor
- گزینههای مختلف برای طراحی رابط کاربری
- استفاده از Ionic و Blazor برای افزودن کتابخانههای npm
- چرا مسیریابی در اپلیکیشنهای .NET MAUI Blazor یک چالش است؟
- ایجاد یک سرویس مسیریابی یکپارچه - بخش اول
- ایجاد یک سرویس مسیریابی یکپارچه - بخش دوم
- ایجاد یک سرویس مسیریابی یکپارچه - بخش سوم
- افزودن دستورات Ionic به Razor Pages
- استفاده از نوار مسیریابی Ionic در Blazor
- تمرین: پیادهسازی دستورات Ionic در فهرست یادداشتها
- راهحل تمرین: پیادهسازی دستورات Ionic در فهرست یادداشتها
فصل چهارم: ساخت راهکاری مشترک برای وبسایت و اپلیکیشن
- یک وبسایت واحد برای مدیریت همه پلتفرمها
- APIهای بومی دستگاه چه میشوند؟
- کتابخانههای Razor Class Library
- مدیریت تفاوتهای رابط کاربری بین وبسایت و اپلیکیشن
- ذخیرهسازی دادهها بهصورت محلی - بخش اول
- ذخیرهسازی دادهها بهصورت محلی - بخش دوم
- چالشهای بهروز نگه داشتن اپلیکیشن
- آشنایی با Service Worker در HTML5 و WebAssembly
- تمرین: پیادهسازی IndexedDB
- راهحل تمرین: پیادهسازی IndexedDB
فصل پنجم: تعامل با Back End
- راهاندازی Auth0
- پیادهسازی احراز هویت با Auth0 - بخش اول
- پیادهسازی احراز هویت با Auth0 - بخش دوم
- پیادهسازی احراز هویت با Auth0 - بخش سوم
- تمرین: استفاده از Token
- راهحل تمرین: استفاده از Token
فصل ششم: جمع بندی
- مراحل بعدی








