📋 محتويات الصفحة
📖 الوصف
JSON Server هو أداة تحول ملف JSON إلى REST API كامل الميزات في ثوانٍ. يوفر filtering, sorting, pagination, و relationships. مثالي للـ prototyping والتطوير أمام الخلفية.
🎯 يستخدم في
مجالات استخدام هذه الأداة
بناء API وهمي سريع للـ Frontend
prototype التطبيق قبل ربطه بالـ Backend
اختبارات الـ Integration
تدريب المطورين على Fetch APIs
Development بدون Backend حقيقي
اختبار Loading States
✨ المميزات
أبرز مميزات هذه الأداة
إنشاء API كامل من ملف JSON واحد
دعم GET
POST
PUT
PATCH
DELETE
Filtering
sorting
pagination تلقائياً
Relationships (_expand
_embed)
Search في النصوص
Middleware مخصص
CORS مفعّل تلقائياً
Hot reload عند تعديل البيانات
سريع جداً وسهل الإعداد
⚠️ العيوب
نقاط يجب مراعاتها
للـ development فقط (ليس للإنتاج)
محدود في الوظائف المتقدمة (Auth
Transactions)
لا يدعم قواعد بيانات حقيقية
بطيء مع كميات كبيرة من البيانات
💻 مثال على الاستخدام
كيفية استخدام هذه الأداة
# تثبيت
npm install -g json-server
# ملف db.json
{
"posts": [
{ "id": 1, "title": "مقال 1", "body": "...", "userId": 1 },
{ "id": 2, "title": "مقال 2", "body": "...", "userId": 2 }
],
"users": [
{ "id": 1, "name": "أحمد" },
{ "id": 2, "name": "فاطمة" }
],
"comments": [
{ "id": 1, "body": "تعليق", "postId": 1 }
]
}
# تشغيل الخادم
json-server --watch db.json --port 3001
# طلبات:
GET http://localhost:3001/posts
GET http://localhost:3001/posts?_sort=title&_order=asc
GET http://localhost:3001/posts?_page=1&_limit=10
GET http://localhost:3001/posts?title_like=مقال
GET http://localhost:3001/posts/1/comments
GET http://localhost:3001/posts?_expand=user
POST http://localhost:3001/posts -d '{"title":"جديد","body":"...","userId":1}'
📚 أدوات أخرى في DevTools
قد يعجبك أيضاً
Charles
⭐أداة intercept و debug لشبكة HTTP/HTTPS
Charles Proxy
⭐أداة Intercept و Debug لبروتوكول HTTP/HTTPS
Chrome DevTools
⭐أدوات مطوري الويب المتكاملة
Firefox DevTools
⭐أدوات مطوري الويب في Firefox
Lighthouse
⭐أداة تحليل أداء وجودة المواقع
Miraje
مكتبة محاكاة API في الذاكرة