حاويات تطبيقات TypeScript باستخدام Docker: دليل شامل

لماذا تعتبر حاويات تطبيقات TypeScript أمرًا لا غنى عنه للمطور الحديث

تخيل الموقف: لقد كتبت تطبيق TypeScript رائعًا على جهاز MacBook الخاص بك، وكل شيء يعمل بشكل مثالي. تقوم بتحميل الكود إلى خادم يعمل بنظام Ubuntu - وتواجه مجموعة من الأخطاء. هل هذا مألوف؟ المشكلة تكمن في اختلاف البيئات: إصدارات Node.js، المكتبات النظامية، متغيرات البيئة. Docker يحل هذه المشكلة مرة واحدة وإلى الأبد. حاويات تطبيقات TypeScript تتيح لك تعبئة الكود مع جميع التبعيات في حاوية معزولة، والتي ستعمل بنفس الطريقة على أي خادم، في السحابة، أو على جهاز زميلك المحلي.

في هذه المقالة، سنشرح كيفية حاويات تطبيق TypeScript بشكل صحيح باستخدام Docker. ستتعلم ليس فقط الخطوات الأساسية، ولكن أيضًا التقنيات المتقدمة: البناء متعدد المراحل، تحسين حجم الصورة، تخزين التبعيات المؤقت، والعمل مع متغيرات البيئة. هيا بنا!

ما هو Docker ولماذا يحتاجه مطور TypeScript

Docker هي منصة لإنشاء وتسليم وتشغيل التطبيقات في حاويات. الحاوية هي بيئة خفيفة ومستقلة تحتوي على كل ما هو ضروري لتشغيل تطبيق TypeScript الخاص بك: الكود، بيئة التشغيل (Node.js)، الأدوات النظامية، المكتبات، والإعدادات.

مزايا مشاريع TypeScript واضحة:

\n
• قابلية تكرار البيئة - لا مزيد من "يعمل لدي" و"تعطل في الإنتاج".
\n
• العزل - كل تطبيق يعمل في حاويته الخاصة، دون التأثير على الخدمات الأخرى.
\n
• قابلية التوسع - من السهل تشغيل 10 نسخ من خادم TypeScript الخاص بك عبر Docker Compose أو Kubernetes.
\n
• سهولة النشر - يمكن تشغيل صورة واحدة على أي منصة: AWS، Google Cloud، DigitalOcean أو محليًا.
\n

المتطلبات الأساسية

قبل البدء، تأكد من تثبيت ما يلي:

\n
• Docker - قم بتنزيله من الموقع الرسمي (يعمل على Windows، macOS، Linux).
\n
• Node.js الإصدار 18 أو أعلى (لتجميع TypeScript).
\n
• TypeScript - مثبت عالميًا أو محليًا في المشروع.
\n

كمثال، سنأخذ تطبيق Express بسيطًا مكتوبًا بـ TypeScript. لكن النهج عام: يمكنك حاويات أي مشروع TypeScript - من بوت Telegram إلى خادم NestJS.

هيكل المشروع

لنبدأ بإنشاء هيكل أدنى لتطبيق TypeScript:

my-typescript-app/\n├── src/\n│   └── index.ts\n├── package.json\n├── tsconfig.json\n└── Dockerfile

سيحتوي الملف src/index.ts على خادم HTTP بسيط:

import express from 'express';\nconst app = express();\nconst PORT = process.env.PORT || 3000;\n\napp.get('/', (req, res) => {\n  res.send('Hello from TypeScript + Docker!');\n});\n\napp.listen(PORT, () => {\n  console.log(`Server is running on port ${PORT}`);\n});

الملف tsconfig.json مع الإعدادات الأساسية:

{\n  "compilerOptions": {\n    "target": "ES2020",\n    "module": "commonjs",\n    "outDir": "./dist",\n    "rootDir": "./src",\n    "strict": true,\n    "esModuleInterop": true\n  }\n}

كتابة أول Dockerfile لتطبيق TypeScript

أبسط طريقة هي إجراء بناء أحادي المرحلة. لكننا سنتبع الطريق الصحيح فورًا وننشئ بناء متعدد المراحل. سيسمح هذا بتقليل حجم الصورة النهائية عدة مرات.

# Stage 1: Build\nFROM node:18-alpine AS builder\nWORKDIR /app\nCOPY package*.json ./\nRUN npm install\nCOPY . .\nRUN npm run build\n\n# Stage 2: Production\nFROM node:18-alpine\nWORKDIR /app\nCOPY --from=builder /app/dist ./dist\nCOPY --from=builder /app/package*.json ./\nRUN npm install --production\nEXPOSE 3000\nCMD ["node", "dist/index.js"]

دعنا نشرح كل مرحلة:

\n
• bu