ساختن صفحه‌ها: صفحه‌ی خانه‌ی Learning Log

ساختن صفحه‌های وب در جانگو از سه مرحله تشکیل می‌شو¹⁵⁹ د: تعریف URLها، نوشتن نماها و نوشتن قالب‌ها. این سه کار را می‌توانید به هر ترتیبی انجام دهید امّا در این پروژه همیشه کار را به تعریف الگوی URL شروع می‌کنیم. الگوی URL روش و شکل ظاهر شدن URL را شرح می‌دهد. این الگو همچنین به جانگو می‌گوید که هنگام رسیدن درخواستی از مرورگر برای یک URL سایت، باید آن را با چه چیزی تطبیق بدهد تا بداند کدام صفحه را برگرداند.

هر URL با یک نمای خاص مرتبط می‌شود—تابع نما داده^{161 160} ‌های مورد نیاز برای تولید آن صفحه را دریافت و پردازش می‌کند. تابع نما اغلب صفحه را به کمک یک قالب شکل می‌دهد که ساختار کلّی صفحه را دربرمی‌گیرد. برای دیدن این روش کار بیایید برای Learning Log یک صفحه‌ی خانه بسازیم. برای این صفحه URLای تعیین می‌کنیم، تابع نمای آن را می‌نویسیم و یک قالب ساده می‌سازیم.

فعلاً چون فقط قصد داریم مطمئن شویم که Learning Log آن‌گونه که انتظار داریم کار می‌کند، یک صفحه‌ی ساده می‌سازیم. شکل دادن به یک برنامه‌ی وبِ در حال کار پس از ساخته‌شدن کاری جذّاب است امّا برنامه‌ای که به زیبا به نظر برسد امّا کار نکند بی‌فایده است. صفحه‌ی خانه فعلاً فقط یک عنوان و یک شرح مختصر را نمایش می‌دهد.

نگاشتن یک URL

کاربران با وارد کردن URLها در مرورگر یا کلیک کردن روی پیوندها صفحه‌ها را درخواست می‌کنند پس باید تصمیم بگیریم که به چه URLهایی نیاز داریم. URL صفحه‌ی خانه اوّلین مورد است: URL پایه است که افراد برای دسترسی به پروژه استفاده می‌کنند. در حال حاضر URL پایه http://localhost:8000/ است که سایت پیش‌فرض جانگو را برمی‌گرداند و به ما می‌گوید که پروژه به درستی برپا شده است. این صفحه را با نگاشت URL پایه به صفحه‌ی خانه‌ی Learning Log عوض می‌کنیم.

در پوشه‌ی اصلی پروژه‌ی learning_log فایل urls.py را باز کنید. چیزی که می‌بینید این است:

1
2
3
4
5
6

from django.contrib import admin
from django.urls import path

urlpatterns = [
    path('admin/', admin.site.urls),
]

دو خطّ اوّل یک ماژول و یک تابع برای مدیریّت URLهای سایت مدیریّت وارد می‌کند. در بدنه‌ی فایل متغیّر urlpatterns تعریف می‌شود. در این فایل urls.py که کل پروژه را نمایندگی می‌کند، متغیّر urlpatterns مجموعه‌ای از URLهای برنامه‌های داخل پروژه را در برمی‌گیرد. کد در ماژول admin.site.urls را شامل می‌شود که تمام URLهایی را تعریف می‌کند که می‌توان از سایت مدیر درخواست کرد.

ما باید URLهای مربوط به learning_log را هم اضافه کنیم پس:

1
2
3
4
5
6
7

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('learning_logs.urls')),
]

خطّی اضافه کرده‌ایم تا ماژول learning_logs.urls را اضافه کنیم. فایل urls.py پیش‌فرض در پوشه‌ی learning_log قرار دارد؛ اکنون باید یک فایل urls.py دیگر در پوشه‌ی learning_logs بسازیم. یک فایل پایتون جدید ساخته و آن را در learning_logs به نام urls.py ذخیره کنید و کد زیر را در آن وارد کنید:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

"""Defines URL patterns for learning_logs."""
from django.urls import path
from . import views

app_name = 'learning_logs'

urlpatterns = [
    # Home page
    path('', views.index, name='index'),
]

یک docstring به ابتدای فایل اضافه می‌کنیم تا مشخّص شود که روی کد urls.py در حال کاریم. سپس تابع path را وارد می‌کنیم که برای نگاشت URLها به نماها مورد نیاز است. ماژول views را هم وارد می‌کنیم؛ نقطه به پایتون می‌گوید که ماژول views.py را از همان پوشه‌ی ماژول urls.py فعلی وارد کند. متغیّر app_name به جانگو کمک می‌کند که این فایل urls.py را از فایل‌های هم‌نام در دیگر برنامه‌های پروژه تشخیص دهد. متغیّر urlpatterns در این ماژول لیستی از صفحه‌های جداگانه است که می‌تواند از طریق برنامه‌ی learning_logs درخواست شود.

الگوی URL در حقیقت فراخوانی تابع path() است که سه نشان‌وند می‌پذیرد. اوّلین نشان‌وند رشته‌ای است که به جانگو کمک می‌کند درخواست فعلی را به درستی مسیریابی کند. جانگو URL درخواستی را گرفته و سعی می‌کند که آن را به یک نما متّصل کند. این کار با جست‌و‌جوی تمام الگوهای تعریف‌شده تا یافتن موردی که به درخواست فعلی می‌خورد انجام می‌شود. جانگو URL پایه‌ی پروژه (https://localhost:8000/) را در نظر نمی‌گیرد پس رشته‌ی خالی (’’) متناظر با URL پایه است. هیچ URL دیگری با این الگو تطبیق نخواهد یافت و اگر جانگو هیچ الگویی مطابق با URL درخواستی پیدا نکند یک صفحه‌ی خطا برمی‌گرداند.

دومین نشان‌وند در path() تابعی را تعیین می‌کند که باید در view.py فراخوانی شود. زمانی که URL درخواستی با الگویی که تعریف کردیم منطبق شود جانگو تابع index() را از فایل view.py صدا می‌کند (این تابع را در بخش بعدی می‌نویسیم.) سومین نشان‌وند نام index را به این الگوی URL نسبت می‌دهد تا بتوانیم در بخش‌های دیگر کد به آن ارجاع دهیم. هرگاه بخواهیم پیوندی به صفحه‌ی خانه ارائه کنیم به جای نوشتن یک URL از این نام استفاده می‌کنیم.

نوشتن یک نما

یک تابع نما اطّلاعات مربوط به درخواست را می‌گیرد، داده‌ی مورد نیاز برای تولید صفحه را آماده می‌کند و سپس آن را به مرورگر برمی‌گرداند، گاهی به کمک یک قالب که تعیین می‌کند صفحه چه شکلی باید باشد.

فایل views.py در learning_logs هنگام اجرای فرمان python manage.py startapp به طور خودکار ایجاد می‌شود. این چیزی است که هم‌اکنون در views.py می‌بینیم:

1
2
3

from django.shortcuts import render

# Create your views here.

در حال حاضر این فایل فقط تابع render() را وارد می‌کند که پاسخ را بر اساس داده‌هایی که نماها ارائه کرده‌اند ایجاد می‌کند. فایل مربوط به نماها را باز کنید و کد زیر را برای صفحه‌ی خانه اضافه کنید:

1
2
3
4
5

from django.shortcuts import render

def index(request):
    """The home page for Learning Log."""
    return render(request, 'learning_logs/index.html')

زمانی که درخواست یک URL با الگویی که ما تعریف کرده‌ایم منطبق می‌شود جانگو در فایل views.py به دنبال تابعی به نام index() می‌گردد. جانگو سپس شیء request را به تابع نما می‌دهد. در این مورد به پردازش هیچ داده‌ای احتیاج نداریم پس در این تابع تنها فراخوانی تابع render() قرار دارد. تابع render() اینجا دو نشان‌وند می‌گیرد—شیء request اصلی و یک قالب که برای ساختن صفحه مورد استفاده قرار می‌گیرد. بیایید این قالب را بنویسیم.

نوشتن یک قالب

قالب مشخّص می‌کند که صفحه باید چه شکلی باشد و هر بار که صفحه درخواست شود جانگو داده‌های مربوطه را جاگذاری می‌کند. یک قالب به شما امکان می‌دهد که به هر داده‌ای که نما ارائه می‌کند دسترسی داشته باشید. چون نمای صفحه‌ی خانه هیچ داده‌ای در اختیار نمی‌گذارد این قالب به نسبت ساده است.

داخل پوشه‌ی learning_logs پوشه‌ای جدید به نام templates بسازید. داخل آن پوشه‌ی دیگری به نام learning_logs بسازید. این ممکن است اضافه‌کاری به نظر بیاید (داخل پوشه‌ای به نام learning_logs پوشه‌ی templates قرار دارد و دوباره در آن پوشه‌ای به نام learning_logs) امّا این کار ساختاری ایجاد می‌کند که جانگو آن را حتّی در بستر پروژه‌های بزرگ یا چندین برنامه‌ی مجزّا، بدون هیچ ابهامی تفسیر می‌کند. داخل پوشه‌ی learning_logs داخلی فایلی به نام index.html بسازید. مسیر این فایل learning_logs/templates/learning_logs/index.html خواهد بود. این کد را داخل آن فایل بنویسید:

1
2
3

<p>Learning Log</p>
<p>Learning Log helps you keep track of your learning, for any topic you're
learning about.</p>

این فایلی بسیار ساده است. اگر با HTML آشنا نیستید، بدانید که تگ‌های <p></p> پاراگراف‌ها را مشخّص می‌کنند. تگ <p> پاراگراف را باز و </p> آن را می‌بندد. دو پاراگراف داریم: اوّلی مثل یک عنوان است و دومی توضیح می‌دهد که کاربران در Learning Logs چه می‌توانند بکنند.

حال اگر URL پایه‌ی پروژه، http://localhost:8000/، را باز کنید، باید به جای صفحه‌ی پیش‌فرض جانگو، صفحه‌ای را که هم‌اکنون ساخته‌اید ببینید. جانگو URL درخواستی را دریافت می‌کند و چون بر الگوی ’’ منطبق است؛ جانگو تابع views.index() را فرامی‌خواند که صفحه را به کمک قالبی که در index.html قرار گرفته تولید می‌کند.

شاید برای ساختن یک صفحه این فرآیند پیچیده به نظر برسد امّا جداسازی URLها، نماها و قالب‌ها بسیار خوب عمل می‌کند. این کار به شما امکان می‌دهد که به هر جنبه‌ی یک پروژه جداگانه فکر کنید. در پروژه‌های بزرگ‌تر کمک می‌کند که افزار مختلفی روی پروژه کار کنند تا روی حوزه‌هایی که در آن تبحّر دارند، متمرکز شوند. برای مثال یک متخصّص پایگاه‌های داده می‌تواند روی مدل‌ها تمرکز کند، برنامه‌نویسی می‌تواند کد نما را بنویسد و یک طرّاح وب روی قالب‌ها متمرکز شود.

ModuleNotFoundError: No module named 'learning_logs.urls'

خودآزمایی

۱۸-۵: برنامه‌ریز غذایی: برنامه‌ای را در نظر بگیرید که به مردم در تعیین برنامه‌ی غذایی خود در طول هفته کمک می‌کند. پوشه‌ای جدید به نام meal_planner بسازید و داخل آن یک پروژه‌ی جدید جانگو ایجاد کنید. سپس برنامه‌ی جدیدی به نام meal_plans و یک صفحه‌ی خانه‌ی ساده برای این پروژه بسازید.

۱۸-۶: صفحه‌ی خانه‌ی پیتزافروشی: به پروژه‌ی پیتزافروشی که در تمرین ۱۸-۴ شروع کردید، به صفحه‌ی خانه اضافه کنید.