Pull to refresh

Flask-HTML, генератор страниц с помощью классов Python

Здравствуйте. Я недавно начал писать библиотеки для Flask фреймворка. Сегодня я вам расскажу про Flask-HTML. Библиотека которая облегчит вам генерации от статических до сложных страниц.

Содержание

  1. Установка

  2. Применение

  3. Объяснение

Установка

Можете установить с помощью пакетного менеджера pip

pip install flask_html

Кроме этого вы можете посетит Github страницу библиотеки и установить.

Применение

Стандартное применение в своих роутах

from flask_html import Page, Head
from flask_html.core import Style
from flask_html.tags import Body, Div, P
from flask import request

@app.route('/')
def index():
    head = Head('Title', ['link to css'],['link to js'], [{"meta_property": "value"}])
    page = Page(head)
    body = Body(page, styles=Style(color="red", padding_top="15px"),classes=['class1', 'class2'], id='body_id',elements=[
        Div(styles=Style(margin="10px"), classes=['class1', 'class2'], id='div_id', elements=[
            P(styles=Style(color="blue"), classes=['class1', 'class2'], id='p_id', elements=[
                "Hello World"
            ])
        ])
    ])
    return page.render(body, request)

Давайте разбираться!

  1. В первую очередь на каждую страницу создаём переменную использую класс Head. Аргументы которога является Head(title, [link to css], [link to js], [{meta_prop : "value"}].

  2. Дальше идёт класс Page(head: Head). Которому прикрепляем Head.

  3. Создаём нод Body которому передаём перемменную page

  4. Дальше с помощью тег классов делаем ноды для нашу страниц и ложим их в elements = [] отцовскому ноду

  5. В конце рендерим саму страницу передавая body и requests

Объяснение.

Каждый нод имеет примерно одинаковую структуру

"""Div HTML element

Args:
    styles (Style, optional): Inline css styles. Defaults to None.
    classes (List[str], optional): List of class names. Defaults to [].
    id (str, optional): Unique ID. Defaults to None.
    elements (List[object], optional): List of child elements. Defaults to [].
    props (Dict[str, str], optional): Additional tag properties. Defaults to {}.
"""
Div(styles=None, classes=[], id=None, elements=[], props={})

Каджому элементу можно задавать inline style с помощь класса flask_html.core.Style.

from flask_html.core import Style
from flask_html.tags import Div

div = Div(style=Style(background_color="red", padding="10px", margin="50px"))

Каждому элементу можно написать листенер с помощью метода класса .on(event, function)

opts = [Option('{}'.format(x),'Name {}'.format(x)) for x in range(10)]
sel = Select(opts).on('change', 'let val = $(this).val(); alert(val)')
page = Page(Head('Title', ['link to css'],['link to js'], [{"meta_property": "value"}]))
body = Body(page, elements=[
    sel
])
return page.render(body, request)

Jquery CDN автоматический внедрено в Head!

Спасибо за потраченное время :)
Библиотека написана мною. Идеи и правки приветствуется в Github

Ссылки

  1. Github

  2. Pypi

Tags:
Hubs:
You can’t comment this publication because its author is not yet a full member of the community. You will be able to contact the author only after he or she has been invited by someone in the community. Until then, author’s username will be hidden by an alias.