Python native HTML templates
- Native to python
- More code modularity
- Easy to write reusable components
- Out of the box editor support
- Syntax highlighting
- Code navvigation tools
- Auto-completion
- Type safety using MyPy
pip3 install ph7
Write your first block of markup
from ph7.html import body, div, html
template = html(
body(
div(
"Hello, World!",
)
)
)
print(template)<html>
<body>
<div>Hello, World!</div>
</body>
</html>Or write a CSS class
from ph7.css import CSSObject
class flex_center(CSSObject):
"""Flex center"""
display = "flex"
align_items = "center"
justify_content = "center"
print(flex_center()).flex-center {
display: flex;
align-items: center;
justify-content: center;
}Or use python function as JavaScript function
from ph7.js import as_js, console, document, fetch
async def fetchDog():
response = await fetch(
"https://dog.ceo/api/breeds/image/random",
{"method": "GET"},
)
if response.status != 200:
response_body = await response.text()
console.log(f"Error fetching dog; {response_body}")
return
data = await response.json()
document.getElementById("image").src = data.message
print(as_js(fetchDog))async function fetchDog() {
let response = await fetch('https://dog.ceo/api/breeds/image/random', {
'method': 'GET'
});
if (response.status != 200) {
let response_body = await response.text();
console.log('Error fetching dog; ' + response_body);
return;
};
let data = await response.json();
document.getElementById('image').src = data.message;
};PH7 is still in beta-development. It will be production ready with following enhancements
- Remove performance bottlenecks
- Unit testing support
Further improvements
- Typed context for type safety
Links: