كيفية إنشاء تطبيق ويب على هاتفك باستخدام بايثون وPydroid 3 ودجانغو

مقدمة: هل يمكن تطوير تطبيق ويب كامل من الهاتف؟

نعم، يمكنك بالفعل إنشاء تطبيق ويب بسيط وتشغيله مباشرة من هاتف Android دون الحاجة إلى حاسوب. الفكرة تعتمد على استخدام تطبيق Pydroid 3 لكتابة وتشغيل لغة Python، ثم تثبيت إطار العمل Django لبناء المشروع وإدارته.

في هذا الدليل العملي، سنشرح الخطوات الأساسية لإنشاء مشروع ويب على الهاتف، بداية من تثبيت الأدوات، مروراً بإنشاء المشروع والتطبيق الداخلي، وانتهاءً بربط قاعدة البيانات وعرض المحتوى داخل الواجهة.

المتطلبات الأساسية قبل البدء

لن تحتاج إلى تجهيزات معقدة. يكفي توفر ما يلي:

• هاتف يعمل بنظام Android بإصدار 6.0 أو أحدث.
• اتصال بالإنترنت لتنزيل الحزم المطلوبة.
• تطبيق Pydroid 3 لتشغيل وكتابة شيفرات Python.

هذه البساطة تجعل التجربة مناسبة للمبتدئين، كما أنها مفيدة لمن يريد التعلّم أثناء التنقل أو اختبار أفكار سريعة بعيداً عن الحاسوب.

تثبيت Pydroid 3 وإعداد بيئة العمل

بعد تثبيت تطبيق Pydroid 3 من متجر التطبيقات، ستصبح لديك بيئة محلية لتشغيل أوامر Python وإدارة الحزم البرمجية. هذا التطبيق يوفّر محرر شيفرات وطرفية Terminal، وهو ما نحتاج إليه في هذا الشرح.

الخطوة التالية هي فتح القائمة الجانبية داخل التطبيق واختيار Terminal حتى نتمكن من تثبيت إطار Django.

تثبيت Django على الهاتف

ثبّت إطار Django عبر الأمر التالي:

pip install django

إذا كانت الحزمة مثبتة مسبقاً، قد تظهر لك رسالة تفيد بأن المتطلبات محققة بالفعل. أما إذا لم تكن مثبتة، فسيبدأ التطبيق بتنزيلها وتثبيتها تلقائياً.

وللتأكد من نجاح التثبيت، اكتب الأمر التالي:

django-admin

إذا ظهرت لك أوامر Django أو معلومات الاستخدام، فهذا يعني أن البيئة أصبحت جاهزة للعمل.

إنشاء مشروع Django جديد على الهاتف

لبدء مشروع جديد، استخدم الأمر التالي:

django-admin startproject myapp

هذا الأمر ينشئ مشروعاً باسم myapp داخل المجلد الحالي. بعد ذلك انتقل إلى مجلد المشروع:

cd myapp

ثم شغّل الخادم المحلي بالأمر:

python manage.py runserver

بعد تشغيل الخادم، افتح المتصفح وادخل إلى العنوان 127.0.0.1:8000. إذا ظهرت صفحة Django الترحيبية، فهذا يؤكد أن المشروع يعمل بنجاح.

إنشاء تطبيق داخلي داخل المشروع

في Django هناك فرق بين project وapp:

• project: يمثل الهيكل العام للموقع أو النظام.
• app: يمثل جزءاً وظيفياً مستقلاً مثل المدونة أو المهام أو الحسابات.

لإنشاء تطبيق جديد باسم todo، استخدم الأمر التالي من داخل مجلد المشروع:

python manage.py startapp todo

بعد تنفيذ الأمر ستجد مجلداً جديداً باسم todo يحتوي على الملفات الأساسية مثل views.py وmodels.py وadmin.py.

ربط التطبيق بالمشروع بشكل صحيح

إضافة التطبيق إلى settings.py

افتح ملف settings.py الموجود داخل مجلد المشروع myapp، ثم أضف 'todo' إلى قائمة INSTALLED_APPS. بهذه الخطوة يتعرّف Django على التطبيق ويبدأ بتحميل إعداداته.

تعديل ملف urls.py الرئيسي

افتح ملف urls.py في المشروع وأضف الاستيراد والمسار التاليين:

from django.urls import path, include

path('', include('todo.urls'))

ما حدث هنا هو أننا استخدمنا الدالة include لإخبار المشروع بأن المسارات الرئيسية سيتم تحميلها من ملف urls.py داخل التطبيق todo.

إنشاء ملف urls.py داخل التطبيق

أنشئ ملفاً جديداً باسم urls.py داخل مجلد todo، ثم أضف إليه:

from django.urls import path
from . import views

urlpatterns = [
    path('', views.index, name='home')
]

في هذا الملف قمنا بربط المسار الجذري بالدالة index الموجودة في ملف views.py.

إنشاء أول صفحة باستخدام views.py

افتح ملف views.py وأضف الاستيراد التالي:

from django.http import HttpResponse

ثم أنشئ الدالة التالية:

def index(request):
    return HttpResponse('Hello')

هذه الخطوة مفيدة لاختبار الربط بين المسارات والعرض. شغّل الخادم مجدداً عبر:

python manage.py runserver

إذا ظهرت لك كلمة Hello في المتصفح، فهذا يعني أن الإعدادات الأساسية أصبحت سليمة.

تحميل ملفات HTML عبر نظام القوالب

لإنشاء واجهة حقيقية بدلاً من إرجاع نص بسيط، أنشئ المسار التالي داخل التطبيق:

todo/templates/todo

بعدها أنشئ ملف index.html داخل هذا المسار، واكتب فيه مثلاً:

<h1>Hello world</h1>

ثم عدّل ملف views.py ليستخدم الدالة render بدلاً من HttpResponse:

def index(request):
    return render(request, 'todo/index.html')

بعد تشغيل المشروع، ستظهر الصفحة الجديدة بنجاح داخل المتصفح.

إعداد الملفات الثابتة Static Files

حتى تضيف التنسيقات والصور وملفات CSS أو JavaScript، أنشئ البنية التالية داخل التطبيق:

static/todo/

ثم أنشئ ملفاً باسم main.css داخل هذا المسار، وأضف إليه التنسيق التالي:

body {
    background-color: red;
}

بعد ذلك، عدّل ملف index.html ليحمّل ملف التنسيق:

{% load static %}
<!Doctype html>
<html>
<head>
    <title>My page</title>
    <link rel="stylesheet" href="{% static 'todo/main.css' %}">
</head>
<body>
    Hello
</body>
</html>

عند إعادة تشغيل الصفحة، ستلاحظ تطبيق الخلفية الحمراء، وهذا يعني أن الملفات الثابتة تعمل بصورة صحيحة.

تفعيل لوحة الإدارة وإنشاء مستخدم مدير

لوحة الإدارة في Django من أهم المزايا الجاهزة، لكنها تتطلب أولاً تجهيز قاعدة البيانات. إذا حاولت إنشاء مدير قبل تنفيذ الترحيلات، فقد يظهر خطأ.

نفّذ أولاً:

python manage.py migrate

ثم أنشئ مستخدماً إدارياً بالأمر:

python manage.py createsuperuser

بعد إدخال اسم المستخدم والبريد الإلكتروني وكلمة المرور، شغّل الخادم ثم افتح العنوان 127.0.0.1:8000/admin.

بعد تسجيل الدخول ستصل إلى لوحة التحكم الخاصة بالموقع.

إنشاء نموذج بيانات Model لحفظ المحتوى

سننشئ الآن نموذجاً بسيطاً لتخزين النصوص داخل قاعدة البيانات. افتح ملف models.py وأضف الشيفرة التالية:

class Post(models.Model):
    content = models.CharField(max_length=255, null=False)

    def __str__(self):
        return self.content

هذا النموذج يحتوي على حقل واحد باسم content من النوع CharField، وهو مناسب لتخزين النصوص القصيرة. كما أن الدالة __str__() تجعل السجل يظهر داخل لوحة الإدارة باسم واضح بدلاً من عرض كائن برمجي عام.

إنشاء الترحيلات وتطبيقها

بعد حفظ النموذج، نفّذ الأمر التالي:

python manage.py makemigrations

ثم طبّق التعديلات على قاعدة البيانات عبر:

python manage.py migrate

إظهار النموذج داخل لوحة الإدارة

لكي يظهر النموذج داخل لوحة admin، افتح ملف admin.py وأضف ما يلي:

from .models import *
admin.site.register(Post)

بعد تحديث الصفحة داخل لوحة الإدارة، ستجد النموذج ضمن قائمة تطبيق todo.

يمكنك الآن إضافة سجلات جديدة يدوياً من لوحة الإدارة، وسيتم تخزينها مباشرة في قاعدة البيانات.

جلب البيانات من قاعدة البيانات وعرضها في الصفحة

بعد إدخال بعض السجلات، ننتقل إلى عرضها داخل الواجهة الأمامية. عدّل ملف views.py كما يلي:

from .models import *

def index(request):
    content = Post.objects.all()
    context = {'content': content}
    return render(request, 'todo/index.html', context)

هنا استخدمنا Post.objects.all() لاسترجاع جميع السجلات من قاعدة البيانات، ثم مررناها إلى القالب عبر متغير context.

بعد ذلك، عدّل ملف index.html لإجراء حلقة عرض:

{% for contents in content %}
    {{ contents.content }}
{% endfor %}

ملاحظة مهمة: الصياغة الأدق داخل الحلقة هي استخدام contents.content وليس content.content، لأن المتغير contents يمثل العنصر الحالي في التكرار.

شغّل الخادم مجدداً لمعاينة النتيجة:

إذا أردت تحسين القراءة، يمكنك إضافة فاصل سطر <br> أو تنسيق العناصر داخل قائمة <ul> أو بطاقات HTML أكثر وضوحاً.

نصائح عملية لتحسين التجربة على الهاتف

• احرص على كتابة الأوامر بدقة، لأن شاشة الهاتف قد تجعل الأخطاء الطباعية أكثر شيوعاً.
• ابدأ بمشروعات صغيرة، ثم انتقل لاحقاً إلى قوالب أكثر تعقيداً.
• استخدم لوحة الإدارة لتجربة النماذج بسرعة قبل بناء واجهات إدخال مخصصة.
• نظّم المجلدات من البداية، خاصة مسارات templates وstatic.
• اختبر كل خطوة فور تنفيذها لتحديد الأخطاء مبكراً.

الخلاصة التقنية

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