Control the web with Python
Project description
Django IDOM ·
django-idom
allows Django to integrate with IDOM, a reactive Python web framework for building interactive websites without needing a single line of Javascript.
You can try IDOM now in a Jupyter Notebook:
Quick Example
example_app/components.py
This is where you'll define your IDOM components. Ultimately though, you should
feel free to organize your component modules as you wish. Any components created will ultimately be referenced
by Python dotted path in your-template.html
.
from idom import component, html
from django_idom import IdomWebsocket
# Components are CamelCase by ReactJS convention
@component
def Hello(websocket: IdomWebsocket, greeting_recipient: str):
return html.h1(f"Hello {greeting_recipient}!")
example_app/templates/your-template.html
In your templates, you may add IDOM components into your HTML by using the idom_component
template tag. This tag requires the dotted path to the component function.
Additonally, you can pass in keyworded arguments into your component function.
In context this will look a bit like the following...
{% load idom %}
<!DOCTYPE html>
<html>
<head>
<title>Example Project</title>
</head>
<body>
{% idom_component "my_django_project.example_app.components.Hello" greeting_recipient="World" %}
</body>
</html>
Installation
Install django-idom
via pip.
pip install django-idom
You'll also need to modify a few files in your Django project.
settings.py
In your settings you'll need to add channels
and django_idom
to INSTALLED_APPS
.
INSTALLED_APPS = [
...,
"channels",
"django_idom",
]
# Ensure ASGI_APPLICATION is set properly based on your project name!
ASGI_APPLICATION = "my_django_project.asgi.application"
Optional: You can also configure IDOM settings.
# If "idom" cache is not configured, then we'll use "default" instead
CACHES = {
"idom": {"BACKEND": ...},
}
# Maximum seconds between two reconnection attempts that would cause the client give up.
# 0 will disable reconnection.
IDOM_WS_MAX_RECONNECT_TIMEOUT: int = 604800
# The URL for IDOM to serve websockets
IDOM_WEBSOCKET_URL: str = "idom/"
urls.py
Add IDOM HTTP paths to your urlpatterns
.
from django.urls import include, path
urlpatterns = [
path("idom/", include("django_idom.http.urls")),
...
]
asgi.py
Register IDOM's websocket using IDOM_WEBSOCKET_PATH
.
Note: If you do not have an asgi.py
, follow the channels
installation guide.
import os
from django.core.asgi import get_asgi_application
# Ensure DJANGO_SETTINGS_MODULE is set properly based on your project name!
os.environ.setdefault("DJANGO_SETTINGS_MODULE", "my_django_project.settings")
django_asgi_app = get_asgi_application()
from channels.auth import AuthMiddlewareStack
from channels.routing import ProtocolTypeRouter, URLRouter
from channels.sessions import SessionMiddlewareStack
from django_idom import IDOM_WEBSOCKET_PATH
application = ProtocolTypeRouter(
{
"http": django_asgi_app,
"websocket": SessionMiddlewareStack(
AuthMiddlewareStack(URLRouter([IDOM_WEBSOCKET_PATH]))
),
}
)
Developer Guide
If you plan to make code changes to this repository, you'll need to install the following dependencies first:
- NPM for installing and managing Javascript
- ChromeDriver for testing with Selenium
Once done, you should clone this repository:
git clone https://github.com/idom-team/django-idom.git
cd django-idom
Then, by running the command below you can:
-
Install an editable version of the Python code
-
Download, build, and install Javascript dependencies
pip install -e . -r requirements.txt
Finally, to verify that everything is working properly, you'll want to run the test suite.
Running The Tests
This repo uses Nox to run scripts which can
be found in noxfile.py
. For a full test of available scripts run nox -l
. To run the full test suite simple execute:
nox -s test
To run the tests using a headless browser:
nox -s test -- --headless
Project details
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
File details
Details for the file django_idom-0.0.5.tar.gz
.
File metadata
- Download URL: django_idom-0.0.5.tar.gz
- Upload date:
- Size: 261.3 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/4.0.0 CPython/3.10.4
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | 24090751ea780bace787d75b271b2499f9d375de4ba029b94b6a6c3a580e97b8 |
|
MD5 | 6280901f3c8758bf35aa019ed2229b47 |
|
BLAKE2b-256 | 69a768720e19435ec7a82261be0dfcb35c77a441f490a8540c27cd681257b0db |
File details
Details for the file django_idom-0.0.5-py2.py3-none-any.whl
.
File metadata
- Download URL: django_idom-0.0.5-py2.py3-none-any.whl
- Upload date:
- Size: 266.0 kB
- Tags: Python 2, Python 3
- Uploaded using Trusted Publishing? No
- Uploaded via: twine/4.0.0 CPython/3.10.4
File hashes
Algorithm | Hash digest | |
---|---|---|
SHA256 | 275be1b225153a2ee9415a218bf00476f18a165baf6e986782e6e2d2136d57b9 |
|
MD5 | c205ce2b7fa4a6b7e6dcba6824d9d3d0 |
|
BLAKE2b-256 | 51a6e95836aa4b2a755c538521741697cd33cf8bc35352aa04cbf42226a01dc5 |