القوالب باستخدام Jinja2
أنشئ HTML ديناميكيًا
القوالب باستخدام Jinja2 درس مجاني في Python Academy على CoddyKit. هذا هو الدرس 2 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Python Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Python Academy 4 دروس في المجموع.
لماذا نستخدم القوالب؟
سرعان ما تصبح إعادة HTML من سلاسل Python فوضوية. وتُبقي القوالب HTML في ملفات منفصلة، وتملأها بالبيانات وقت التصيير. ويستخدم Flask المحرك Jinja2.
from flask import Flask, render_template
app = Flask(__name__)
# render_template loads a file from the templates/ folder
print('Jinja2 powers Flask templates')مجلد templates
يبحث Flask عن القوالب في مجلد باسم templates/ بجوار تطبيقك. وتنتهي أسماء الملفات عادةً بالامتداد .html.
# project/
# app.py
# templates/
# index.html
print('Templates live in templates/')render_template
تُحمّل render_template('index.html') قالبًا وتُرجع HTML الناتج عنه باعتباره جسم الاستجابة.
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def home():
return render_template('index.html')
print('home renders index.html')تمرير البيانات
مرّر المتغيرات على شكل وسائط مسماة. ويمكن للقالب بعد ذلك عرضها.
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def home():
return render_template('index.html', name='Alice')
print('name=Alice is sent to the template')إخراج المتغيرات
تطبع {{ name }} في القالب قيمة متغير. والأقواس المزدوجة هي صياغة تعبيرات Jinja2.
# index.html
# <h1>Hello, {{ name }}!</h1>
print('Double braces output a value')عبارات If
تستخدم عبارات التحكم في Jinja2 الصياغة {% %}. وتعرض كتلة if المحتوى بشكل مشروط.
# {% if user %}
# <p>Welcome back!</p>
# {% else %}
# <p>Please log in.</p>
# {% endif %}
print('{% if %} branches the markup')حلقات For
كرّر على قائمة باستخدام {% for item in items %} لتصيير علامات متكررة، مثل قائمة من المنتجات.
# <ul>
# {% for item in items %}
# <li>{{ item }}</li>
# {% endfor %}
# </ul>
print('{% for %} repeats markup per item')المرشحات
تحوّل المرشحات قيمةً باستخدام شريط عمودي: تجعل {{ name|upper }} القيمة بأحرف كبيرة. وتشمل المرشحات المضمّنة length وdefault وtitle.
# {{ name|upper }} -> ALICE
# {{ items|length }} -> count
# {{ bio|default('N/A') }}
print('Filters transform values with |')وراثة القوالب
يحدد القالب الأساسي هيكل الصفحة باستخدام مواضع {% block %}. وترثه القوالب التابعة باستخدام {% extends %} وتملأ الكتل.
# base.html
# <body>{% block content %}{% endblock %}</body>
#
# page.html
# {% extends 'base.html' %}
# {% block content %}<p>Hi</p>{% endblock %}
print('extends + block share a layout')الإفلات التلقائي
تُفلت Jinja2 تلقائيًا HTML الموجود في المتغيرات، مما يحمي من البرمجة النصية عبر المواقع. وتُعرض قيمة مثل <script> كنص ولا تُنفّذ.
# If name = '<b>x</b>', {{ name }} renders the literal text
# Auto-escaping is on by default for safety
print('Auto-escaping prevents XSS')الربط باستخدام url_for
يمكنك استدعاء url_for داخل القوالب أيضًا، وغالبًا ما يُستخدم ذلك مع الملفات الثابتة: {{ url_for('static', filename='style.css') }}.
# <link rel='stylesheet'
# href="{{ url_for('static', filename='style.css') }}">
print('url_for works inside templates too')اختبار سريع
اختبر معرفتك بـ Jinja2.
مراجعة
تعلّمت استخدام قوالب Jinja2.
- يصيّر
render_template()الملفات منtemplates/ - تُخرج
{{ }}القيم، بينما تنفّذ{% %}عباراتif/for - تحوّل المرشحات مثل
|upperالقيم - تتيح
extendsمعblockوراثة تخطيط الصفحة - يحمي الإفلات التلقائي من XSS
الأسئلة الشائعة
هل درس «القوالب باستخدام Jinja2» مجاني؟
نعم — نص درس «القوالب باستخدام Jinja2» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Python Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Python Academy 4 دروس في المجموع.
ماذا ستتعلم في «القوالب باستخدام Jinja2»؟
أنشئ HTML ديناميكيًا تتمرن على Python Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Python Academy؟
لا تُشترط خبرة سابقة. Python Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 2 من أصل 4.
كم من الوقت يستغرق درس «القوالب باستخدام Jinja2»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Python Academy هذا؟
نعم. كل درس في Python Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- المسارات وواجهات العرض
- القوالب باستخدام Jinja2
- النماذج وبيانات الطلب
- إنشاء نقطة نهاية REST