Стиль кодирования в Django

Запуск сервера разработки

Как обсуждалось ранее, Django поставляется вместе с легковесным веб-сервером для разработки и тестирования приложений. Этот сервер предварительно настроен на работу с Django, он перезапускается каждый раз, когда изменяется код.

Для запуска сервера введите следующую команду:

python manage.py runserver

Далее, откройте ваш браузер и перейдите по этому адресу: http://localhost:8000/.

Вы должны увидеть сообщение-приглашение, как показано на следующем скриншоте:

Поздравляем! Вы создали и настроили ваш первый проект Django. Это проект будет фундаментом, на основании которого мы будем строить наше приложение для веб-закладок. В следующей главе мы начнем разработку нашего приложения, и страницу, отображаемую веб-сервером, заменим на то, что мы напишем сами!

Как вы могли заметить, веб-сервер по умолчанию работает на порту 8000. Если вы захотите изменить порт, вам нужно определить его с помощью следующей команды:

$ python manage.py runserver <port numbers>

Также, по умолчанию сервер разработки запускается на локальной машине. Если вы хотите, чтобы сервер разработки был доступен в вашей сети, используйте следующие аргументы командной строки:

$ python manage.py runserver 0.0.0.0:<port numbers>

Быстрая веб-разработка

Когда начинается веб-разработка, то есть одна вещь, которая главным образом способствует успеху веб-проекта – пользовательский интерфейс и пользовательский опыт. Хотя Django держит при себе всю бизнес-логику, несомненно нужен не только классный фронтэнд-фреймворк для дизайна, который облегчит жизнь программиста, пока он разрабатывает код, но так-же улучшит пользовательский опыт всего веб-проекта. Поэтому мы объясним здесь наш выбор Twitter Bootstrap.

Минимальная конфигурация Bootstrap

Bootstrap – это законченный фронтэнд-фреймворк и в этой книге мы познакомимся с каждой его стороной. Вас должно удивить, почему мы взялись обсуждать Bootstrap в книге о Django. Мы должны вам рассказать об этом фронтэнд-фреймворке. Главная идея этого в том, чтобы помочь вам построить веб-приложение, которое сразу же можно использовать в производстве и которое вы можете развернуть в облаках, таких как AWS и Heroku. Нужно, чтобы к завершению этого курса ваш проект был на стадии производства. Поэтому, храня верность Bootstrap так просто, как это возможно, вы сможете сделать веб-приложение Django, которое будет прилично смотреться.

Есть много способов расположить ваши веб страницы, основанных на перестановках и комбинировании. Чтобы помочь вам это понять, приведем несколько примеров.

Каркас – первый шаг на пути веб-разработки, который подразумевает работу по размещению содержимого на странице. Если вы уже знаете принципы веб-дизайна, то эта часть будет особенно полезна для вас. А если же вы ничего о них не знаете, прочтите об основной идее веб-программирования. Посмотрите на разницу между div и span и вам на многое откроется новый взгляд. Вы можете узнать больше здесь: https://developer.mozilla.org/en-US/Learn/HTML. Каркас базовой страницы Bootstrap состоит из строк и столбцов; каждый столбец сам делится на 12 секций. С помощью этих подсекций вы можете, используя перестановки содержимого, добиться нужного вам дизайна страницы.

Когда мы смотрим на веб-сайт с точки зрения разработчика, первое, что мы замечаем,это каркас. Например, посетив сайт www.facebook.com, вы увидите, что в центре страницы располагаются новости, на которые вы подписаны, а другие ссылки (такие как ссылки на сообщения, страницы друзей и новости) располагаются в левой части страницы. В правой части страницы вы увидите ваших друзей, с которыми доступен чат.

Такое расположение представляется в Bootstrap как 2-8-2. Столбец боковых ссылок слева будет шириной в два столбца, подписка на новости будет шириной в 8 столбцов, а раздел чата будет шириной в два столбца. Это основной каркас.

Но не только Bootstrap делает веб-страницу отзывчивей – есть много другие компонентов, чтобы сделать веб-страницу яснее и лучше.

Для использования Bootstrap с Django есть два способа:

• Путь Django: pip install django-bootstrap3
• Установка вручную: скачать ресурсы Bootstrap и копировать их в статическое расположение.

Путь Django

Если вы хотите установить Bootstrap через команду, то вам нужно присоединить значение bootstrap3 к переменной INSTALL_APPS.

Вот примерный шаблон Django для использования этого метода в простой HTML-форме:

{% load bootstrap3 %}
{%# simple HTML form #%}
<form action="action_url">
{% csrf_token %}
{% bootstrap_form sample_form %}
{% buttons %}
<button type="submit" class="btn btn-primary">
{% bootstrap_icon "heart" %} SUBMIT </button>
{% endbuttons %}
</form>

Для того, чтобы узнать и исследовать больше, пройдите по ссылке: http://django-bootstrap3.readthedocs.org/

Ручная установка Bootstrap

Этот способ рекомендуется для начинающих, но, если у вас соблюдается конфиденциальность, то вы можете сделать ярлыки на команды метода.

Здесь мы изучим основное включение в файлы проекта, а оставшуюся часть разберем в других главах. Когда вы скачали Bootstrap с онлайн-источника (http://getbootstrap.com), распакованная структура папок будет выглядеть примерно так:

I -- css
|      |-- bootstrap.css 
|      |-- bootstrap.css.map 
|      |-- bootstrap.min.css
 |     |-- bootstrap-theme.css
 |    |-- bootstrap-theme.css.map 
 |     `-- bootstrap-theme.min.css
|---fonts
|       |-- glyphicons-halflings-regular.eot 
|        | -- glyphicons-halflings-regular.svg 
         |-- glyphicons-halflings-regular.ttf `
          `-- glyphicons-halflings-regular.woff 
`--js
       |- - bootstrap.js '
     `-- bootstrap.min. js

Есть два типа локальных файлов. Согласованных на работу с Django: "Статичный" и "медиа". Статические файлы относятся к активным частям вашего проекта, таким как CSS, JavaScript и т.д. Медиа файлы представлены загруженными файлами проекта, в основном состоящими из изображе-ний, видео для воспроизведения или скачивания и т.д.

Добавление статичных файлов может быть осуществлено добавлением следующих строк в файл settings.py:

STATICFILES_DIRS = (
#	 put absolute path here as string not relative path.
#	 forward slash to be used even in windows.
os.path.join(?
os.path.dirname( file ),
'static1,
) ,
)

Итак, сейчас у вас есть все необходимое, чтобы создать каталог внутри вашего каталога проекта и копировать все ресурсы Bootstrap.

Контрольные вопросы

1. Каково назначение Twitter Bootstrap?
2. В каких случаях требуется пустая строка в коде и в каком количестве?
3. Какие стандартные размеры отступа при оформлении кода на языке Python?
4. Сколько секций содержит стандартная сетка каркаса страницы?
5. В чем отличие проекта от приложения?

Упражнения.

Упражнение 1.

Создав новый проект, выводящий надпись "HELLO WORLD!" на главной странице, проверьте правильность кода, не запуская сервер разработки

Упражнение 2.

Создайте ветвь вашего приложения, созданного в упражнении 1, и загрузите ее на ваш аккаунт Git.

Упражнение 3.

Скачайте и установите любую другую систему контроля версий и настройте ее для вашего проекта

Упражнение 4.

Загрузите какой либо репозиторий с проектом Django через систему контроля версий Git и запустите сервер разработки с данным проектом

Список тем, эссе

• Фреймворки для веб-разработки на языке Python
• Системы контроля версий и их значение при разработке кода
• Сравнение системы контроля версий Git и его аналогов. Преимущества и недостатки
• Стили кодирования в различных языках программирования
• Каркас веб приложения как основа веб-разработки
• Понятие стиля веб-страницы.CSS
• Язык веб-разметки HTML
• PEP-8
• Базы данных в разработке на Django: преимущества и недостатки.
• Обзор IDE для Python

Краткие итоги

• Научились работать с системой контроля версий
• Изучили основные команды Git
• Познакомились с редакторами тектов
• Узнали об IDE Pycharn
• Рассмотрели стиль кодирования на платформе Django
• Изучили структуру проекта Django
• Установили Twitter Bootstrap для быстрой разработки стилей проекта.
• Настроили базу даных для первого проекта
• Запустили сервер разработки
• Познакомились с отличием проекта от приложения