# Reactor, a LiveView library for Django Reactor enables you to do something similar to Phoenix framework LiveView using Django Channels. ![TODO MVC demo app](demo.gif) ## What's in the box? This is no replacement for VueJS or ReactJS, or any JavaScript but it will allow you use all the potential of Django to create interactive front-ends. This method has its drawbacks because if connection is lost to the server the components in the front-end go busted until connection is re-established. But also has some advantages, as everything is server side rendered the interface comes already with meaningful information in the first request response, you can use all the power of Django template and ORM directly in your component and update the interface in real-time by subscribing to events on the server. If connection is lost or a component crashes, the front-end will have enough information to rebuild their state in the last good known state and continue to operate with the connection is restored. ## Installation and setup Reactor requires Python >=3.9. Install reactor: ```bash pip install django-reactor ``` Reactor makes use of `django-channels`, by default this one uses an InMemory channel layer which is not capable of a real broadcasting, so you might wanna use the Redis one, take a look here: [Channel Layers](https://channels.readthedocs.io/en/latest/topics/channel_layers.html) Add `reactor` and `channels` to your `INSTALLED_APPS` before the Django applications so channels can override the `runserver` command. ```python INSTALLED_APPS = [ 'reactor', 'channels', ... ] ... ASGI_APPLICATION = 'project_name.asgi.application' ``` and modify your `project_name/asgi.py` file like: ```python import os os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'project_name.settings') import django django.setup() from channels.auth import AuthMiddlewareStack from channels.routing import ProtocolTypeRouter, URLRouter from django.core.asgi import get_asgi_application from reactor.urls import websocket_urlpatterns application = ProtocolTypeRouter({ 'http': get_asgi_application(), 'websocket': AuthMiddlewareStack(URLRouter(websocket_urlpatterns)) }) ``` Note: Reactor since version 2, autoloads any `live.py` file in your applications with the hope to find there Reactor Components so they get registered and can be instantiated. In the templates where you want to use reactive components you have to load the reactor static files. So do something like this so the right JavaScript gets loaded: ```html {% load reactor %} ... {% reactor_header %} ... ``` Don't worry if you put this as early as possible, the scripts are loaded using `