VS Code المتكامل الخادم

VS Code حقيقي (ليس fork، ليس نسخة) يعمل داخل RoqueOS عبر code-server. نفس المحرك الذي تستخدمه على سطح المكتب، نفس الإضافات من السوق، نفس التكوين — يمكن الوصول إليه من أي متصفح مسجل دخول.

لماذا ليس مجرد "VS Code Web"

النسخة المجانية على الويب (vscode.dev، github.dev) لديها قيود صارمة:

• ❌ لا تشغل الإضافات التي تحتاج Node.js على الخادم (Python language server، ESLint كامل)
• ❌ لا يوجد Git "حقيقي" (فقط GitHub.com للتصفح فقط)
• ❌ لا يوجد طرفية مدمجة
• ❌ لا تشغل debugger

code-server الذي يعمل على RoqueOS Server هو VS Code كامل:

• ✅ سوق الإضافات يعمل (أي إضافة)
• ✅ الطرفية المدمجة تتصل بحاوية الخادم
• ✅ Git كامل (push، pull، branch، merge، stash)
• ✅ debugger لـ Node، Python، Go، إلخ
• ✅ مزامنة الإعدادات بين الأجهزة (لأنها على خادمك، وليس MS)
• ✅ معاينة مباشرة لخادم dev (إعادة توجيه المنفذ تلقائيًا)

كيفية الفتح

Launchpad → VS Code. أول مرة تستغرق ~10 ثوانٍ لـ spin up code-server. ثم تفتح فورًا.

نظام الملفات المشترك

نفس /home/user/ الذي يظهر في Terminal و Finder:

• إنشاء ملف في Finder → يظهر في Explorer لـ VS Code
• حفظ الكود في VS Code → git status في Terminal يظهره
• wget في Terminal → يظهر الملف في Explorer

الإضافات الموصى بها

السوق يعمل — ولكن بعض الإضافات تحدث فرقًا كبيرًا في الإعداد الأولي:

الأساسيات:

• GitLens — git annotations inline، blame، history
• Error Lens — الأخطاء مباشرة على السطر (دون الذهاب إلى لوحة المشاكل)
• Prettier + ESLint — التنسيق + lint
• Path Intellisense — autocomplete في مسارات الاستيراد

اللغات (ثبت حسب مجموعتك):

• Volar — Vue 3
• Tailwind CSS IntelliSense — autocomplete للفئات
• Python (Microsoft) — language server كامل
• Go (Google) — دعم Go الرسمي
• rust-analyzer — Rust
• Java Extension Pack (Red Hat)

الإنتاجية:

• Todo Tree — يجمع // TODO في لوحة
• Better Comments — color-coding // ! // ? // TODO
• Material Icon Theme — أيقونات المجلد/الملف

سير عمل Git

الطرفية المدمجة في VS Code تتصل بنفس حاوية Ubuntu. يمكنك:

git clone git@github.com:your/repo
cd repo
git checkout -b feature/x
# ... كود ...
git add -A && git commit -m "feat: new feature"
git push origin feature/x

تبقى مفاتيح SSH في /home/user/.ssh/ (دائمة). أنشئ مرة واحدة، كوّن في GitHub، انس.

معاينة مباشرة لخادم dev

تشغيل yarn dev في الطرفية المدمجة → VS Code يكتشف المنفذ (3000، 5173، إلخ) → مطالبة تلقائية "Open in browser?". انقر → يفتح في Roque Browser.

دون الحاجة إلى التعامل مع ngrok، دون الحاجة إلى تكوين إعادة توجيه المنفذ.

مزامنة الإعدادات الأصلية

تفضيلاتك (theme، keybindings، الإضافات المثبتة، snippets) تبقى على خادمك، في /home/user/.config/code-server/. تستمر بين التحديثات، تبقى على قيد الحياة عند إعادة إنشاء الحاوية.

لا تستخدم Settings Sync من Microsoft (التي تحتاج حساب GitHub/Microsoft) — أنت مالك بياناتك.

الفرق مع Roque Code

الجانب	Roque Code	VS Code (code-server)
أين يعمل	المتصفح (Monaco مستقل)	حاوية Ubuntu للخادم
الإعداد	يعمل لكل مستخدم	يحتاج Server Mode
الإضافات	❌	✅ سوق كامل
Git	❌	✅
الطرفية	❌ (استخدم تطبيق Terminal)	✅ مدمجة
Debugger	❌	✅
حجم الملف	جيد حتى 10MB	لا حد عملي
اللغات (LSP)	50+ syntax فقط	100+ مع IntelliSense كامل

قاعدة بسيطة:

• تحرير package.json أو snippet صغير → Roque Code (أسرع)
• مشروع fullstack مع Git → VS Code المتكامل

الأداء

يعمل VS Code في حاوية الخادم — يأتي UI عبر WebSocket إلى المتصفح. تعتمد زمن الاستجابة على زمن استجابة الخادم:

• خادم محلي (LAN): ~5-10ms — لا يمكن تمييزه عن VS Code الأصلي
• خادم Cloud (Hetzner DE): 180-220ms — تأخير طفيف في الكتابة (~200ms بين الضغط على المفتاح وظهور الحرف)

للتطوير المكثف مع خادم بعيد، فكر في:

• RoqueOS Server محلي على جهازك (زمن استجابة صفر)
• تطبيق سطح المكتب RoqueOS (نفس زمن الاستجابة، ولكن مع tray + اختصارات OS)

القيود

• Snippets محلية يتم حفظها على الخادم (يحتاج Server Mode للحصول على snippets). دون Server Mode، دون VS Code (استخدم Roque Code الذي هو browser-only).
• GUI debuggers معقدة التي تفتح نافذة منفصلة (Chromium debug، إلخ) قد لا تعمل بشكل كامل — استخدام debug "headless" عبر الطرفية المدمجة أفضل.
• تسريع GPU غير متاح داخل الحاوية — الإضافات التي تعرض 3D لا تعمل.

انظر أيضًا

• Roque Code — محرر browser-only دون Server Mode
• Linux Terminal — bash + roqueos-cli مثبت مسبقًا
• Containers Manager — إدارة Docker عبر UI
• App Store Docker — تثبيت Plex، Nextcloud، إلخ