Blazor - Getting Started
Blazor - بداية استخدام Blazor
Blazor هو إطار عمل (Framework) حديث من Microsoft، يتيح لك بناء تطبيقات ويب تفاعلية باستخدام C# بدلًا من JavaScript. في هذا الدرس، سنأخذك خطوة بخطوة للبدء مع Blazor بكل بساطة ووضوح.
🔹 ما هو Blazor؟
Blazor هو إطار عمل لتطوير تطبيقات الويب التفاعلية باستخدام C# بدلاً من JavaScript. يمكنك من خلاله إنشاء مكونات (Components) قابلة لإعادة الاستخدام وإدارة الواجهة الأمامية (Frontend) من خلال لغة C# الشهيرة.
🔹 أنماط استضافة Blazor
Blazor يوفر نوعين رئيسيين من الاستضافة:
- Blazor Server: يتم تنفيذ التطبيق على الخادم (Server) مع تحديثات تفاعلية تُرسل عبر SignalR.
- Blazor WebAssembly: يتم تحميل التطبيق بالكامل إلى المتصفح ويعمل بشكل مستقل باستخدام WebAssembly.
🔹 متطلبات البدء مع Blazor
لبدء استخدام Blazor، تحتاج إلى:
- Visual Studio 2022 أو إصدار أحدث، مع دعم ".NET Core" و"ASP.NET Core".
- اختيار نوع مشروع Blazor المناسب (Blazor Server أو Blazor WebAssembly).
🔹 إنشاء مشروع Blazor جديد
اتبع الخطوات التالية لإنشاء أول مشروع Blazor لك:
- افتح Visual Studio.
- اختر "Create a new project".
- ابحث عن "Blazor App" واختره.
- حدد اسم المشروع والموقع ثم اضغط "Next".
- اختر نوع الاستضافة: "Blazor Server App" أو "Blazor WebAssembly App".
- اضغط على "Create".
🔹 استكشاف بنية المشروع
بعد إنشاء المشروع، ستلاحظ وجود عدة ملفات ومجلدات مهمة:
- Pages: يحتوي على الصفحات (Pages) الخاصة بالتطبيق.
- Shared: يحتوي على المكونات المشتركة مثل القوائم (NavMenu) والرأس (Header).
- App.razor: ملف الإعدادات الأساسية للتطبيق.
- _Imports.razor: لتضمين الـ Namespaces المطلوبة في جميع الملفات Razor.
🔹 مثال على صفحة Blazor بسيطة
يمكنك إنشاء صفحة Blazor جديدة بكل بساطة عبر إضافة ملف جديد بامتداد .razor وكتابة الكود التالي:
@page "/hello"
<h3>مرحباً بك في Blazor!</h3>
<p>هذه هي أول صفحة Blazor تقوم بإنشائها.</p>
هذا المثال يقوم بإنشاء صفحة بعنوان "مرحباً بك في Blazor" عند زيارة الرابط /hello.
🔹 تشغيل التطبيق
بعد تجهيز المشروع، يمكنك تشغيله ببساطة عبر الضغط على زر "Run" (عادة يكون رمز ▶️) داخل Visual Studio. سيتم فتح المتصفح تلقائيًا وتظهر لك الواجهة الأولى لتطبيق Blazor الخاص بك.
🔹 تهانينا!
لقد قمت الآن بإنشاء أول تطبيق Blazor خاص بك! من هنا يمكنك البدء في بناء تطبيقات أكثر تعقيدًا، وإضافة مكونات جديدة، والعمل على ربطه بقاعدة بيانات، وغير ذلك الكثير.
تعليقات
إرسال تعليق