البرنامج التعليمي ونماذج التعليمات البرمجية لـ ASP.NET 5 SPA مع React
ملخص
يتبع ذلك ما يلي لإنشاء رموز القالب الافتراضية.
- https://docs.microsoft.com/en-us/aspnet/core/client-side/spa/react?view=aspnetcore-5.0&tabs=netcore-cli
يمكنك التحقق مما يلي للحصول على شرح أكثر تفصيلا.
- https://dev.to/packt/creating-spas-using-asp-net-core-and-react-59a0
هيكل المجلد هو التالي
- مجلد my-new-app ClientApp: هذا هو تطبيق React. سيتم تقديم مخرجات البناء في مجلد البناء.
- مجلد my-new-app Controllers: يحتوي هذا على واجهة برمجة تطبيقات ويب وهمية يمكن لتطبيق React إرسال الطلبات إليها.
- لتمرير أي بيانات من الواجهة الخلفية إلى الواجهة الأمامية، يجب على المرء استخدام Web API. إذا كانت البيانات مطلوبة قبل المصادقة، فيمكن إنشاء مسار API دون الحاجة إلى المصادقة لتمرير البيانات التي لا تحتاج إلى الحماية.
- مجلد my-new-app Pages: يحتوي هذا على بعض صفحات ASP.NET Razor القياسية.
- my-new-app Program.cs: هذا هو ملف ASP.NET القياسي.
- my-new-app Startup.cs: يحدد هذا أن هذا يخدم ملفات SPA الثابتة من مجلد CilentApp build. يؤدي هذا أيضًا إلى إعداد Web API.
- my-new-app WeatherForcast.cs: يحتوي هذا على النموذج المستخدم بواسطة واجهة برمجة تطبيقات الويب الوهمية.
بعد تشغيل التطبيق، افتح https://localhost:5001 لرؤية موقع الويب.
وشملت إجراءات جيثب
- بناء واختبار DOTNET
- كود كيو إل
ملحقات Visual Studio Code المفيدة
- https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp
- https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory
مراجع مفيدة لرمز Visual Studio
- https://docs.microsoft.com/en-us/dotnet/core/tutorials/with-visual-studio-code#debug
- https://docs.microsoft.com/en-us/dotnet/core/tools/
- https://stackoverflow.com/questions/34275209/xml-auto-commenting-c-sharp-in-visual-studio-code
- https://stackoverflow.com/questions/47995468/vscode-c-sharp-go-to-definition-f12-not-working
- https://www.strathweb.com/2019/04/roslyn-analyzers-in-code-fixes-in-omnisharp-and-vs-code/
أوامر .NET CLI مفيدة
- (قم بإنشاء القالب الافتراضي للواجهة الخلفية والواجهة الأمامية) dotnet new React -o my-new-app
- (بوويرشيل) SET ASPNETCORE_ENVIRONMENT=Development
- (في مجلد تطبيقي الجديد) بناء الدوت نت
- (في مجلد تطبيقي الجديد) تشغيل الدوت نت
