Как создать простой сайт на Django 4
Содержание страницы
Django — это фреймворк для веб-разработки на языке Python. Он позволяет создавать мощные и гибкие веб-приложения. В этой статье мы рассмотрим, как создать простой сайт на Django 4. Для этого нам потребуется выполнить несколько шагов.
Шаг 1: Установка Django 4
Прежде чем мы начнем, нам нужно убедиться, что у нас установлена последняя версия Django. Для этого мы можем использовать pip, менеджер пакетов Python. В консоли выполните следующую команду:
pip install Django==4.0.1
Шаг 2: Создание проекта
Для создания проекта в Django мы можем использовать утилиту командной строки django-admin. Откройте консоль и выполните следующую команду:
django-admin startproject myproject
Здесь myproject — это имя нашего проекта. Эта команда создаст каталог с именем myproject и структуру каталогов, необходимую для запуска Django-проекта.
Шаг 3: Создание приложения
В Django приложение — это независимая часть проекта, которая может выполнять определенные задачи. Например, наш сайт может иметь приложения для отображения блога, административной панели и т.д. Для создания нового приложения в нашем проекте мы можем использовать утилиту командной строки python manage.py startapp myapp. В консоли выполните следующую команду:
python manage.py startapp myapp
Здесь myapp — это имя нашего приложения. Эта команда создаст каталог с именем myapp и структуру каталогов, необходимую для запуска приложения.
Шаг 4: Определение URL-адресов
URL-адреса — это путь к веб-страницам на нашем сайте. В Django мы можем определить URL-адреса в файле urls.py. Для каждого URL-адреса мы определяем функцию-обработчик, которая будет вызываться, когда пользователь запрашивает данный URL-адрес. Добавьте следующий код в файл urls.py вашего приложения:
from django.urls import path
from . import views
urlpatterns = [
path('', views.index, name='index'),
path('about/', views.about, name='about'),
]
Здесь мы импортируем модуль path из django.urls, а также импортируем наши функции-обработчики index и about из модуля views. Затем мы определяем список urlpatterns, в котором мы указываем наши URL-адреса и соответствующие им функции-обработчики. Первый путь '' соответствует главной странице сайта и вызывает функцию-обработчик index, а путь 'about/' соответствует странице ‘about’ и вызывает функцию-обработчик about.
Шаг 5: Создание функций-обработчиков
Теперь, когда мы определили URL-адреса нашего сайта, мы можем создать функции-обработчики, которые будут обрабатывать запросы, поступающие на эти URL-адреса. В Django функция-обработчик — это обычная функция Python, которая принимает объект HttpRequest и возвращает объект HttpResponse. Например, мы можем создать функцию-обработчик index, которая будет возвращать простую страницу HTML:
from django.http import HttpResponse
def index(request):
return HttpResponse("<h1>Привет, мир!</h1>")
Аналогично, мы можем создать функцию-обработчик about, которая будет возвращать страницу ‘about’:
from django.http import HttpResponse
def about(request):
return HttpResponse("<h1>О нас</h1><p>Мы - команда разработчиков!</p>")
Шаг 6: Создание шаблонов
Теперь у нас есть функции-обработчики, которые возвращают HTML-код, но это не очень удобно, если мы захотим изменить дизайн нашего сайта или добавить новые страницы. В Django мы можем использовать шаблоны, чтобы разделить логику и представление нашего сайта. Шаблоны — это файлы, содержащие HTML-код, который может быть динамически заполнен данными из функции-обработчика.
Создадим папку templates в нашем приложении и создадим файл base.html, который будет являться базовым шаблоном для всех страниц нашего сайта:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{% block title %}{% endblock %}</title>
</head>
<body>
<header>
<h1><a href="{% url 'index' %}">Мой сайт</a></h1>
<nav>
<ul>
<li><a href="{% url 'index' %}">Главная</a></li>
<li><a href="{% url 'about' %}">О нас</a></li>
</ul>
</nav>
</header>
<main>
{% block content %}{% endblock %}
</main>
<footer>
<p>© Мой сайт, 2023</p>
</footer>
</body>
</html>
Этот шаблон содержит основную структуру HTML-страницы, включая заголовок, навигационное меню и футер. Он также содержит два блока {% block %} — title и content, которые мы будем использовать для заполнения соответствующих данных на каждой странице нашего сайта.
Теперь мы можем создать шаблоны для каждой страницы нашего сайта, используя базовый шаблон. Создадим файл index.html для главной страницы и файл about.html для страницы ‘about’:
{% extends 'base.html' %}
{% block title %}Главная{% endblock %}
{% block content %}
<h1>Привет, мир!</h1>
{% endblock %}
{% extends 'base.html' %}
{% block title %}О нас{% endblock %}
{% block content %}
<h1>О нас</h1>
<p>Мы - команда разработчиков!</p>
{% endblock %}
Здесь мы используем ключевое слово {% extends %}, чтобы указать, что мы хотим расширить базовый шаблон. Затем мы заполняем блоки {% block %} нашими данными для каждой страницы.
Шаг 7: Добавление статических файлов
Наконец, мы можем добавить статические файлы, такие как CSS-стили и изображения, в наш проект Django. Создадим папку static в корневой папке нашего проекта и добавим в неё файл style.css:
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
}
header {
background-color: #333;
color: #fff;
padding: 1em;
}
header h1 a {
color: #fff;
text-decoration: none;
}
nav {
display: flex;
}
nav ul {
margin: 0;
padding: 0;
list-style: none;
}
nav li {
margin: 0 1em;
}
nav a {
color: #fff;
text-decoration: none;
font-weight: bold;
}
main {
max-width: 800px;
margin: 2em auto;
padding: 1em;
background-color: #fff;
}
Этот файл содержит стили для нашего сайта. Теперь мы можем использовать эти стили на каждой странице нашего сайта, добавив следующий тег в блок head в каждом шаблоне:
{% load static %}
<link rel="stylesheet" href="{% static 'style.css' %}">
Здесь мы используем {% load static %}, чтобы загрузить тег static, который позволяет нам обращаться к статическим файлам нашего проекта. Затем мы добавляем ссылку на наш файл style.css с помощью {% static 'style.css' %}.
Теперь, когда мы добавили шаблоны и статические файлы, мы можем запустить наш сервер и увидеть, как наш сайт будет выглядеть в браузере.
Для запуска сервера Django введите следующую команду в терминале, находясь в корневой папке проекта:
python manage.py runserver
Вы увидите что-то вроде этого:
Watching for file changes with StatReloader
Performing system checks...
System check identified no issues (0 silenced).
March 20, 2023 - 12:00:00
Django version 4.0, using settings 'mysite.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CONTROL-C.
Перейдите в браузер и введите адрес http://127.0.0.1:8000/ в адресной строке. Вы должны увидеть нашу домашнюю страницу, которая содержит ссылки на страницы «О нас» и «Контакты».
Если вы нажмёте на ссылку «О нас», вы перейдёте на страницу «О нас», которую мы создали с помощью шаблона. Если вы изучили код about.html и base.html, то поймёте, что на этой странице мы использовали наследование шаблонов и добавили содержимое страницы в блок content.
Таким же образом, если вы нажмёте на ссылку «Контакты», вы перейдёте на страницу «Контакты», которую мы также создали с использованием шаблона.
В конце концов, мы добавили статические файлы, такие как CSS-стили, в наш проект. Если вы изучили код style.css, то заметите, что мы определили стили для различных элементов нашего сайта. Используя {% load static %} и {% static 'style.css' %} в наших шаблонах, мы подключили этот файл к нашим страницам.
Теперь у нас есть рабочий сайт на Django, который использует шаблоны и статические файлы. Вы можете продолжать работать над этим проектом и добавлять больше функциональности, например, формы для связи с пользователями или страницы для аутентификации пользователей.
