Ahmed Sadek Elamine Touahria

من جانب السيرفر فإن MQTT هي من أقوى تقنيات الوقت الفعلي والتي تعتمد عليها أغلب شركات العالم مثل أمازون وجوجل وغيرها . حيث توفر أداء عالي وتكلفة أقل والكثير من الميزات 

سيكون فيه تقريبا حوالي 5 جدوال 
جدول Customer  جدول Order علاقة 1 لكثير مع Customer  OrderItem علاقة 1 لكثير مع Order و Product جدول Product  جدول Category علاقة واحد لكثير مع Product  يمكنك تصفح بعض هذه المقالات للمزيد من الأفكار والمعلومات 
https://io.hsoub.com/programming/89766-ما-هو-نظام-mvc
 

نص الخطأ يوضح بأنك عند إنشاءك لمفاتيح token الخاصة ب google auth لم تقم بإضافة urls الخاصة ب test مثل localhost و 127.0.0.1 . لذلك يرجى الذهاب إلى https://console.developers.google.com/ ثم اختيار تطبيقك وقم بإضافة url التي تعمل عليها
 

يمكنك الحصول على أبعاد صورة النص المقدمة باستخدام text.get_rect () ، والذي يقوم بإرجاع كائن Rect بسمات العرض والارتفاع ، من بين أمور أخرى (انظر التوثيق الرسمي للمزيد من التفاصيل). بمعنى آخر. يمكنك ببساطة عمل text.get_rect (). width.
مثال 
# رسم نص font = pygame.font.Font(None, 25) text = font.render("Hello World", True, BLACK) text_rect = text.get_rect(center=(SCREEN_WIDTH/2, SCREEN_HEIGHT/2)) screen.blit(text, text_rect) النتيجة :

عند الانتهاء من المشروع تقوم بإرفاق مجلد المشروع مع ملف backup حتى يستطيع الشخص التعامل مع نفس البيانات بواسطة عمل restore database التي وضحتها في الإجابة السابقة

أرقام فيبوناتشي هي الأرقام الموجودة في تسلسل الأعداد الصحيحة التالية. 0 ، 1 ، 1 ، 2 ، 3 ، 5 ، 8 ، 13 ، 21 ، 34 ، 55 ، 89 ، 144 ، …… .. من الناحية الرياضية ، يتم تحديد تسلسل Fn لأرقام فيبوناتشي من خلال علاقة التكرار
Fn = Fn-1 + Fn-2 F0 = 0 and F1 = 1. الطريقة الأسهل هي استعمال العودية ولكن تستغرق وقت حتى يتم ينفيذها 
def fibonacci(n): if n <= 1: return n return fibonacci(n-1) + fibonacci(n-2) درجة التعقيد هي 2 قوى n ، وهي كبيرة جدا 
لأن هذه هي العميات التي تتم 
fib(5) / \ fib(4) fib(3) / \ / \ fib(3) fib(2) fib(2) fib(1) / \ / \ / \ fib(2) fib(1) fib(1) fib(0) fib(1) fib(0) / \ fib(1) fib(0) لحساب fib(5) يتم تنفيذ 15 عملية وهذا غير جيد . 
الطريقة الثانية باستعمال البرمجة الديناميكية 
def fibonacci(n): # أخذ أول رقمين فيبوناتشي على هيئة 0 و 1 f = [0, 1] for i in range(2, n+1): # نملأ الجدول f.append(f[i-1] + f[i-2]) return f[n] print(fibonacci(9)) درجة التعقيد هنا هي فقط O(n)
الطريقة الثالثة باستعمال المصفوفات 
طريقة صعبة ولكن ذو سرعة عالية وتعقيد اقل 
MAX = 1000 # إنشاء مجموعة للحفظ f = [0] * MAX # إرجاع رقم فيبوناتشي n باستخدام الجدول f [] def fib(n) : # الحالات الأساسية if (n == 0) : return 0 if (n == 1 or n == 2) : f[n] = 1 return (f[n]) # إذا تم حساب Fib (n) بالفعل if (f[n]) : return f[n] if( n & 1) : k = (n + 1) // 2 else : k = n // 2 # تطبيق الصيغة أعلاه [قيمة الملاحظة n & 1 هي 1 # إذا كان n فرديا ، وإلا 0. if((n & 1) ) : f[n] = (fib(k) * fib(k) + fib(k-1) * fib(k-1)) else : f[n] = (2*fib(k-1) + fib(k))*fib(k) return f[n]  
درجة التعقيد هنا هي فقط O(logn) فقط !

تم تصميم HTML مع مراعاة القابلية للتوسعة للبيانات التي يجب أن ترتبط بعنصر معين ولكن لا يلزم أن يكون لها أي معنى محدد. تسمح لنا سمات data- * بتخزين معلومات إضافية حول عناصر HTML القياسية والدلالات دون الاختراقات الأخرى مثل السمات غير القياسية أو الخصائص الإضافية على DOM. بناء syntax بسيط. أي سمة على أي عنصر يبدأ اسم السمة ب data- هي سمة بيانات. لنفترض أن لديك مقالًا وتريد تخزين بعض المعلومات الإضافية التي لا تحتوي على أي تمثيل مرئي. فقط استخدم سمات البيانات لذلك: <article id="electric-cars" data-columns="3" data-index-number="12314" data-parent="cars"> … </article> الوصول من javascript  قراءة قيم هذه السمات في JavaScript بسيطة للغاية أيضًا. يمكنك استخدام getAttribute () مع اسم HTML الكامل لقراءتها ، لكن المعيار يحدد طريقة أبسط: DOMStringMap يمكنك قراءته عبر خاصية مجموعة البيانات.
للحصول على سمة بيانات من خلال كائن مجموعة البيانات ، احصل على الخاصية بجزء من اسم السمة بعد " data- " (لاحظ أنه يتم تحويل الشرطات إلى camelCase).
const article = document.querySelector("#electric-cars"); article.dataset.columns; // "3" article.dataset.indexNumber; // "12314" article.dataset.parent; // "cars" تفحص أكثر
 https://wiki.hsoub.com/CSS/attr
https://wiki.hsoub.com/HTML

توجد مكتبة مشهورة لتحميل مقاطع اليوتيوب ، pytube 
يغطي هذا الدليل أبسط استخدامات المكتبة. لمزيد من المعلومات التفصيلية ، يرجى الرجوع إلى pytube.io.
تثبيت الحزمة أو المكتبة  python -m pip install pytube  
لتنزيل مقطع فيديو باستخدام المكتبة في برنامج نصي ، ستحتاج إلى استيراد فصل YouTube من المكتبة وتمرير وسيطة لعنوان URL للفيديو. من هناك ، يمكنك الوصول إلى التدفقات وتنزيلها.
>>> from pytube import YouTube >>> YouTube('https://youtu.be/2lAe1cqCOXo').streams.first().download() >>> yt = YouTube('http://youtube.com/watch?v=2lAe1cqCOXo') >>> yt.streams ... .filter(progressive=True, file_extension='mp4') ... .order_by('resolution') ... .desc() ... .first() ... .download()  
بالنسبة لتيكتوك أنصحك بالحزمة TikTokApi 
 

مثلا ، نأخذ هذا السكريبت
def catch(): ... try: ... asd() ... except Exception as e: ... print e.message, e.args ... >>> catch() global name 'asd' is not defined ("الاسم asd غير معرف",)  
لكنه لا يمسك BaseException أو استثناءات الخروج من النظام SystemExit و KeyboardInterrupt و GeneratorExit:
>>> def catch(): ... try: ... raise BaseException() ... except Exception as e: ... print e.message, e.args ... >>> catch() Traceback (most recent call last): File "<stdin>", line 1, in <module> File "<stdin>", line 3, in catch BaseException >>> def catch(): ... try: ... raise BaseException() ... except: ... pass ... >>> catch() >>> تنبع جميع الاستثناءات من BaseException ، وتلك التي من المفترض أن تلتقطها يومًا بعد يوم (تلك التي سيتم طرحها للمبرمج) ترث أيضًا من Exception. 
 
 

في هذا المثال ، نتلاشى في صورة عند التمرير بإضافة فئة fadeIn إليها عندما تدخل منفذ العرض. هذا هو js:
const img = document.querySelector("img") const callback = (entries, observer) => { entries.forEach((entry) => { if (entry.isIntersecting) { entry.target.classList.add("fadeIn") } }) } const options = {} const myObserver = new IntersectionObserver(callback, options) myObserver.observe(img) إنشاء مراقب التقاطع intersection observer
أولاً ، نقوم بإنشاء مراقب تقاطع عن طريق استدعاء المُنشئ الخاص به وتمريره وظيفة callback وكائن خيارات اختياري.
الخيارات كائن له 3 خصائص:
const options = { root: null, rootMargin: '0px', threshold: 0 } root : افتراضي فارغ. إنه منفذ العرض. يمكن أن يكون المستند أو عنصر HTML. إذا كان الجذر فارغًا ، يتم تعيين المستند افتراضيًا. rootMargin: الافتراضي 0 بكسل. يحدد إزاحات كل جانب من المربع المحيط بالجذر. بمعنى آخر ، تقلل القيم الموجبة من المربع المحيط بالجذر وتزيده القيم السالبة. حاول تمرير المربعات الثلاثة في هذا المثال. callback 
const callback = (entries, observer) => { entries.forEach(entry => { // يصف كل إدخال تغييرًا في التقاطع لواحد تمت ملاحظته // العنصر الهدف: // entry.boundingClientRect // entry.intersectionRatio // entry.intersectionRect // entry.isIntersecting // entry.rootBounds // entry.target // entry.time }); }; لقد استخدمتهما في تحريك fadeIn:
const callback = (entries, observer) => { entries.forEach((entry) => { if (entry.isIntersecting) { entry.target.classList.add("fadeIn") } }) } لتحديد عنصر مراد مراقبته ، نستخدم دالة observe()  الخاصة بمراقب التقاطع.
إذا كنت تريد ملاحظة العديد من العناصر ، فعليك إضافتها واحدة تلو الأخرى.
myObserver.observe(img1) myObserver.observe(img2) myObserver.observe(img3) //----- أو const imgList = document.querySelectorAll(".imgToAnimate") imgList.forEach(img => { myObserver.observe(img) }) ﻹيقافها 
myObserver.unobserve(img) // ----- أو const callback = (entries, observer) => { entries.forEach((entry) => { if (entry.isIntersecting) { entry.target.classList.add("fadeIn") observer.unobserve(entry.target) // دالة إيقاف } }) } وهذا مثال 
<!------------------HTML---------------> <div class="container"> <div class="wrapper"> <img class="imgA" src="https://ljc-dev.github.io/hosted-assets/thumb-a.png" alt="avatar a"> </div> <div class="wrapper"> <img class="imgB" src="https://ljc-dev.github.io/hosted-assets/thumb-b.png" alt="avatar b"> </div> <div class="wrapper"> <img class="imgC" src="https://ljc-dev.github.io/hosted-assets/thumb-c.png" alt="avatar c"> </div> <div class="wrapper"> <img class="imgD" src="https://ljc-dev.github.io/hosted-assets/thumb-d.png" alt="avatar d"> </div> </div> * { margin: 0; padding: 0; box-sizing: border-box; } html, body { width: 100%; } html { scroll-behavior: smooth; } .container { width: 100%; height: 100vh; overflow-x: hidden; overflow-y: auto; padding-top: 12rem; } .wrapper { position: relative; margin: 5rem auto; width: 400px; height: 400px; } img { position: absolute; top: 0; left: 0; height: 400px; opacity: 0; width: 400px; transition: all 1s; } .imgA { transform: translateX(-200px); opacity: 0; } .imgB { transform: translateX(200px); opacity: 0; } .imgC { transform: translateY(200px); opacity: 0; } .imgD { transform: scale(0); } .fadeInLeft { transform: translateX(0px); opacity: 1; } .fadeInRight { transform: translateX(0px); opacity: 1; } .fadeInBtm { transform: translateY(0px); opacity: 1; } .zoomIn { transform: scale(1); opacity: 1; } const container = document.querySelector(".container") const wrappers = document.querySelectorAll(".wrapper") const imgs = document.querySelectorAll("img") const animClasses = [ "fadeInLeft", "fadeInRight", "fadeInBtm", "zoomIn", ] const observer = new IntersectionObserver((entries, observer) => { entries.forEach(entry => { const currentIndex = Array.from(wrappers).indexOf(entry.target) if (entry.isIntersecting) { imgs[currentIndex].classList.add(animClasses[currentIndex]) } else { if (entry.boundingClientRect.y > 0) { imgs[currentIndex].classList.remove(animClasses[currentIndex]) } } }) }, { root: container, threshold: 0.1, }) wrappers.forEach(wrapper => { observer.observe(wrapper) })  

أظن أن المشكلة في الدالة onPageViewChange بحيث يتم اسناد قيمة بدون قيمة ابتدائية _page الى page من نوع int 
قم بهذا التحقق 
if (this.isNaN || this.isInfinite){ // القيمة الإفتراضية }else{ //الكود الخاص بك } يحدث هذا الخطأ عندما يعتمد متغير على متغير آخر.
على سبيل المثال ، مع صفوف وأعمدة المتغيرات ، يجب أن يكون لواحد أو آخر على الأقل قيمة أكبر من 0. إذا كان كلاهما صفرًا أو كان أحدهما فارغًا ، فسيحدث الخطأ.
يرجى ملاحظة أن تمرير قيمة فارغة إلى معلمة دالة سوف يتجاوز القيمة الافتراضية وستكون الأولوية للقيمة null.

لتوضيح طريقة عرض غير متزامنة ، دعنا ننشئ واحدة في views.py. يمكن تحقيق ذلك عن طريق استيراد الوحدة asyncio. سنقوم بإنشاء طلب HTTP غير محظور ، وسيتم إرسال استجابة HTTP مرة أخرى قبل مكالمة السكون الأولى. في كل ثانية ، سيتوقف عرض API لمدة ثانية واحدة - ويتم ذلك باستخدام حلقة for. للمقارنة ، سيستغرق إكمال عرض المزامنة في نفس السيناريو بالضبط 5 ثوانٍ. سيتم إرسال طلب HTTP إلى واجهة برمجة تطبيقات وهمية ، والتي تعمل بمثابة طلب HTTP وخدمة استجابة بسيطة.
 كما هو موضح أدناه:
import asyncio from time import sleep import httpx from django.http import HttpResponse async def http_call_async(): for num in range(1,6): await asyncio.sleep(1) print(num) async with httpx.AsyncClient() as client: r = await client.get("https://httpbin.org") print(r) async def async_view(request): loop = asyncio.get_event_loop() loop.create_task(http_call_async()) return HttpResponse('Non-blocking HTTP request')  

أفضل لغات البرمجة الخلفية لبناء تطبيق دردشة الآن . نظرًا لأن التطوير الخلفي لا يعتمد على النظام الأساسي أو نظام التشغيل ، فإن هذا يؤدي إلى خفض المتغيرات.
1.  Erlang هي لغة مصممة للعديد من العمليات التي تعمل بشكل متوازي. هذا يجعله مناسبًا جدًا عند البحث عن أفضل تطبيق دردشة. فوائده هي: قابل للتطوير عن طريق إضافة المزيد من النوى أو الآلات الجديدة. تصميمه المتزامن بفضل الخيوط خفيفة الوزن يجعله موثوقًا للغاية.
2. جافا سكريبت
عند استخدامها للتطوير الخلفي ، تعمل Javascript عبر بيئة تسمى Node. كما هو الحال في تطوير الواجهة الأمامية ، هناك فوائد لاستخدام جافا سكريبت هنا أيضًا.
المعالجة سريعة جدًا سهل التعلم نسبيًا شائع جدًا مع وصول واسع إلى دعم المطورين يوفر الإدخال / الإخراج غير المحظور ومعالجة الطلبات غير المتزامنة 3. GO
تم إنشاء Go ، المعروف أيضًا باسم Golang بواسطة Google. بعض مزاياها هي:
سريع جدا يقدم التزامن مفتوح المصدر 3. بايثون مع django channels
سريع جدا مفتوح المصدر

قم بإعداد ASGI لتطبيقك 
قبل البدء ، قم بتثبيت التبعيات المدرجة أدناه والتي ستكون ضرورية لإعداد WebSockets.
Django 3.0(or greater) channels 3.0.4 channels-redis 3.3.1 بمجرد تثبيت التبعيات المذكورة أعلاه ، سيتعين علينا إضافة "channels" إلى قائمة قسم "INSTALLED_APPS" في ملف settings.py.
بشكل افتراضي ، تعمل تطبيقات Django على خوادم WSGI ولهذا السبب سنحتاج إلى إعداد تطبيقنا يدويًا للتشغيل على خادم ASGI.
انتقل إلى ملف settings.py وأضف السطر التالي.
ملاحظة: "your_project" في الكود أدناه هو اسم الدليل للمجلد الجذر الذي سيحتوي على ملف "settings.py"
ASGI_APPLICATION = 'your_project.asgi.application' الآن لكي يعمل جزء الكود أعلاه ، سيتعين علينا التأكد من وجود ملف "asgi.py" في دليل التطبيق الجذر لدينا مثل:
2) إنشاء نموذج الإشعارات 
class notifications(models.Model): user_sender=models.ForeignKey(Users,null=True,blank=True,related_name='user_sender',on_delete=models.CASCADE) user_revoker=models.ForeignKey(Users,null=True,blank=True,related_name='user_revoker',on_delete=models.CASCADE) status=models.CharField(max_length=264,null=True,blank=True,default="unread") type_of_notification=models.CharField(max_length=264,null=True,blank=True) 3) قم بإعداد ملف customers.py الخاص بك
المستهلكون إلى WebSockets كوجهات النظر إلى HTTP. ملف customers.py هو المكان الذي يتم فيه التعامل مع جميع طلبات WebSocket وإرسالها مرة أخرى إلى الواجهة الأمامية. هناك أنواع مختلفة من مستهلكي WebSocket مثل "AsynConsumer" و "WebSocketConsumer" و "AsyncWebSocketConsumers" على سبيل المثال لا الحصر.
انتقل إلى أحد التطبيقات داخل مشروعك وأنشئ ملف "customers.py".
قم باستيراد التبعيات التالية
from channels.generic.websocket import WebsocketConsumer,AsyncWebsocketConsumer from channels.db import database_sync_to_async from asgiref.sync import async_to_sync,sync_to_async from channels.layers import get_channel_layer يحتاج كل "مستهلك" في قنوات Django إلى ثلاث طرق محددة.
الاتصال والاستلام وقطع الاتصال.
يتم استخدام الاتصال لإنشاء اتصالات بين الواجهة الأمامية والخلفية.
يُستخدم الاستلام للتعامل مع الطلبات المرسلة من الواجهة الأمامية والتعامل معها وفقًا لذلك.
يُستخدم فصل الاتصال للتعامل مع ما يجب أن يحدث إذا تم إغلاق WebSocket أو إيقاف تشغيله.
إذن كيف ستعمل WebSockets لدينا؟ سيقوم WebSocket الخاص بنا أولاً "بإنشاء" اتصال. بمجرد إنشاء الاتصال ، فإن الواجهة الخلفية "تستمع" لأي حدث قد ترسله الواجهة الأمامية إليه وتعالج ذلك في طريقة "الاستلام".
دعونا نلقي نظرة خاطفة على ذلك
سننشئ أولاً وظيفة سيتم استخدامها لإنشاء كائن إعلام في كل حدث.
@database_sync_to_async def create_notification(receiver,typeof="task_created",status="unread"): notification_to_create=notifications.objects.create(user_revoker=receiver,type_of_notification=typeof) print('تم') return (notification_to_create.user_revoker.username,notification_to_create.type_of_notification) بعد ذلك سنلقي نظرة على "المستهلك" الرئيسي لدينا. دعونا نلقي نظرة على طريقة الاتصال أولاً. 
class NotificationConsumer(AsyncWebsocketConsumer): async def websocket_connect(self,event): print('تم الإتصال',event) print('تم اﻷمر') print(self.scope['user'].id) await self.accept() await self.send(json.dumps({ "type":"websocket.send", "text":"مرحبا" })) 4) أدخل Redis

الآن مع طريقة الاتصال بعيدًا عن الطريق. سنحتاج إلى إعداد "Redis". Redis هو مخزن بنية بيانات مفتوح المصدر (مرخص من BSD) ، يستخدم كقاعدة بيانات وذاكرة تخزين مؤقت ووسيط رسائل. إنه جزء لا يتجزأ من تشغيل WebSockets الخاص بنا.
انتقل إلى ملف settings.py وأضف الكود التالي لإعداد Redis.
CHANNEL_LAYERS = { "default": { "BACKEND": "channels_redis.core.RedisChannelLayer", "CONFIG": { "hosts": [("127.0.0.1", 6379)], }, }, } 5) إعداد جهاز التوجيه URL الخاص بنا
import os from channels.routing import ProtocolTypeRouter,URLRouter from channels.auth import AuthMiddlewareStack from stories import consumers from django.urls import re_path,path from django.core.asgi import get_asgi_application os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'mirror_project.settings') import stories.routing application = ProtocolTypeRouter({ "http": get_asgi_application(), "websocket":AuthMiddlewareStack( URLRouter( [path('stories/notification_testing/',consumers.NotificationConsumer.as_asgi())] )) }) إذا نظرت إلى جزء "ProtocolTypeRouter" داخل الكود ، فلدينا قسمان ، "HTTP" و "WebSocket".
"HTTP" مخصص لـ ASGI لرعاية طلبات العرض التقليدية بينما يتم استخدام "WebSocket" للتعامل مع طلبات مأخذ التوصيل. ملاحظة ، لقد حددت "مسارًا" يحتوي على "مسار" وبجانبه يوجد شيء مشابه لطريقة عرض.
رمز يرتبط بـ "فئة مستهلك الإشعارات".
6) جمع كل ذلك معًا
السبب في قيامنا بدمج Redis في المقام الأول هو أننا نحتاج إلى طريقة "لبث" حدث إنشاء الإشعارات متى تم إنشاؤه في "غرفة". وبعد ذلك يمكن للواجهة الأمامية التحقق من المعلومات وتقرر إما عرضها أو رفضها. دعونا نلقي نظرة على الكود النهائي الخاص بنا لملف customers.py.
@database_sync_to_async def get_user(user_id): try: return Users.objects.get(id=user_id) except: return AnonymousUser() @database_sync_to_async def create_notification(receiver,typeof="task_created",status="unread"): notification_to_create=notifications.objects.create(user_revoker=receiver,type_of_notification=typeof) print('تم') return (notification_to_create.user_revoker.username,notification_to_create.type_of_notification) class NotificationConsumer(AsyncWebsocketConsumer): async def websocket_connect(self,event): print(self.scope) await self.accept() await self.send(json.dumps({ "type":"websocket.send", "text":"مرحبا" })) self.room_name='test_consumer' self.room_group_name='test_consumer_group' await self.channel_layer.group_add(self.room_group_name,self.channel_name) self.send({ "type":"websocket.send", "text":"room made" }) async def websocket_receive(self,event): print(event) data_to_get=json.loads(event['text']) user_to_get=await get_user(int(data_to_get)) print(user_to_get) get_of=await create_notification(user_to_get) self.room_group_name='test_consumer_group' channel_layer=get_channel_layer() await (channel_layer.group_send)( self.room_group_name, { "type":"send_notification", "value":json.dumps(get_of) } ) print('receive',event) async def websocket_disconnect(self,event): print('disconnect',event) async def send_notification(self,event): await self.send(json.dumps({ "type":"websocket.send", "data":event })) print('تم') print(event) 6) اختبر اتصالات socket الخاص بك
ws://127.0.0.1:8000/stories/notification_testing/ 7) قم بإنشاء إعلام عن طريق إرسال معرف المستخدم.
أخيرًا ، نرسل معرف مستخدم إلى WebSocket الخاص بنا

لا بالعكس ، يُنصح باستعمالها 

بعض الاقتراحات حول هذا المشكل بالذات:
استخدم .glb وليس .gltf. سيكون الشكل الثنائي لـ glTF أصغر بنسبة 25-30٪ من ملف .gltf مع بيانات ثنائية مضمنة ، ولا يلزم فك تشفيره من Data URI. يعد استخدام .gltf مع ملف .bin ثنائي منفصل أيضًا أحد الخيارات. استخدم glTF-Pipeline لإجراء هذه التغييرات. قم بتحميل وحدة فك ترميز Draco مسبقًا عن طريق استدعاء dracoLoader.preload () قبل أن يبدأ تحميل النموذج الخاص بك. ، سيوفر ذلك 500 مللي ثانية تم إنفاقها في جلب وحدة فك التشفير بعد تنزيل النموذج بالفعل. ضع في اعتبارك استخدام https://github.com/zeux/meshoptimizer#installing-gltfpack لتبسيط النموذج ، أو على الأقل لتكميمه ، ثم gzip. يعد هذا بديلاً لـ Draco ، وقد لا يضغط الملف أيضًا ، ولكن يمكن أن يقلل في بعض الأحيان وقت التحميل الكلي على الرغم من ذلك.  

تعد WhatsApp Business API من Twilio خدمة قوية وسهلة الاستخدام تتيح لك التواصل مع المستخدمين على تطبيق المراسلة الشهير.
 ستقوم بتوصيل هاتفك الذكي بصندوق الحماية. من Twilio Console ، حدد المراسلة ، ثم انقر فوق "جربه". اختر قسم WhatsApp على الشريط الجانبي الأيسر. ستظهر لك صفحة وضع الحماية في WhatsApp رقم الحماية المخصص لحسابك ، ورمز الانضمام. أنت الآن جاهز لتثبيت تبعيات Python المستخدمة في هذا المشروع:  pip install twilio pyngrok حزم Python الثلاثة التي يحتاجها هذا المشروع هي:
إطار عمل Django ، لإنشاء تطبيق الويب. مكتبة Twilio Python Helper ، للعمل مع رسائل SMS. Pyngrok ، لجعل تطبيق Django متاحًا مؤقتًا على الإنترنت للاختبار عبر الأداة المساعدة ngrok.    3. تشغيل ngrok 
ngrok http 8000 افتح ملف settings.py من دليل الرسائل في محرر النصوص أو IDE. ابحث عن السطر الذي يحتوي على المتغير ALLOWED_HOSTS وقم بتغييره على النحو التالي
ALLOWED_HOSTS = ['.ngrok.io'] إنشاء خطاف ويب WhatsApp
يستخدم Twilio مفهوم webhooks لتمكين تطبيقك من تنفيذ إجراءات مخصصة كنتيجة لأحداث خارجية مثل تلقي رسالة من مستخدم على WhatsApp. الخطاف على الويب ليس أكثر من نقطة نهاية HTTP يستدعيها Twilio بمعلومات حول الحدث. الرد الذي تم إرجاعه إلى Twilio يوفر إرشادات حول كيفية التعامل مع الحدث.
سيتضمن الويب هوك لرسالة WhatsApp الواردة معلومات مثل رقم هاتف المستخدم ونص الرسالة. في الرد ، يمكن للتطبيق توفير استجابة لإرسالها مرة أخرى إلى المستخدم. يجب تقديم الإجراءات التي تريد أن يتخذها Twilio ردًا على حدث وارد بلغة مخصصة محددة بواسطة Twilio تستند إلى XML وتسمى TwiML.
إضافة نقطة نهاية جديدة
افتح ملف settings.py من دليل الرسائل مرة أخرى. ابحث عن المتغير INSTALLED_APPS. هذه قائمة بالعديد من السلاسل ، وهي وحدات معيارية في إطار عمل Django. في نهاية القائمة ، تحتاج إلى إضافة إدخال آخر لتسجيل تطبيق whatsapp الذي قمت بإنشائه مسبقًا.
INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.contrib.contenttypes', 'django.contrib.sessions', 'django.contrib.messages', 'django.contrib.staticfiles', 'whatsapp.apps.WhatsappConfig', # ← العنصر الجديد ] افتح الملف views.py من الدليل الفرعي whatsapp. هذا هو المكان الذي ستنشئ فيه نقطة النهاية التي ستتعامل مع رسائل WhatsApp الواردة. استبدل محتويات هذا الملف بما يلي:
from django.http import HttpResponse from django.views.decorators.csrf import csrf_exempt @csrf_exempt def message(self): return HttpResponse('Hello!') وظيفة message () هي وظيفة نقطة النهاية التي سيتم تشغيلها عندما يقوم Twilio بإخطار التطبيق برسالة WhatsApp واردة. في الوقت الحالي ، تقوم هذه الوظيفة بإرجاع استجابة بسيطة بالنص "Hello!".
لتسهيل الوصول إلى نقطة النهاية هذه من خلال تطبيق الويب ، يجب تخصيص عنوان URL لها. افتح ملف urls.py من دليل الرسائل وقم بإضافة إدخال جديد إلى قائمة  urlpatterns كما هو موضح أدناه:
from django.contrib import admin from django.urls import path from whatsapp import views # ← استيراد الدالة urlpatterns = [ path('admin/', admin.site.urls), path('message', views.message), # ← اضافة الى المسار ] استقبال رسائل WhatsApp
الخطوة التالية هي تحديث المنطق داخل نقطة نهاية message () لاستخراج المعلومات حول الرسالة الواردة. استبدل محتويات ملف views.py في دليل whatsapp الفرعي بما يلي:
from django.http import HttpResponse from django.views.decorators.csrf import csrf_exempt @csrf_exempt def message(request): user = request.POST.get('From')# message = request.POST.get('Body')# print(f'{user} يقول {message}')# return HttpResponse('مرحبا!') إرسال رد
from django.http import HttpResponse from django.views.decorators.csrf import csrf_exempt from twilio.twiml.messaging_response import MessagingResponse @csrf_exempt def message(request): user = request.POST.get('From') message = request.POST.get('Body') print(f'{user} يقول {message}') response = MessagingResponse() response.message('شكرا على اهتمامك ، سنقوم بالرد في أقرب وقت') return HttpResponse(str(response)) إذا كان هذا البوت سيستخدم للإنتاج ، فيُنصح رفعه على استضافة vps 

يستغرق الكثير من الأشخاص وقتًا طويلاً للتفكير في إطار عمل الويب الذي يختارونه لموقعهم التالي على الويب. فيما يلي دليل لمساعدتك في اختيار الأنسب لمشروعك القادم.
جانغو  إذا كنت ترغب في إنشاء موقع ويب جيد المظهر بسرعة وسهولة ، فانتقل إلى django. في رأيي ، فإن django هو أفضل إطار عمل ويب يمكنك اختياره للمدونات والرسائل الإخبارية والتطبيقات الأخرى.
غالبًا ما يطلق عليه الناس إطار عمل الويب مع البطاريات المضمنة لمصادقة المستخدم والنماذج ورسائل البريد الإلكتروني والاختبار والكثير منها. لقد قمت بنفسي ببناء مواقع ويب كاملة في django في غضون أيام. إذا كانت السرعة هي كل ما تريده فلا شيء أفضل من دجانغو.
اللغة المستعملة بايثون
Mern يرمز Mern إلى MongoDB و Express و React و Node.
إذا كنت ترغب في إنشاء موقع ويب مثالي مثل تطبيق وسائط اجتماعية .
أفضل ميزات mern هي أنه يمكنك إستبدال رياكت واختيار أي إطار مثل react native  أو flutter أو angular أو حتى إنشاء تطبيق سطح مكتب باستخدام c ++ ولن تهتم بالباك أند حتى.
يمكنك إنشاء أشياء متعددة مثل موقع ويب تفاعلي وتطبيق android و ios مع react native ، ولكن الأمر سيستغرق وقتًا أطول قليلاً.
افكار مقترحة
إذا كان عليك إنشاء موقع ويب مثل تطبيق مدونة أو تطبيق للتجارة الإلكترونية ، فيجب أن يكون django هو خيارك ولكن إذا لم تكن متسرعًا وترغب في إنشاء تطبيق كبير ، فيجب أن يكون mern هو خيارك البطيء والمعقد.
اللغة المستعملة javascript

تمام الخطأ في عملية الوراثة 
class ContactU(forms.ModelForm): # نستبدل Form -> ModelForm first_name = forms.CharField(max_length = 50) last_name = forms.CharField(max_length = 50) email_address = forms.EmailField(max_length = 150) message = forms.CharField(widget = forms.Textarea, max_length = 2000) class Meta: model = User fields = ('first_name','last_name','email_address','message')  

نموذج الإعدادات المخصصة
إذا كنت تهدف إلى إنشاء نموذج إعدادات مخصصة ، فهذا ممكن بالطريقة التالية: يمكنك أن ترث من ConstanceAdmin وتعيين خاصية النموذج على المسؤول المخصص الخاص بك لاستخدام النموذج المخصص الخاص بك. يتيح لك هذا تحديد مجموعات النماذج والتخطيطات الخاصة بك ، على غرار تحديد نموذج مخصص على نموذج Django ModelAdmin القياسي. بهذه الطريقة يمكنك تصميم نموذج الإعدادات وإعدادات المجموعة بالكامل بالطريقة التي تريدها.
from constance.admin import ConstanceAdmin, ConstanceForm, Config class CustomConfigForm(ConstanceForm): def __init__(self, *args, **kwargs): super().__init__(*args, **kwargs) class ConfigAdmin(ConstanceAdmin): change_list_form = CustomConfigForm change_list_template = 'admin/config/settings.html' admin.site.unregister([Config]) admin.site.register([Config], ConfigAdmin) يمكنك أيضًا تجاوز طريقة get_changelist_form التي يتم استدعاؤها في changelist_view للحصول على النموذج الفعلي المستخدم لتغيير الإعدادات. يتيح لك هذا اختيار نموذج مختلف وفقًا للمستخدم الذي قدم الطلب. فمثلا:
class SuperuserForm(ConstanceForm): class MyConstanceAdmin(ConstanceAdmin): def get_changelist_form(self, request): if request.user.is_superuser: return SuperuserForm: else: return super().get_changelist_form(request)  

هذا هو جوهر استعمال state management وأنصحك باستعمال getX تمكنك من :
> إدارة المسار: لإنشاء أدوات مثل Snackbar و Bottomsheets ومربعات الحوار وما إلى ذلك. بعد ذلك ، في هذه المرحلة ، يمكننا إشراك GetX فيه لأن GetX يمكنه تجميع هذه الأدوات دون استخدام السياق. > أداء عالٍ: تستخدم GetX أصولًا أقل كما هو متوقع. لا تعتمد على Streams أو ChangeNotifier. عند تساوي كل الأشياء ، فإنه يستخدم GetValue و GetStream المنخفضان للخمول لزيادة تطوير التنفيذ. > كود أقل: قد تكون سئمت من تنفيذ نموذج الكتلة في نمط الكتلة وإهدار طاقة التطوير على أكواد غير ضرورية. الوقت هو المال ، أليس كذلك؟ في GetX ، لن تؤلف أي نموذج معياري. يمكنك إنجاز نفس الشيء بشكل أسرع بكثير ، باستخدام كود أقل في GetX. لا تكلف نفسك عناء إنشاء فصول للولاية والحدث ، لأن هذه النماذج المعيارية غير موجودة في GetX. > لا يوجد توليد للكود: هناك سبب مقنع للحاجة إلى استخدام مولدات الكود بأي وسيلة. لذلك لن يضيع وقتك المهم في التطوير أكثر على تشغيل مولدات الأكواد (build_runner) كلما قمت بتغيير شفرتك. > لا توجد عمليات إعادة بناء غير ضرورية: التعديلات غير المرغوب فيها هي مشكلة تخص مديري الدولة استنادًا إلى ChangeNotifier. عندما تقوم بإدخال تحسين في فئة ChangeNotifier الخاصة بك ، يتم إعادة بناء جميع عناصر واجهة المستخدم التي تعتمد على فئة ChangeNotifier هذه. قد تكون بعض عمليات إعادة البناء غير ضرورية ومكلفة. قد يقلل من أداء التطبيق أيضًا. لا تحتاج إلى التأكيد على هذا في GetX لأنه لا يستخدم ChangeNotifier بأي وسيلة. للمزيد تفحص هذا الرابط الرسمي https://pub.dev/packages/get
 

للأسف لا يمكن ذلك إلا بحزمة أو serive تقدمها أحد الشركات مثل google recaptcha ، وأنا أنصحك ب f_grecaptcha
يسمح هذا المكون الإضافي flutter البسيط باستخدام SafetyNet API على أجهزة Android للتحقق من أن المستخدم إنسان.
كيفية إستعمالها في تطبيقك  قم بتضمين المكون الإضافي في تبعيات مشروعك عن طريق تضمينه في القسم ذي الصلة من pubspec.yaml الخاص بك: dependencies: f_grecaptcha: ^1.0.0  
بعد ذلك ، ستحتاج إلى تسجيل تطبيقك في وحدة تحكم مسؤول reCAPTCHA. انتقل إلى https://www.google.com/recaptcha/admin#list وقم بالتسجيل عن طريق ملء النموذج. تأكد من تحديد "reCAPTCHA-Android" كنوع.
بعد تسجيل تطبيقك في reCAPTCHA API ، يمكنك استدعاء الطريقة التالية في أي مكان في رمز dart الخاص بك ، والأكثر شيوعًا بعد الضغط على الزر. استبدل SITE_KEY بمفتاح الموقع الذي تعرضه واجهة المسؤول بعد تسجيل تطبيقك.
FGrecaptcha.verifyWithRecaptcha(SITE_KEY).then((result) { // يمكنك إرسال رمز النتيجة ، مع بعض حقول النموذج ، إلى ملف // reCAPTCHA API for servers, see https://developers.google.com/recaptcha/docs/verify }, onError: (e, s) { // لا يعني الخطأ أن المستخدم ليس بشريًا. أخطاء // يمكن أن يحدث أيضًا عندما يكون مفتاح الموقع غير صالح أو لا يتطابق مع // التطبيق ، عندما يكون الجهاز غير مدعوم أو عندما تكون الشبكة // يحدث خطأ. // يجب عليك إبلاغ المستخدم بالأخطاء ، وشرح سبب عدم تمكنه من ذلك // تخطي خطوة reCAPTCHA عندما يكون FGrecaptcha.isAvailable خاطئًا. print("لم نتمكن من التحقق:\n $e at $s"); } );  

لعمل custom permission بواسطة django rest framework يرجى إتباع هذه الخطوات 
إنشاء ملف نسميه permission.py  ثم نستدي المكتبات التي تتيح لنا عمل هذه الخاصية  from rest_framework import permissions  
class IsOwnerOrReadOnly(permissions.BasePermission): """ مثال على مصادقة أو إذن حيث يسمح فقط لمالك الحساب او بما يسمى owner """ def has_object_permission(self, request, view, obj): # يُسمح بأذونات القراءة لأي طلب مسموح if request.method in permissions.SAFE_METHODS: return True # يجب أن يكون الكائن هو نفسه return obj.owner == request.user  بحيث يُسمح فقط لمالك الحساب على التعديل مثلا على البروفيل الخاص به ولا يُسمح لأي أحد بفعل ذلك .

بصراحة هناك حزمة ممتازة لعمل search إحترافي مثل whatsapp search وغيرها .
إسم الحزمة wp_search_bar ، وهذه طريقة عملها :
تحميل الحزمة  $ dart pub add wp_search_bar  تأكد من وجودها في dependencies 
dependencies: wp_search_bar: ^0.0.5  
 تحديد البيانات التي تريد إظهارها في عرض القائمة 
List<Map<String, String>> data = [ {'name': "Mohammad", 'message': "message from mhammad"}, {'name': "Kamel", 'message': "message from kamel"}, {'name': "Nadine", 'message': "how are you ?"}, {'name': "Joseph", 'message': "hello...!"}, {'name': "71966691", 'message': "Hi"}, {'name': "03405609", 'message': "hiiii...."}, {'name': "Mohammad", 'message': "message from mhammad"}, {'name': "Kamel", 'message': "message from kamel"}, {'name': "Nadine", 'message': "how are you ?"}, {'name': "Joseph", 'message': "hello...!"}, {'name': "71966691", 'message': "Hi"}, {'name': "03405609", 'message': "hiiii...."}, ];  
 تحديد الأزرار التي يجب استخدامها في شريط البحث.
var buttonFilters = { 'name': { 'name': 'name', 'selected': false, 'title': 'Name', 'operation': 'CONTAINS', 'icon': Icons.supervised_user_circle_rounded, }, 'message': { 'name': 'message', 'selected': false, 'title': 'Message', 'operation': 'CONTAINS', 'icon': Icons.message, }, 'date': { 'name': 'Date', 'selected': false, 'title': 'Date', 'operation': 'CONTAINS', 'icon': Icons.date_range, }, 'other': { 'name': 'other', 'selected': false, 'title': 'Other', 'operation': 'CONTAINS', 'icon': Icons.more, }, };  
 بناء شريط البحث 
@override Widget build(BuildContext context) { return MaterialApp( home: WPSearchBar( listOfFilters: buttonFilters, materialDesign: const { 'title': {'text': 'hsoub'}, }, onSearch: (filter, value, operation) { }, body: Container( decoration: const BoxDecoration(color: Color(0xff121b22)), child: ListView.builder( itemCount: filteredData.length, itemBuilder: (context, index) { var item = filteredData[index]; return ListTile( title: Text( item['name'].toString(), style: const TextStyle( color: Colors.white, fontWeight: FontWeight.bold), ), ); }), ), ), ); } }  
 

إن من الأفضل فصل الإعدادات عن بعضها بحيث يساعد في عملية deployment وحتى التوثيق الرسمي لجانغو يوصي بهذا :
إنشاء مجلد نسميه settings  ننشأ ملف داخل المجلد settings  ونسميه __init__  ثم ننسخ كل ماهو في ملف settings وننسخه في __init__ ، ثم نحذف ملف settings.py  ننشأ ملف أخر ونسميه production.py ونضع فيه الأتي  from . import * SECRET_KEY = '-~aO;| F;rE[??/w^zcumh(9' # DEBUG = False ALLOWED_HOSTS = [''] # الأيبي والدومين لي رح تستعملهم في هذا المشروع DATABASES = { 'default': { 'ENGINE': 'django.db.backends.postgresql', # 'NAME': 'db_name', # إسم قاعدة البيانات 'USER': 'user_name', # إسم المستخدم 'PASSWORD': 'password',# كلمة السر 'HOST': '127.0.0.1', 'PORT': '5432', } } ثم بعد ذلك نغير سطر مهم جدا في ملف __init__
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))  
بعد ذلك نضيف ملف production.py الى .gitignore لتجنب الأخطاء