آموزش ارتباط بلیزر با جاوا اسکریپت JavaScript Interop یکی دیگر از آموزش های گروه آموزشی پرووید می باشد که در این قسمت آن را به شما معرفی می کنیم. این بسته ی آموزشی نیز یکی از دوره های آموزشی دیگر که در حوزه ی فارسی سازی آموزش های انگلیسی تنظیم شده است می باشد. عنوان این بسته ی آموزشی کار کردن با جاوا اسکریپت از درون اپلیکیشن های Blazor است که با نام اصلی JavaScript Interop in Blazor Applications از شرکت Pluralsight منتشر شده است.

Blazor چیست؟

تکنولوژی Blazor می تواند در سمت کلاینت با زبان برنامه نویسی سی شارپ و به طور مستقیم در مرورگر کاربر با استفاده از استاندارد WebAssembly اجرا بگردد. از آنجایی که این تکنولوژی به صورت واقعی کدهای دات نت را سوار بر WebAssemnly اجرا می کند شما می توانید از Library هایی که در سمت سرور ایجاد کرده اید در برنامه استفاده کنید. علاوه بر این موضوع، تکنولوژی Blazor می تواند client logic خود را بر روی سرور اجرا نمایند. UI Event های مربوط به کلاینت به سمت سرور با استفاده از یک کانکشن بسیار پرسرعت SignalR ارسال شده و پاسخ ها دریافت می گردند. زمانی که اجرا تکمیل بگردد، تغییرات مربوط به UI به سمت کلاینت ارسال شده و به درون DOM ترزیق می گردد. تکنولوژی Blazor بر اساس استاندارد های وب تنظیم گردیده است و به همین دلیل نیازی به نصب کردن پلاگین خاصی و یا اصطلاحاً مراحل Code Transpilation ندارد. تکنولوژی Blazor بر روی مرورگرهای مدرن وب و همچنین مرورگرهای دستگاه های موبایل به سادگی کار می‌کند. کدهای نوشته شده با Blazor می‌توانند در مرورگر کاربر و در یک Security Sandbox شبیه به فریم ورک های جاوا اسکریپت اجرا بگردند. کدهای بلیزری که بر روی سرور اجرا می شوند انعطاف پذیری بالایی دارند و می‌توانند از قابلیت‌ های سرور استفاده نمایند و به طور مستقیم با دیتابیس در ارتباط باشند. برای یادگیری Blazor توصیه می کنیم که از آموزش شروع به کار با بلیزیر Blazor در ASP.NET Core دیدن کنید.

ارتباط با جاوا اسکریپت (JavaScript Interop)

یک اپلیکشن Blazor می‌تواند توابع جاوا اسکریپت را از درون متدهای دات نت صدا بزند و همچنین متدهای دات نت را از درون توابع جاوا اسکریپت فراخوانی کند. این سناریو را اصطلاحاً JavaScript Interoperability و یا به طور کوتاه JavaScript Interop می گویند. با استفاده از JavaScript Interop شما می توانید از قابلیت های مختلف جاوا اسکریپت و کتابخانه‌ های آن در کدهای دات نت نوشته شده در تکنولوژی Blazor استفاده کنید. برای پیاده سازی JavaScript Interop از یک اینترفیس به اسم IJSRunTime استفاده می‌کنید. به منظور انجام این کار، این اینترفیس را به درون کامپوننت های مورد نظر خود تزریق کرده و سپس به راحتی از آن استفاده می کنید. متد InvokeAsync یک شناسه که مشخص کننده تابع جاوا اسکریپت است را دریافت می‌کند و سپس با استفاده از پارامتر هایی که در قالب آرگومانهای JSON به آن تحویل میدهید تابع مورد نظر را فراخوانی می نمایند. مورد دیگر اینکه شناسه تابع مورد نظر بر اساس Global Scope و یا همان window تعریف می‌گردد. بنابراین اگر قرار است که یک تابع به صورت window.someScope.someFunction را صدا بزنید شناسه به صورت someScope.someFunction خواهد بود. قبل از استفاده کردن از توابع نیازی به رجیستر کردن آنها ندارید. متد InvokeAsync به صورت جنریک نیز پیاده سازی شده است. برای لحاظ کردن پارامتر جنینی این متد می‌بایست یک Type را در نظر بگیرید که تطابق بسیار زیادی با JSON برگردانده شده توسط متد جاوا اسکریپت داشته باشد.

سرفصل مطالب آموزش ویدئویی ارتباط با جاوا اسکریپت (JavaScript Interop) در Blazor

فصل اول: مقدمه این دوره آموزشی

• مقدمه این دوره آموزشی

فصل دوم: بررسی نیاز به استفاده از جاوا اسکریپت در Blazor

• مقدمه
• چرا از JavaScript در برنامه Blazor خود استفاده می کنید؟
• سناریوهای پشتیبانی شده جاوا اسکریپت را بشناسد
• نگاهی به برنامه Blazor مورد استفاده در این دوره
• طرح کلی دوره

فصل سوم: فراخوانی توابع جاوا اسکریپت از .NET

• مقدمه
• اضافه کردن یک فایل جاوا اسکریپت به برنامه Blazor
• ایجاد کردن یک تابع جاوا اسکریپت در Global Scope
• فراخوانی یک تابع جاوا اسکریپت که Void بر می گرداند
• انتقال یک شی NET. به یک تابع جاوا اسکریپت
• فراخوانی یک تابع جاوا اسکریپت که مقداری را برمی گرداند
• ایجاد یک Object بعنوان یک مقدار بازگشتی
• انتقال یک رفرنس از یک HTML Element به یک تابع جاوا اسکریپت
• درک جاوا اسکریپت Interop در Component Lifecycle
• بررسی یک Server Prerendering بطورعملی
• استفاده از JavaScript Interop در چرخه حیات کامپوننت
• تمرکز بر یک قسمت از Blazor از طریق جاوا اسکریپت
• رسیدگی به خطاهای جاوا اسکریپت در دات نت
• فراخوانی توابع جاوا اسکریپت به صورت همزمان
• جمع بندی

فصل چهارم: فراخوانی متدهای دات نت از جاوا اسکریپت

• مقدمه
• فراخوانی یک متد استاتیک در دات نت از طریق جاوا اسکریپت
• استفاده از Method Identifier سفارشی
• فراخوانی یک Instance Method در دات نت از طریق جاوا اسکریپت
• فراخوانی یک متد کامپوننت از مدیریت Event در جاوا اسکریپت
• جمع بندی

فصل پنجم: ادغام API های مرورگر در برنامه Blazor شما

• مقدمه
• بررسی کردن Local Storage
• بررسی کردن کد سی شارپ تولید شده
• ذخیره داده ها در Local Storage
• بررسی کنید که آیا مرورگر آنلاین است یا خیر
• جمع بندی

فصل ششم: استفاده از JavaScript Interop در Class Library های Razor

• مقدمه
• انتقال دادن یک کامپوننت Blazor به کتابخانه جاوا اسکریپت
• استفاده از کامپوننت Blazor در برنامه Blazor
• بررسی کردن به Map کامپوننت و Libraryهای آن
• جمع بندی

فصل هفتم: قرار دادن کامپوننت های جاوا اسکریپت در NET.

• مقدمه
• درک سناریوی استفاده از Data Grid
• یک نمونه جاوا اسکریپت را مشاهده کنید که از Ag-Grid استفاده می کند
• ایجاد کردن یک کامپوننت BlazorAgGrid
• مقداردهی کردن جاوا اسکریپت و کامپوننت Wrapped شده
• استفاده از BlazorAgGrid در برنامه Blazor
• اضافه کردن یک پارامتربه کامپوننت RowData
• پشتیبانی از BlazorAgGrids چندگانه در Single Page
• پیاده سازی IDisposable برای انجام Clean Up
• بررسی مفاهیم Server Prerendering و Disposing
• اضافه کردن یک رویداد OnSelectionChanged
• استفاده از رویداد OnSelectionChanged
• نادیده گرفتن ShouldRender Method
• پاس دادن Column Definition ها از دات نت به جاوا اسکریپت
• اضافه کردن یک پارامتر کامپوننت AutoGenerateColumns
• ایجاد یک کامپوننت BlazorAgGridColumn
• جمع بندی