Python & eel. делаем просто на python’е и красиво на js

На площадке представлены 3 раздела:

Самоучитель-справочник по языку программирования Python3.

• Разобраны основные типы данных языка Python, такие как строки, списки и словари, кортежи и множества, классы и т. д.
• Рассмотрен синтаксис и конструкции языка — циклы, ветвление программы, обработка исключений, тернарные операторы и т. д.
• Приведены примеры деления программы на модули и способы написания чистого, хорошо читаемого кода.
• Имеется справочник встроенных функций в интерпретатор с огромным количеством примеров их использования.
• Так же подберете себе IDE редактор (интегрированную среду разработки) для облегчения написание кода.
• Самоучитель поддерживается в актуальном состоянии и пополняется новыми конструкциями языка.

Документация по стандартной библиотеке Python3.

• Богатая стандартная библиотека является одной из привлекательных сторон языка программирования Python.
• Раздел построен в виде справочника, подобного официальной документации Python3.
• Практически каждый, разобранный здесь модуль, снабжен множеством примеров практического использования.
• На данный момент представлена документация с примерами более чем по 100 встроенным модулям и пакетам. Среди которых:
  • все математические модули и модули, отвечающие за работу со строками;
  • криптографические модули и модули для работы с архивами;
  • модули, которые дополняют стандартные встроенные типы и расширяют функционал языка;
  • модули, отвечающие за работу со встроенными функциями OS;
  • модули, позволяющие работать с базами данных и различными форматами файлов (, , );
  • модули для тестирования и логирования ошибок в программах Python;
  • и многое другое …

Сторонние и часто используемые модули Python3.

• Раздел открыт недавно, в Марте 2021 года.
• Публикуются только полезные и часто используемые модули/пакеты (по мнению команды).
• Главные монменты из документации модулям/пакетам с богатыми примерами.
• Разобраны стандартные и нестандартные приемы использования по каждому модулю/пакету.
• У основных классов и функций модулей/пакетов разобраны значения всех аргументов.
• Документация постоянно обновляется и пополняется новыми примерами, модулями и пакетами.

Вступление

Тема красивых интерфейсов была и будет актуальна всегда, кто-то использует для создания графических приложений C#, кто-то использует Java, кто-то уходит в дебри C++, ну а кто-то извращается с Python, используя tkinter или PyQT. Существуют различные технологии, позволяющие совмещать красоту графических дизайнов, создаваемых на HTML, CSS и JS с гибкостью в реализации логики приложения, которую может дать другой язык. Так вот, для тех, кто пишет на самом лучшем языке программирования Python, есть возможность писать красивые интерфейсы на HTML, CSS и JS и прикручивать к ним логику на Python.

В этой статья я хочу показать на небольшом примере, как же все таки создать простое и красивое десктопное приложение на HTML, CSS, JS и Python. В качестве библиотеки для связи всех компонентов будем использовать EEL.

Что такое питон простыми словами

Для того чтобы понять, что такое Python нужно разобраться зачем вообще нужны языки программирования. Они нужны для взаимодействия человека и компьютера. Между собой люди общаются на естественном языке.

Язык программирования Python

Питон является относительно простым высокоуровневым скриптовым языком, который служит для создания различных сценариев. Это означает, что для программирования на Python, не требуется знания машинных кодов — команд для компьютера.

Программирование при помощи машинных кодов ускоряет программу, но очень трудоемко и требует хорошего знания архитектуры компьютера. Одним из таких низкоуровневых языков является ассемблер. Чаще всего низкоуровневое программирование используется в промышленности для специализированных контроллеров, где нет большого объема памяти.

Python может использоваться для программирования контроллеров в станках ЧПУ и в робототехнике. Популярный во всем мире одноплатный микрокомпьютер Raspberry Pi также программируется на питоне. С помощью «малинки» можно программировать роботов, умные дома, квадрокоптеры и множество других вещей. Pi в названии миникомпьютера обозначает, что программирование происходит на Python.

одноплатный микрокомпьютер Raspberry Pi

На языке высокого уровня нужно уметь программировать при помощи понятий, обозначаемых словами. Чаще всего это английский язык, но есть и примеры кодирования на других языках. Например, программу «Бухгалтерия 1С» можно редактировать и изменять на русском.

Питон поддерживает объектно-ориентированное программирование и является интерпретируемым языком. Это означает, что программа выполняется построчно и для ее выполнения на компьютере должен быть установлен интерпретатор. Самым распространенным и популярным интерпретатором является CPython.

Преимущества использования Python для веб-разработки

Давайте начнем с основных преимуществ,
которые предлагает Python веб-разработчикам.

Простота использования

Одна из самых привлекательных черт
языка Python — невероятная простота
использования в веб-проектах. Дальше
мы расскажем, с чем это связано.

Легкость изучения

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

Отлично подходит для
визуализации данных

Когда речь заходит о представлении
данных на сайте или в приложении, Python
просто потрясающе эффективен, и
разработчики не могли этого не оценить.
С его помощью можно легко создавать
простые и понятные отчеты и визуальные
представления данных.

Легкость чтения

Простой синтаксис Python обеспечивает
разработчикам отличную читаемость
кода. Благодаря этому разработчикам,
занятым в проекте, проще коммуницировать
и обмениваться знаниями.

Несравненная гибкость

Python это очень гибкий язык программирования. Он не замыкается в собственном мире и в процессе программирования способен смешиваться с разными языками, образуя новые реализации. Например, CPython — версия Python с C, IronPython создан для совместимости с .NET и C#, а проект PyObjc позволяет совместно использовать инструменты как Python, так и ObjectiveC. И это лишь несколько примеров.

Асинхронное программирование

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

Программирование на Python

Этот курс представлен на платформе stepik.org и является полностью бесплатным. Он поможет в доступной форме изучить азы языка программирования Python. Лектор энергично (другое слово было трудно подобрать) подает материал, а в конце каждого урока и раздела вас ждут тесты или задания. Они, кстати, проверяются автоматически. А значит, вы будете знать, правильно ли вы сделали. После того, как вы верно решили задание, можно будет посмотреть решения других участников и обсудить урок с ними же. А авторы постоянно находятся на связи и приходят на помощь. И да, напомним, это полностью бесплатно.

Найти курс можно по этой ссылке.

Функции, которые когда-нибудь можно выучить

Следующие встроенные функции Python определённо не бесполезны, но они более специализированы.

Эти функции вам, возможно, будут нужны, но также есть шанс, что вы никогда не прибегнете к ним в своём коде.

• : возвращает итератор (список, набор и т. д.);
• : возвращает , если аргумент является вызываемым;
• and : вместо них рекомендуется использовать генератор-выражения;
• : округляет число;
• : эта функция выполняет деление без остатка () и операцию по модулю () одновременно;
• , и : служат для отображения чисел в виде строки в двоичной, восьмеричной или шестнадцатеричной форме;
• : возвращает абсолютное значение числа (аргумент может быть целым или числом с плавающей запятой, если аргумент является комплексным числом, его величина возвращается);
• ;
• .

Реальные примеры

Существует различные причины и варианты необходимости использования сбора (скрэпинга) данных в Интернете. Позвольте мне перечислить некоторые из них:

• сбор данных со страницы электронного магазина, чтобы определить имеется ли в наличии одежда, которую вы хотите купить, со скидкой
• сравнить цены нескольких брендов одежды, собирая данные о них с вэб-страниц
• стоимость авиабилетов может меняться несколько раз в течение дня. Можно сканировать веб-сайт и дождаться момента, когда цена будет снижена
• проанализировать веб-сайты, чтобы определить, должна ли быть стартовая стоимость продажи низкой или высокой, чтобы привлечь больше участников на аукцион или коррелирует ли длительность проведения аукциона с более высокой ценой конечной ценой продажи

Размещение Django сайта на Heroku

Последний шаг — это фактическое размещение кода на Heroku. Если вы раньше настраивали сервер, вы будете поражены тем, как сильно Heroku упрощает данный процесс.

Весь процесс будет состоять из следующих этапов:

• создайте новое приложение на Heroku и вставьте в него наш код;
• настройте взаимодействие с git, то есть так называемый «hook» для Heroku;
• настройте приложение на игнорирование статических файлов;
• для активации приложения в онлайн режим, запустите сервер Heroku;
• посетите приложение, перейдя по предоставленному Heroku URL адресу.

В качестве первого шага можем создать новое приложение Heroku. Для этого в командной строке наберите . Heroku создаст случайное имя для нашего приложения, в моем случае это . Ваше название будет другим.

Shell

(pages) $ heroku create
Creating app… done, ⬢ fathomless-hamlet-26076
https://fathomless-hamlet-26076.herokuapp.com/ |
https://git.heroku.com/fathomless-hamlet-26076.git

1 2 3 4

(pages)$heroku create Creating app…done,⬢fathomless-hamlet-26076 httpsfathomless-hamlet-26076.herokuapp.com| httpsgit.heroku.comfathomless-hamlet-26076.git

На данный момент нам остается только настроить Heroku. Для этого укажем Heroku проигнорировать статические файлы вроде CSS и JavaScript, которые Django по умолчанию попытается исправить под себя. Выполним следующую команду:

Shell

(pages) $ heroku config:set DISABLE_COLLECTSTATIC=1

1	(pages)$heroku configset DISABLE_COLLECTSTATIC=1

Теперь можем разместить код на Heroku.

Shell

(pages) $ git push heroku master

1	(pages)$git push heroku master

Если бы мы только что набрали , то код был бы загружен в GitHub, а не в Heroku. Добавление слова в команду позволяет отправить код на Heroku. Первые несколько раз это может сбивать с толку.

Наконец, нам нужно запустить в онлайн наше Heroku приложение. Поскольку трафик веб-сайтов растет, они нуждаются в дополнительных услугах от Heroku. Однако для нашего основного примера мы можем использовать самый низкий уровень , который является бесплатным.

Введите следующую команду.

Shell

(pages) $ heroku ps:scale web=1

1	(pages)$heroku psscale web=1

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

Shell

(pages) $ heroku open

1	(pages)$heroku open

Наш адрес . Вы можете убедиться в этом, вот появившаяся домашняя страница:

Домашняя страница на Heroku

Страница «About» также открылась должным образом:

Страница «About» на Heroku

Вам нет нужды разлогиниваться или покидать свое приложение в Heroku. Оно будет работать само по себе на этом бесплатном уровне.

Для веб-разработки

Python имеет очень хорошую поддержку для веб-разработки с его фреймворками, такими как Django, Flask и другими. Он может использоваться для создания веб-приложений на стороне сервера и может быть интегрирован с любым внешним интерфейсом. Обычно разработчики используют JavaScript во внешнем интерфейсе и python для поддержки операций на стороне сервера. Python не используется напрямую в браузерах.

Django является одним из самых популярных веб-фреймворков на Python. Эти инфраструктуры предоставляют пакет, в котором у вас есть определенная структура, с легкостью поддерживает взаимодействие с базой данных; все это настраивается с помощью минимальной команды установки. Если вы хотите что-то минимальное для начала — я рекомендую Flask!

Помимо них, Python имеет большое количество библиотек для веб-разработки.

Пример — доступ к файловой системе компьютера со смартфона.

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

Данная команда запускает файловый сервер, к которому можно получить доступ в той же сети. Чтобы получить доступ к своим файлам на мобильном устройстве, просто подключитесь к той же сети (Wi-Fi или воспользуйтесь точкой доступа телефона на ноутбуке). Теперь откройте браузер в вашем телефоне. 

Проверьте свой IP, запустив -. Проверьте ваш локальный IP (должен начинаться с 192.168….)

Пример:

И на мобильном телефоне вы увидите текущий каталог

Документируйте свой путь на GitHub

Это одна из самых важных вещей, которую должен начинать каждый программист,GitHubэто как резюме для программистов, потому что оно говорит и показывает вашу работу. Поэтому убедитесь, что вы создаете GitHub-репозиторий в тот момент, когда вы учитесь программировать. Попытайтесь предоставить хороший файл read.me (файл Read.me — это файл описания, в котором рассказывается о вашем хранилище — не беспокойтесь, что вы привыкнете к нему при его использовании), и обновляйте его. Кто знает, кто может читать ваш GitHub Repository, и, возможно, иногда они нанимают вас для работы на них. Если вы не знаете, как создавать и работать с GitHub, посмотрите видео ниже:

Кредиты:MicrowaveSam

Как вы теперь заметили, вы сознательно или неосознанно достигли конца моего урока (проверьте блок-схему в начале). Теперь я старался изо всех сил, чтобы дать вам, ребята, все ресурсы, инструменты и рекомендации, мяч на вашем поле, чтобы решить, что вы хотите с ним делать Теперь, если вы, ребята, хотите увидеть мой репозиторий GitHub и узнать что-то новое из него, пожалуйста, смотрите ниже:

Спасибо, ребята, что читаете мою статью. Если у вас есть какие-либо сомнения относительно чего-либо, Python просто сообщите мне через раздел комментариев, я отвечу на это в течение нескольких минут или не лет (шучу). Хорошо, поставь педаль на металл и запрограммируй. Увидимся, хорошего дня.

Кредиты:Giphy

Получение данных из форм

Итак, во-первых разберёмся с формами. В модуле CGI есть полезный класс: FieldStorage, который содержит в себе переданную в форме информацию. По сути дела этот класс представляет из себя словарь, обладающий теми же свойствами, что и обычный словарь в python.

У класса FieldStorage есть 2 метода получения значений данных формы:

FieldStorage.getfirst(name, default=None) — всегда возвращает только одно значение, связанное с именем поля формы. Метод возвращает только первое значение в том случае, если нехороший пользователь послал более одного значения

Обратите внимание, что порядок, в котором будут получены значения, могут отличаться от браузера к браузеру. Если нет такого поля формы или значение не существует, то метод возвращает default

FieldStorage.getlist(name) — возвращает список значений, связанных с именем поля формы.

Разберём на примере: создадим в нашей папке файл index.html со следующим содержимым (это будет наша форма, данные из которой мы будем обрабатывать):

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Обработка данных форм</title>
</head>
<body>
    <form action="/cgi-bin/form.py">
        <input type="text" name="TEXT_1">
        <input type="text" name="TEXT_2">
        <input type="submit">
    </form>
</body>
</html>

А в папке cgi-bin/ — файл form.py (обработчик формы)

#!/usr/bin/env python3
import cgi

form = cgi.FieldStorage()
text1 = form.getfirst("TEXT_1", "не задано")
text2 = form.getfirst("TEXT_2", "не задано")

print("Content-type: text/html\n")
print("""<!DOCTYPE HTML>
        <html>
        <head>
            <meta charset="utf-8">
            <title>Обработка данных форм</title>
        </head>
        <body>""")

print("<h1>Обработка данных форм!</h1>")
print("<p>TEXT_1: {}</p>".format(text1))
print("<p>TEXT_2: {}</p>".format(text2))

print("""</body>
        </html>""")

Попробуем это в действии (кто сидит на linux, не забудьте поставить права на выполнение).

Запускаем локальный сервер, и переходим на localhost:8000:

Поиск сайта для скрапинга

Для знакомства с процессом скрапинга можно воспользоваться сайтом https://quotes.toscrape.com/, который, похоже, был создан для этих целей.

Из него можно было бы создать, например, хранилище имен авторов, тегов или самих цитат. Но как это сделать? Сперва нужно изучить исходный код страницы. Это те данные, которые возвращаются в ответ на запрос. В современных браузерах этот код можно посмотреть, кликнув правой кнопкой на странице и нажав «Просмотр кода страницы».

На экране будет выведена сырая HTML-разметка страница. Например, такая:

На этом примере можно увидеть, что разметка включает массу на первый взгляд перемешенных данных. Задача веб-скрапинга — получение доступа к тем частям страницы, которые нужны. Многие разработчики используют для этого, но библиотека Beautiful Soup в Python — более дружелюбный способ извлечения необходимой информации.

Создание скрипта скрапинга

В PyCharm (или другой IDE) добавим новый файл для кода, который будет отвечать за парсинг.

Копировать

Отрывок выше — это лишь начало кода. В первую очередь в верхней части файла выполняется импорт и Beautiful Soup. Затем в переменной сохраняется адрес страницы, с которой будет поступать информация. Эта переменная затем передается функции . Результат присваивается переменной . Дальше используем конструктор , чтобы поместить текст ответа в переменную . В качестве формата выберем . Наконец, выведем переменную. Результат должен выглядеть приблизительно вот так.

Вот что происходит: ПО заходит на сайт, считывает данные, получает исходный код — все по аналогии с ручным подходом. Единственное отличие в том, что в этот раз достаточно лишь одного клика.

Расширяем возможности шаблона в Django

Главная сила шаблонов в их способности расширяться. Если задуматься, то на большинстве сайтов есть содержимое, которое повторяется на каждой странице (заголовки, футеры и так далее). Для разработчиков было бы здорово иметь одно установленное место для кода заголовка, которое бы передавалось по наследству каждому шаблону.

Это возможно! Создадим HTML-файл , у которого будет заголовок с ссылками на две созданные нами страницы. Название для файла можно выбрать любое, в данной случае просто стало традицией. Теперь закрываем веб-сервер и затем создаем новый файл.

Shell

(pages) $ touch templates/base.html

1	(pages)$touchtemplatesbase.html

В Django, шаблонный язык для добавления ссылок и базовых логических операций минимален. Ознакомиться со встроенным списком шаблонных тегов можно в . Шаблонные теги оформляются так , где «something» сам по себе является тегом. Вы даже можете создать собственные шаблонные теги.

Для добавления URL-ссылок в проект мы можем использовать , который присваивает себе имя URL паттерна в качестве аргумента. Помните, как мы добавляли опциональные URL названия двум адресам в ? Это было сделано именно по этой причине. Тег использует эти названия для автоматического создания ссылок.

URL путь для нашей домашней страницы был назван , поэтому для настройки ссылки к ней мы будем использовать: .

Python

<!— templates/base.html —>
<header>
<a href=»{% url ‘home’ %}»>Home</a> | <a href=»{% url ‘about’ %}»>About</a>
</header>

{% block content %}
{% endblock content %}

1 2 3 4 5 6 7

<!—templatesbase.html—> <header> <ahref=»{% url ‘home’ %}»>Home<a>|<ahref=»{% url ‘about’ %}»>About<a> <header> {%block content%} {%endblock content%}

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

Python

<!— templates/home.html —>
{% extends ‘base.html’ %}

{% block content %}
<h1>Homepage</h1>
{% endblock content %}

1 2 3 4 5 6

<!—templateshome.html—> {%extends’base.html’%} {%block content%} <h1>Homepage<h1> {%endblock content%}

и

Python

<!— templates/about.html —>
{% extends ‘base.html’ %}

{% block content %}
<h1>About page</h1>
{% endblock content %}

1 2 3 4 5 6

<!—templatesabout.html—> {%extends’base.html’%} {%block content%} <h1>Aboutpage<h1> {%endblock content%}

Запускаем сервер с и открываем страницы и вновь. Как видите, на обоих страницах появились заголовки.

Неплохо, правда?

Домашняя страница с заголовком

Страница «About» с заголовком

С шаблонами можно осуществить множество операций. Обычно создается файл а затем в проекте добавляются дополнительные шаблоны которые расширяют базовый файл.

Проекты Python в веб-разработке

Посмотрим, что можно написать на Python новичку в каждой области. Если вы хотите продемонстрировать свои навыки веб-разработки, можно начать с самого простого — с блога. Одного знания Python здесь может оказаться недостаточно — нужно также знать основы HTML, CSS и уметь работать с базами данных.

В качестве базы данных в таком проекте можно применить MySQL — эта система управления БД в веб-разработке используется чаще всего, потому что её легко администрировать и диалект языка запросов SQL, который в ней используется, достаточно прост. У блога чаще всего один автор, который обычно является и администратором сайта, так что не нужно будет много времени уделять разделению прав пользователей — достаточно сделать админку с небольшой функциональностью.

ButterCMS — пример CMS для блога, основанной на Python

Дизайн блога не требует выдающихся дизайнерских навыков, так что можно сосредоточиться на программистской части. В процессе разработки простого сайта можно отточить свои навыки работы с Django и Flask — популярными у питонистов фреймворками. Если не уверены в своих силах, то перед созданием блога сделайте для разминки сайт-визитку — эту задачу можно осилить и за один день.

Шаг 5 — Запуск сайта на реальном сервере

Так, давайте вернемся в нашему сайту. Запустить сайт на Python не так просто, как c HTML и PHP файлами, когда мы перетаскиваем и загружаем файлы при помощи FTP-клиента. Нам нужно делать всё по порядку, будьте терпеливы и внимательно выполняйте каждый шаг.

Шаг 5.1 — Создаем аккаунт Heroku

Создайте аккаунт на Heroku, перейдя по этой ссылке.

Шаг 5.2 — Устанавливаем необходимый инструменты

Прежде всего это , мы будем использовать git для загрузки файлов на сервер. А чтобы установить git, откройте командную строку и введите следующее:

sudo apt install git-all

git config --global user.name "John Doe"git config --global user.email johndoe@example.com

Далее следует, это такой собственный git для Heroku. Для установки:

sudo snap install --classic heroku

Отлично. Теперь у нас есть всё, что нужно. Поехали дальше.

Шаг 5.3 — Настройка Heroku через командную строку

Нужно установить Heroku туда же, где находится наше приложение. Давайте перейдем в папку с нашим основным скриптом, и зайдем в аккаунт Heroku, используя наши данные. Вас попросят нажать любую клавишу для входа и перенаправят в браузер. После того ,как вы успешно вошли, ваша командная строка будет выглядеть так:

Нажмите любую кнопку

Теперь нам нужно создать наше приложение. Хорошо подумайте над его названием, потому что это будет ваше доменное имя после herokuapp.com. Например, . Я хотел использовать своё имя, но такое название было уже занято. Поэтому я выбрал .

Шаг 5.4 — Создаем необходимые файлы (всего 3)

requirements.txt — Содержит список зависимостей (библиотек), которые Heroku должен установить, чтобы наше приложение работало правильно. Для этого, переходим в виртуальную среду, которую мы создали ранее, с помощью pip устанавливаем. Это веб-сервер Python. После этого напишите , чтобы увидеть список зависимостей, а потом , чтобы создать текстовый файл с этим списком. Это нам и нужно. Вы можете найти файл в вашей папке, переместите его туда, где находится наш файл Python.

Список зависимостей

Важное примечание — Пожалуйста, удостоверьтесь, что ваш файл requirements выглядит, как представленный ниже. Иначе Heroku не примет его и выдаст ошибку

Отредактируйте файл, чтобы он выглядел так.

requirements.txt

Procfile — У этого файла нет расширения. Он содержит имя сервера и название приложения. Создайте файл, назовите его и напишите в нем следующее:

web: gunicorn mainscript:app

Здесь, gunicorn — это используемый сервер. — это название файла Python, — это название приложения, которое мы придумали при создании экземпляра класса flask (смотри фрагмент кода в шаге 2). Если ваши названия отличаются, измените их.

runtime.txt — Содержит информацию о версии Python, которую вы хотите использовать. В этом файле напишите:

python-3.7.0

Я использую Python 3.x, поэтому я использовал эту среду. Если вы используете Python 2.x, укажите вместо этого. Отлично, все готово. Теперь нам нужно просто всё загрузить.

Наконец, всё, что нам нужно, в одном месте

Шаг 5.5 — Загрузка всего необходимого

Отлично. Чтобы не объяснять всё по отдельности, к каждой строке дам комментарий. Каждую строку нужно выполнять отдельно.

#Убедитесь, что находитесь в той же директории, где лежит ваш файл Python#Убедитесь, что вы залогинены в heroku#Вызовите свое приложениеheroku git:remote --app dhrumilp#Инициализируйте git, чтобы загрузить все файлыgit init#Добавьте все файлы (это точка в конце, что означает все)git add .#Теперь, зафиксируйте все добавленные файлы на серверgit commit -m "First upload"#Запушьте все в master branchgit push heroku master

Загрузка…

Готово.

Всё готов. Уфф. Поздравляю, если вы смогли добраться до этого этапа. Моё приложение доступно на dhrumilp.herokuapp.com, можете посмотреть.

Шаг 2 — Создание простого сайта

Создать простой сайт при помощи Python и Flask станет для вас легкой прогулкой. Вам просто нужно написать 5 строчек кода, и всё.

1. Сначала импортируем класс Flask из фреймворка Flask.
2. Создаем переменную, в которой будем хранить экземпляр класса flask, иными словами, ваше приложение Flask. Параметр определяет название вашего приложения. По умолчанию это .
3. Маршрут, как мы уже сказали, это путь или URL, по которому вы можете посмотреть свой сайт. В данном случае он настроен на корневую папку.
4. Теперь создаем функцию. Она определяет, что будет делать наша страница. Пока просто напечатаем “hello world”.
5. Запускаем скрипт. Если название вашего приложения , скрипт сработает, вот и всё. Но если вы вызываете скрипт из другой части кода, наш параметр из второго пункта использует имя нашего файла, , и следовательно скрипт не сработает.

#Import dependenciesfrom flask import Flask#Create instance of Flask Appapp = Flask(__name__)#Define Route@app.route("/")#Contentdef home():    return("Home Page")#Running and Controlling the scriptif (__name__ =="__main__"):    app.run(debug=True)

Вот вы и создали свою первую веб-страницу

Всё ещё не разобрались с маршрутами? Следующий фрагмент кода прояснит картину. На всех сайтах есть страница О нас, верно? Давайте и на нашем создадим такую же. У нас есть 2 разных маршрута для 2 разных страниц.

#Import dependenciesfrom flask import Flask#Create instance of Flask Appapp = Flask(__name__)#Define Route and Contant of that page@app.route("/")def home():    return("Home Page")#Define 2nd Route and Content@app.route("/about")def about():    return("About Me")#Running and Controlling the scriptif (__name__ =="__main__"):    app.run(debug=True)

Что выводит второй маршрут

Шаг 3 — HTML и CSS

Созданный нами сайт выглядит не очень красиво. Что нужно использовать, чтобы улучшить его? Конечно же, HTML и CSS. Они лучше всего подходят для этой задачи. Если вы разбираетесь в веб-разработке, вы можете создать новый файл .html с нуля. Но если вы не умеете это делать, в Интернете существует немало платформ для этого. Найдите наиболее подходящую для вас.

Теперь мы хотим, чтобы программа возвращала не простой текст, а конкретные html-страницы, которые мы создали. Для этого нужно импортировать ещё один класс, render_template. Тогда наша функция должна возвращать, чтобы мы видели конкретную html-страницу по этому маршруту.

#Import dependenciesfrom flask import Flask, render_template#Create instance of Flask Appapp = Flask(__name__)#Define Route and Contant of that page@app.route("/")def home():    return render_template("home.html")#Define 2nd Route and Content@app.route("/blog")def about():    return render_template("blog.html")#Running and Controlling the scriptif (__name__ =="__main__"):    app.run(debug=True)

Для HTML — все файлы .html, которые вы вызываете, должны содержаться в папке под названием в вашей рабочей папке.

Для CSS — вам нужно создать папку и добавить в нее папку , а уже потом добавить в неё ваши файлы .css.