arel

KO | EN

gitlite — search

#javascript #python #ai #typescript #go #android #machine-learning #deep-learning #docker #windows #vue #awesome-list #openai #open-source

(★ 167)

Lightweight browser hot reload for Python ASGI web apps

File Explorer

Download Latest Version (.zip)

- azure-pipelines.yml
- demo.gif
- - page1.md
  - page2.md
  - page3.md
  - README.md
- - __init__.py
  - app.py
  - content.py
  - events.py
  - resources.py
  - routes.py
  - settings.py
- __init__.py
- README.md
- - __init__.py
  - _app.py
  - _models.py
  - _notify.py
  - _types.py
  - _watch.py
  - py.typed
- __init__.py
- common.py
- conftest.py
- test_example.py
- utils.py
.gitattributes
.gitignore
CHANGELOG.md
LICENSE
Makefile
MANIFEST.in
pyproject.toml
README.md
requirements.txt
setup.cfg
setup.py

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# arel

[![Build Status](https://dev.azure.com/florimondmanca/public/_apis/build/status/florimondmanca.arel?branchName=master)](https://dev.azure.com/florimondmanca/public/_build/latest?definitionId=6&branchName=master)
[![Coverage](https://codecov.io/gh/florimondmanca/arel/branch/master/graph/badge.svg)](https://codecov.io/gh/florimondmanca/arel)
![Python versions](https://img.shields.io/pypi/pyversions/arel.svg)
[![Package version](https://badge.fury.io/py/arel.svg)](https://pypi.org/project/arel)

Browser hot reload for Python ASGI web apps.

![](https://media.githubusercontent.com/media/florimondmanca/arel/master/docs/demo.gif)

## Overview

**What is this for?**

`arel` can be used to implement development-only hot-reload for non-Python files that are not read from disk on each request. This may include HTML templates, GraphQL schemas, cached rendered Markdown content, etc.

**How does it work?**

`arel` watches changes over a set of files. When a file changes, `arel` notifies the browser (using WebSocket), and an injected client script triggers a page reload. You can register your own reload hooks for any extra server-side operations, such as reloading cached content or re-initializing other server-side resources.

## Installation

```bash
pip install 'arel==0.4.*'
```

## Quickstart

_For a working example using Starlette, see the [Example](#example) section._

Although the exact instructions to set up hot reload with `arel` depend on the specifics of your ASGI framework, there are three general steps to follow:

1. Create an `HotReload` instance, passing one or more directories of files to watch, and optionally a list of callbacks to call before a reload is triggered:

```python
   import arel

async def reload_data():
       print("Reloading server data...")

hotreload = arel.HotReload(
       paths=[
           arel.Path("./server/data", on_reload=[reload_data]),
           arel.Path("./server/static"),
       ],
   )
   ```

2. Mount the hot reload endpoint, and wire its startup and shutdown into the application's lifespan. If using Starlette, this can be done like this:

```python
   from contextlib import asynccontextmanager

from starlette.applications import Starlette
   from starlette.routing import WebSocketRoute

@asynccontextmanager
   async def lifespan(app):
       await hotreload.startup()
       try:
           yield
       finally:
           await hotreload.shutdown()

app = Starlette(
       routes=[WebSocketRoute("/hot-reload", hotreload, name="hot-reload")],
       lifespan=lifespan,
   )
   ```

3. Add the JavaScript code to your website HTML. If using [Starlette with Jinja templates](https://www.starlette.io/templates/), you can do this by updating the global environment, then injecting the script into your base template:

```python
   templates.env.globals["DEBUG"] = os.getenv("DEBUG")  # Development flag.
   templates.env.globals["hotreload"] = hotreload
   ```

```jinja
   <body>

{% if DEBUG %}
       {{ hotreload.script(url_for('hot-reload')) | safe }}
     {% endif %}
   </body>
   ```

## Example

The [`example` directory](https://github.com/florimondmanca/arel/tree/master/example) contains an example Markdown-powered website that uses `arel` to refresh the browser when Markdown content or HTML templates change.

## License

MIT

arel

File Explorer

Today's picks

Was this content helpful?

Recent Feedback

arel

File Explorer

Today's picks

Was this content helpful?

Recent Feedback

Download README