andros/fastapi-with-liveview
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fist commit

Browse Source
This commit is contained in:
Andros Fenollosa 2024-06-18 14:50:41 +02:00
commit 6a9fc0a72a
10 changed files with 159 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
Dockerfile Normal file
View File

@ -0,0 +1,7 @@
FROM base
COPY ./requirements.txt .
RUN pip3 install -r requirements.txt
# launcher
CMD fastapi dev main.py --host 0.0.0.0

19
about_us.py Normal file
View File

@ -0,0 +1,19 @@
from datetime import datetime
async def send_page(websocket, templates, data_frontend):
await websocket.send_json(
{
'selector': '#main',
'html': templates.get_template(
f'pages/about_us.html'
).render(),
}
)
async def current_time(websocket, templates, data_frontend):
await websocket.send_json(
{
'selector': '#time',
'html': f"<datetime>{datetime.now()}</datetime>",
}
)

7
compose.yaml Normal file
View File

@ -0,0 +1,7 @@
services:
fastapi:
build: .
ports:
- "8000:8000"
volumes:
- .:/usr/src/app

10
home.py Normal file
View File

@ -0,0 +1,10 @@
async def send_page(websocket, templates, data_frontend):
await websocket.send_json(
{
'selector': '#main',
'html': templates.get_template(
f'pages/home.html'
).render(),
}
)

45
main.py Normal file
View File

@ -0,0 +1,45 @@
import os
import pathlib
from fastapi import FastAPI, Request, WebSocket
from fastapi.staticfiles import StaticFiles
from fastapi.templating import Jinja2Templates
import home
import about_us
app = FastAPI()
app.mount('/static', StaticFiles(directory='static'), name='static')
BASE_DIR = pathlib.Path(__file__).parent
templates = Jinja2Templates(
directory=[
BASE_DIR / 'templates',
]
)
@app.get('/')
async def welcome_page(request: Request):
context = {
'request': request,
}
return templates.TemplateResponse(
'layouts/base.html', context,
)
@app.websocket('/ws/liveview/')
async def websocket_endpoint(websocket: WebSocket):
await websocket.accept()
while True:
data_frontend = await websocket.receive_json()
if data_frontend and 'action' in data_frontend:
action_data = data_frontend['action'].split('->')
if len(action_data) == 2:
action = action_data[0].lower()
function = action_data[1].lower()
await eval(
f'{action}.{function}(websocket, templates, data_frontend)'
)

12
requirements.txt Normal file
View File

@ -0,0 +1,12 @@
fastapi
ruff
fastapi-cli
email_validator
pydantic-settings
pydantic-extra-types
httpx
jinja2
python-multipart
uvicorn
orjson
ujson

0
static/.gitkeep Normal file
View File

42
templates/layouts/base.html Normal file
View File

@ -0,0 +1,42 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example</title>
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, shrink-to-fit=no"
>
<!-- Django LiveView FrontEnd -->
<!-- https://django-liveview.andros.dev/docs/ -->
<script defer type="module" src="https://cdn.jsdelivr.net/gh/Django-LiveView/frontend/js/main.js"></script>
</head>
<body
data-controller="page"
>
<header>
<h1>FastAPI with LiveView</h1>
<nav>
<ul>
<li>
<a
href="#"
data-action="click->page#changePage"
data-page="home"
role="button"
>Home</a>
</li>
<li>
<a
href="#"
data-action="click->page#changePage"
data-page="about_us"
role="button"
>About Us</a>
</ul>
</nav>
</header>
<main id="main"></main>
<footer></footer>
</body>
</html>

11
templates/pages/about_us.html Normal file
View File

@ -0,0 +1,11 @@
<section>
<h1>About us</h1>
<p>
<button
data-action="click->page#run"
data-liveview-action="about_us"
data-liveview-function="current_time"
>Get time</button>
</p>
<p id="time"></p>
</section>

6
templates/pages/home.html Normal file
View File

@ -0,0 +1,6 @@
<section>
<h1>Home</h1>
<p>
In dictum non, consectetur a erat nam at lectus urna duis convallis convallis? Duis tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula ipsum a arcu cursus vitae congue mauris rhoncus aenean vel elit? Aliquet sagittis id consectetur purus. Pellentesque adipiscing commodo elit, at imperdiet dui accumsan sit. Praesent elementum facilisis leo, vel fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis enim lobortis scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis eu volutpat! Dui, id ornare arcu odio ut sem nulla pharetra diam sit amet nisl suscipit adipiscing bibendum est ultricies integer quis! Et leo duis ut diam quam nulla porttitor massa id neque! Morbi non arcu risus, quis varius quam quisque id diam vel quam elementum pulvinar etiam! Id faucibus nisl tincidunt eget nullam non nisi est, sit amet facilisis magna etiam tempor, orci eu lobortis elementum, nibh tellus molestie nunc, non blandit massa enim nec dui nunc! Cras ornare arcu dui vivamus arcu felis, bibendum ut tristique et, egestas quis ipsum suspendisse ultrices gravida dictum fusce ut placerat orci nulla pellentesque dignissim! Commodo viverra maecenas accumsan, lacus vel facilisis volutpat, est velit egestas dui, id ornare arcu odio ut sem nulla pharetra diam.
</p>
</section>