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

fb70a7650bb31a7d5b99138aa6dafebe.png

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

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

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

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

  • Это инструмент, который позволяет писать сайты и веб‑приложения.

  • Он простой, но в то же время гибкий.

  • На нём делают как простые блоги, так и серьёзные проекты (например, сервисы NASA и Netflix).

  • В отличие от Django, он не заставляет тебя учить миллион вещей сразу.

Установка Flask

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

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

  1. Открываем PyCharm → Create New Project.

  2. Выбираем «New Virtual Environment».

  3. Проверяем, что выбран Python‑интерпретатор.

  4. Нажимаем «Create».

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

  1. Открываем Settings (File → Settings или PyCharm → Preferences на Mac).

  2. Переходим в «Project: <имя_проекта> → Python Interpreter».

  3. Нажимаем + (Add Package), вводим Flask в поиск.

  4. Выбираем последнюю версию и нажимаем 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‑сервер

  1. Открываем терминал.

  2. Переходим в папку с app.py: 

    cd /путь/к/папке

  3. Запускаем сервер: 

    python app.py

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

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

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

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

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

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

from flask import Flask  

app = Flask(__name__)  

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

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

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

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 и пишем код: 




    
    Главная


    
Привет, Flask!

    
Добро пожаловать на мой сайт.

Меняем 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: 

Привет, {{ name }}!


Добро пожаловать на мой сайт.

Меняем app.py: 

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

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

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

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

Меняем 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-разработчик для подростков». Оставьте заявку на странице курса и получите бесплатное индивидуальное занятие-диагностику.

© Habrahabr.ru