Учимся Flask: как написать своё веб-приложение

Простой

5 мин

5.2K

Блог компании OTUSПрограммирование*Python*Веб-разработка*

Обзор

Привет, будущий разработчик! Сегодня создадим первое полноценное веб‑приложение на Flask с нуля.

Ты, наверное, слышал, что сайты и веб‑приложения — это сложно. Что нужно знать кучу языков, писать километры кода и сидеть ночами над багами. Но на самом деле, всё гораздо проще, если у тебя есть правильный инструментарий.

Сегодня мы разберём Flask — лёгкий, но мощный фреймворк для Python, который позволит буквально за пару часов написать веб‑приложение с формами, обработкой данных и HTML‑шаблонами.

Flask — это микрофреймворк для веб‑разработки на Python. Переводя на человеческий:

Это инструмент, который позволяет писать сайты и веб‑приложения.
Он простой, но в то же время гибкий.
На нём делают как простые блоги, так и серьёзные проекты (например, сервисы NASA и Netflix).
В отличие от Django, он не заставляет тебя учить миллион вещей сразу.

Установка Flask

Flask можно установить прямо в PyCharm, без терминала.

Создадим новый проект:

Открываем PyCharm → Create New Project.
Выбираем «New Virtual Environment».
Проверяем, что выбран Python‑интерпретатор.
Нажимаем «Create».

Установка Flask через интерфейс:

Открываем Settings (File → Settings или PyCharm → Preferences на Mac).
Переходим в «Project: <имя_проекта> → Python Interpreter».
Нажимаем + (Add Package), вводим Flask в поиск.
Выбираем последнюю версию и нажимаем Install Package.

Проверим установку:

Создаём app.py и пишем:

import flask
print("Flask установлен! Версия:", flask.__version__)

Запускаем файл (Shift + F10). Если всё установлено правильно, увидим:

Flask установлен! Версия: 3.1.0

Теперь Flask готов к работе.

Создаём первый сервер на Flask

Минимальный сервер Flask с разбором синтаксиса

Создаём новый файл app.py и вставляем следующий код:

# Импортируем Flask
from flask import Flask  

# Создаём экземпляр приложения Flask
app = Flask(__name__)  

# Определяем маршрут для главной страницы
@app.route("/")
def home():
    return "Привет, мир! Flask работает!"  # Возвращаем текст в браузер

# Запускаем сервер
if __name__ == "__main__":
    app.run(debug=True)  # debug=True включает автоматическую перезагрузку

Разбирем код по частям:

Импортируем Flask

from flask import Flask

Мы подключаем Flask, чтобы использовать его в коде.

Создаём объект приложения

app = Flask(__name__)

Этот объект app — это наше веб‑приложение.

name — это имя текущего файла. Flask использует его, чтобы понимать, где находится главный код.

Определяем маршрут

@app.route("/")

Этот декоратор говорит Flask:

«Когда пользователь заходит на /, вызови функцию home()»

Функция, которая возвращает ответ

def home():
    return "Привет, мир! Flask работает!"

Эта функция обрабатывает запрос на главную страницу и возвращает текст.

Запускаем сервер

if __name__ == "__main__":
    app.run(debug=True)

Эта строка запускает сервер, если файл выполняется напрямую.

debug=True включает автоперезапуск сервера при изменении кода.

Запускаем Flask‑сервер

Открываем терминал.
Переходим в папку с app.py:
```
cd /путь/к/папке
```
Запускаем сервер:
```
python app.py
```

Теперь открываем в браузере http://127.0.0.1:5000/ и видим:

Привет, мир! Flask работает!

Первый сервер успешно запущен.

Добавляем новые страницы и маршруты

Добавим ещё несколько страниц.

Изменяем app.py:

from flask import Flask  

app = Flask(__name__)  

# Главная страница
@app.route("/")
def home():
    return "<h1>Главная страница</h1><p>Добро пожаловать!</p>"

# Страница "О нас"
@app.route("/about")
def about():
    return "<h1>О нас</h1><p>Мы изучаем Flask!</p>"

# Страница "Контакты"
@app.route("/contact")
def contact():
    return "<h1>Контакты</h1><p>Свяжитесь с нами: email@example.com</p>"

if __name__ == "__main__":
    app.run(debug=True)

Теперь у нас три страницы:

http://127.0.0.1:5000/ — Главная
http://127.0.0.1:5000/about — О нас
http://127.0.0.1:5000/contact — Контакты

Если код изменился, перезапускаем сервер (Ctrl + C, потом python app.py).

Подключаем HTML-шаблоны

Сейчас мы выводим HTML прямо в Python, что неудобно. Правильный способ — использовать шаблоны.

Создаём папку templates. Создадим такую структуру проекта:

/мой_проект
    ├── app.py
    ├── templates
    │   ├── index.html

Создаём index.html. Создаём файл templates/index.html и пишем код:

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Главная</title>
</head>
<body>
    <h1>Привет, Flask!</h1>
    <p>Добро пожаловать на мой сайт.</p>
</body>
</html>

Меняем app.py, чтобы использовать HTML

from flask import Flask, render_template  

app = Flask(__name__)  

@app.route("/")  
def home():
    return render_template("index.html")  # Подключаем HTML-шаблон

if __name__ == "__main__":
    app.run(debug=True)

Теперь Flask использует HTML‑шаблон вместо простого текста. Перезапускаем сервер и обновляем браузер. Теперь готова настоящая веб‑страница.

Динамические страницы: передаём данные в шаблон

Сделаем страницу персонализированной.

Меняем index.html:

<h1>Привет, {{ name }}!</h1>
<p>Добро пожаловать на мой сайт.</p>

Меняем app.py:

@app.route("/")
def home():
    return render_template("index.html", name="Алекс")

Теперь переменная {{ name }} в HTML заменится на «Алекс».

Обрабатываем формы и ввод пользователя

Добавим форму, где пользователь вводит своё имя. Создаём templates/form.html:

<form action="/greet" method="post">
    <label>Введите имя:</label>
    <input type="text" name="username">
    <button type="submit">Отправить</button>
</form>

Меняем app.py:

from flask import Flask, render_template, request  

app = Flask(__name__)  

@app.route("/")  
def home():
    return render_template("form.html")  

@app.route("/greet", methods=["POST"])  
def greet():
    username = request.form["username"]  # Получаем данные из формы
    return f"Привет, {username}!"  # Возвращаем ответ

if __name__ == "__main__":
    app.run(debug=True)  from flask import Flask, render_template, request  

app = Flask(__name__)  

@app.route("/")  
def home():
    return render_template("form.html")  

@app.route("/greet", methods=["POST"])  
def greet():
    username = request.form["username"]  # Получаем данные из формы
    return f"Привет, {username}!"  # Возвращаем ответ

if __name__ == "__main__":
    app.run(debug=True)

Теперь Flask показывает форму пользователю, получает данные (имя) и выводит приветствие.

Что делать дальше?

Прочитать официальную документацию.
Добавить стили (CSS).
Сделать страницу с блогом.
Подключить базу данных (например, SQLite).

Если что‑то непонятно, попробуй найти ответ в документации, а если совсем сложно — спрашивай в комментариях.

Материал подготовлен для будущих разработчиков в рамках нового онлайн-курса Otus «Python-разработчик для подростков». Оставьте заявку на странице курса и получите бесплатное индивидуальное занятие-диагностику.

Теги:

Хабы: