ممارسة - إعداد نموذج المشروع واستكشافه
في هذه الوحدة، يمكنك الحصول على التعليمات البرمجية للتطبيق الحالي من GitHub، وإعداد التعليمات البرمجية، وإعداد بيئة التطوير الخاصة بك.
الحصول على التعليمات البرمجية وإعدادها
في محطة bash الطرفية، انسخ مستودع التعليمات البرمجية.
git clone https://github.com/MicrosoftDocs/mslearn-module-shifting-nodejs-express-apis-to-serverless learn-functions
قم بالتغيير إلى دليل مستودع التعليمات البرمجية.
cd learn-functions
تثبيت تبعيات حزمة npm.
npm install
إنشاء التعليمات البرمجية Node.js Express وAngular.
npm run full:build
فهم بنية التطبيق
نموذج التطبيق هو Node.js التقليدية وExpress API مع أربع طرق تخدم نقاط النهاية التالية:
الأسلوب | نقطة نهاية المسار |
---|---|
GET |
vacations |
POST |
vacations |
PUT |
vacations:id |
DELETE |
vacations/:id |
افتح المشروع في Visual Studio Code، وافتح مجلد الخادم لاستكشاف بنية واجهة برمجة التطبيقات.
server
| - data
| | - vacations.json
| - models
| | - vacation.model.ts
| - routes
| | - index.ts 👈 1. Entry point
| | - vacation.routes.ts 👈 2. The vacation routes
| - services
| | - index.ts
| | - vacation.service.ts 👈 3. The logic and data
| - index.ts
| - server.ts 👈 The Express server
| - tsconfig.json
- نقطة الإدخال هي ملف الخادم/index.ts الذي يقوم بتشغيل التعليمات البرمجية server.ts لبدء تشغيل خادم Express.
- ثم يتم تحميل المسارات، مثل
/vacations
، من المجلد /routes . - تنفذ المسارات التعليمات البرمجية المناسبة في مجلد /services . يتم تعريف تكوين مخزن البيانات في ملف vacation.service.ts .
يقدم HTTP GET
تطبيق عميل Angular طلبا للمسار /api/vacations
، والمسار في routes/vacation.routes.ts
استدعاء منطق البيانات في services/vacation.service.ts
الملف للحصول على الإجازات.
تكوين الوكيل
يجب أن يكون تطبيق Angular قادرا على تقديم طلبات إلى Node.js Express API. يستخدم تطبيق Angular وكيلا لإعادة توجيه الطلبات إلى خادم Express. يمكن إعداد وكيل المستعرض من تحديد موقع خادم Express. افتح proxy.conf.json ولاحظ أنه تم تعيين المنفذ إلى 7070
، منفذ تطبيق Express.
{
"/api": {
"target": "http://localhost:7070",
"secure": false
}
}