ซอร์สโค้ด : https://github.com/volfpeter/fasthx
เอกสารและตัวอย่าง : https://volfpeter.github.io/fasthx
การแสดงผลฝั่งเซิร์ฟเวอร์ Fastapi พร้อมการสนับสนุน HTMX ในตัว
คุณสมบัติที่สำคัญ:
htmy , jinja2 หรือ dominateแพ็คเกจมีอยู่ใน PYPI และสามารถติดตั้งได้ด้วย:
$ pip install fasthxแพ็คเกจมีการพึ่งพาตัวเลือกสำหรับ การรวมอย่างเป็นทางการ ต่อไปนี้:
pip install fasthx[htmy]pip install fasthx[jinja] สำหรับตัวอย่างที่สมบูรณ์ แต่ง่าย ๆ ที่แสดงการใช้งานพื้นฐานของ FastHX โปรดดูโฟลเดอร์ตัวอย่าง
ต้องการ: pip install fasthx[htmy]
การให้บริการคำขอ HTML และ HTMX ด้วย HTMY นั้นง่ายพอ ๆ กับการสร้างอินสแตนซ์ fasthx.htmy.HTMY และใช้วิธีการ hx() และ page() decorator บนเส้นทางของคุณ
ตัวอย่างด้านล่างถือว่าการมีอยู่ของ IndexPage และส่วนประกอบ htmy UserList ตัวอย่างการทำงานเต็มรูปแบบกับส่วนประกอบ htmy สามารถพบได้ที่นี่
from datetime import date
from fastapi import FastAPI
from pydantic import BaseModel
from fasthx . htmy import HTMY
# Pydantic model for the application
class User ( BaseModel ):
name : str
birthday : date
# Create the FastAPI application.
app = FastAPI ()
# Create the FastHX HTMY instance that renders all route results.
htmy = HTMY ()
@ app . get ( "/users" )
@ htmy . hx ( UserList ) # Render the result using the UserList component.
def get_users ( rerenders : int = 0 ) -> list [ User ]:
return [
User ( name = "John" , birthday = date ( 1940 , 10 , 9 )),
User ( name = "Paul" , birthday = date ( 1942 , 6 , 18 )),
User ( name = "George" , birthday = date ( 1943 , 2 , 25 )),
User ( name = "Ringo" , birthday = date ( 1940 , 7 , 7 )),
]
@ app . get ( "/" )
@ htmy . page ( IndexPage ) # Render the index page.
def index () -> None : ... ต้องการ: pip install fasthx[jinja]
ในการเริ่มต้นให้บริการคำขอ HTML และ HTMX สิ่งที่คุณต้องทำคือสร้างอินสแตนซ์ของ fasthx.Jinja และใช้วิธีการ hx() หรือ page() เป็นนักตกแต่งบนเส้นทางของคุณ hx() จะกระตุ้นการแสดงผล HTML สำหรับคำขอ HTMX เท่านั้นในขณะที่ page() แสดงผล HTML โดยไม่มีเงื่อนไข ดูรหัสตัวอย่างด้านล่าง:
from fastapi import FastAPI
from fastapi . templating import Jinja2Templates
from fasthx import Jinja
from pydantic import BaseModel
# Pydantic model of the data the example API is using.
class User ( BaseModel ):
first_name : str
last_name : str
# Create the app.
app = FastAPI ()
# Create a FastAPI Jinja2Templates instance and use it to create a
# FastHX Jinja instance that will serve as your decorator.
jinja = Jinja ( Jinja2Templates ( "templates" ))
@ app . get ( "/" )
@ jinja . page ( "index.html" )
def index () -> None :
...
@ app . get ( "/user-list" )
@ jinja . hx ( "user-list.html" )
async def htmx_or_data () -> list [ User ]:
return [
User ( first_name = "John" , last_name = "Lennon" ),
User ( first_name = "Paul" , last_name = "McCartney" ),
User ( first_name = "George" , last_name = "Harrison" ),
User ( first_name = "Ringo" , last_name = "Starr" ),
]
@ app . get ( "/admin-list" )
@ jinja . hx ( "user-list.html" , no_data = True )
def htmx_only () -> list [ User ]:
return [ User ( first_name = "Billy" , last_name = "Shears" )]ดูตัวอย่างการทำงานเต็มรูปแบบที่นี่
ต้องใช้: pip install fasthx
หากคุณต้องการใช้เอ็นจิ้นการเรนเดอร์โดยไม่ต้องรวม Fasthx คุณสามารถสร้าง hx() และ page() นักตกแต่งซึ่งให้ฟังก์ชั่นทั้งหมดที่คุณต้องการ สิ่งที่คุณต้องทำคือใช้โปรโตคอล HTMLRenderer
ในทำนองเดียวกันกับกรณี Jinja, hx() เฉพาะทริกเกอร์การแสดงผล HTML สำหรับคำขอ HTMX ในขณะที่ page() แสดงผล HTML โดยไม่มีเงื่อนไข ดูรหัสตัวอย่างด้านล่าง:
from typing import Annotated , Any
from fastapi import Depends , FastAPI , Request
from fasthx import hx , page
# Create the app.
app = FastAPI ()
# Create a dependecy to see that its return value is available in the render function.
def get_random_number () -> int :
return 4 # Chosen by fair dice roll.
DependsRandomNumber = Annotated [ int , Depends ( get_random_number )]
# Create the render methods: they must always have these three arguments.
# If you're using static type checkers, the type hint of `result` must match
# the return type annotation of the route on which this render method is used.
def render_index ( result : list [ dict [ str , str ]], * , context : dict [ str , Any ], request : Request ) -> str :
return "<h1>Hello FastHX</h1>"
def render_user_list ( result : list [ dict [ str , str ]], * , context : dict [ str , Any ], request : Request ) -> str :
# The value of the `DependsRandomNumber` dependency is accessible with the same name as in the route.
random_number = context [ "random_number" ]
lucky_number = f"<h1> { random_number } </h1>"
users = "" . join (( "<ul>" , * ( f"<li> { u [ 'name' ] } </li>" for u in result ), "</ul>" ))
return f" { lucky_number } n { users } "
@ app . get ( "/" )
@ page ( render_index )
def index () -> None :
...
@ app . get ( "/htmx-or-data" )
@ hx ( render_user_list )
def htmx_or_data ( random_number : DependsRandomNumber ) -> list [ dict [ str , str ]]:
return [{ "name" : "Joe" }]
@ app . get ( "/htmx-only" )
@ hx ( render_user_list , no_data = True )
async def htmx_only ( random_number : DependsRandomNumber ) -> list [ dict [ str , str ]]:
return [{ "name" : "Joe" }]ดูตัวอย่างการทำงานเต็มรูปแบบที่นี่
Jinja2 ที่ซับซ้อนพร้อมคุณสมบัติเช่นการค้นหาที่ใช้งานอยู่, การโหลดขี้เกียจ, เหตุการณ์เซิร์ฟเวอร์-เซิร์ฟเวอร์, ทริกเกอร์ HTMX ฝั่งเซิร์ฟเวอร์ที่กำหนดเอง, กล่องโต้ตอบและการรวม Daisyui การพึ่งพาเพียงอย่างเดียวของแพ็คเกจนี้คือ fastapi
ใช้ ruff สำหรับการผ้าสำลีและการจัดรูปแบบ mypy สำหรับการวิเคราะห์รหัสแบบคงที่และ pytest สำหรับการทดสอบ
เอกสารนี้สร้างขึ้นด้วย mkdocs-material และ mkdocstrings
อย่าลังเลที่จะถามคำถามหรือขอคุณสมบัติใหม่
และแน่นอนว่าการมีส่วนร่วมทั้งหมดยินดีต้อนรับรวมถึงเอกสารเพิ่มเติมตัวอย่างรหัสและการทดสอบ
เป้าหมายคือการทำให้ fasthx เป็นโครงการที่รอบด้านซึ่งทำให้แม้กระทั่งกรณีการใช้ HTMX ที่ซับซ้อนที่สุดของคุณใช้งานง่าย
แพ็คเกจเปิดโล่งภายใต้เงื่อนไขของใบอนุญาต MIT
ขอบคุณ Smart-Now สำหรับการสนับสนุนโครงการ
![]()