Skip to main content

A magical full-stack framework for Django.

Project description

django-unicorn logo

Unicorn

The magical reactive component framework for Django ✨

PyPI PyPI - Downloads coverage GitHub Sponsors All Contributors

Unicorn adds modern reactive component functionality to your Django templates without having to learn a new templating language or fight with complicated JavaScript frameworks. It seamlessly extends Django past its server-side framework roots without giving up all of its niceties or forcing you to rebuild your application. With Django Unicorn, you can quickly and easily add rich front-end interactions to your templates, all while using the power of Django.

https://www.django-unicorn.com has extensive documentation, code examples, and more!

⚡ Getting started

1. Install the package

Use your favorite package manager to install Unicorn:

  • uv add django-unicorn
  • pip install django-unicorn
  • poetry add django-unicorn

2. Add django_unicorn to INSTALLED_APPS

# settings.py
INSTALLED_APPS = (
    # other apps
    "django_unicorn",
)

3. Update urls.py

# urls.py
import django_unicorn

urlpatterns = (
    # other urls
    path("unicorn/", include("django_unicorn.urls")),
)

4. Add Unicorn to the HTML template

<!-- template.html -->
{% load unicorn %}

<html>
  <head>
    {% unicorn_scripts %}
  </head>
  <body>
    {% csrf_token %}
  </body>
</html>

5. Create a component

python manage.py startunicorn myapp COMPONENT_NAME

Unicorn uses the term "component" to refer to a set of interactive functionality that can be put into templates. A component consists of a Django HTML template and a Python view class which contains the backend code. After running the management command, two new files will be created:

  • myapp/templates/unicorn/COMPONENT_NAME.html (component template)
  • myapp/components/COMPONENT_NAME.py (component view)

6. Add the component to your template

<!-- template.html -->
{% load unicorn %}

<html>
  <head>
    {% unicorn_scripts %}
  </head>
  <body>
    {% csrf_token %}

    {% unicorn 'COMPONENT_NAME' %}
  </body>
</html>

Example todo component

The unicorn: attributes bind the element to data and can also trigger methods by listening for events, e.g. click, input, keydown, etc.

<!-- todo.html -->

<div>
  <form unicorn:submit.prevent="add">
    <input type="text"
      unicorn:model.defer="task"
      unicorn:keyup.escape="task=''"
      placeholder="New task" id="task"></input>
  </form>
  <button unicorn:click="add">Add</button>
  <button unicorn:click="$reset">Clear all tasks</button>

  <p>
    {% if tasks %}
      <ul>
        {% for task in tasks %}
          <li>{{ task }}</li>
        {% endfor %}
      </ul>
    {% else %}
      No tasks 🎉
    {% endif %}
  </p>
</div>
# todo.py

from django_unicorn.components import UnicornView
from django import forms

class TodoForm(forms.Form):
    task = forms.CharField(min_length=2, max_length=20, required=True)

class TodoView(UnicornView):
    form_class = TodoForm

    task = ""
    tasks = []

    def add(self):
        if self.is_valid():
            self.tasks.append(self.task)
            self.task = ""

✨ Wait, is this magic?

Sort of! At least it might feel like it. 🤩

  1. Unicorn progressively enhances a normal Django view, so the initial render is fast and great for SEO.
  2. Unicorn binds to the elements you specify and automatically makes AJAX calls when needed.
  3. Unicorn seamlessly updates the DOM when the HTML changes.

Focus on building regular Django templates and Python classes without needing to switch to another language or use unnecessary infrastructure.

🤯 But wait, there's more!

As if that wasn't enough, other features include:

📖 Dig In

❤️ Support

This project is supported by GitHub Sponsors and Digital Ocean.

🔧 Contributors

Check out this guide for more details on how to contribute.

Thanks to the following wonderful people (emoji key) who have helped build Unicorn.

Adam Hill
Adam Hill

💻 ⚠️
Andres Vargas
Andres Vargas

💻
Eddy Ernesto del Valle Pino
Eddy Ernesto del Valle Pino

💻
Yaser Al-Najjar
Yaser Al-Najjar

💻
Stephan Traub
Stephan Traub

⚠️
Fredrik Borg
Fredrik Borg

💻 ⚠️
mbacicc
mbacicc

💻
Ron
Ron

📖
Franziskhan
Franziskhan

💻
Josh Higgins
Josh Higgins

⚠️ 💻
Amayas Messara
Amayas Messara

💻
Apoorva Pandey
Apoorva Pandey

⚠️ 💻
Christian González
Christian González

💻 📖
robwa
robwa

💻 ⚠️
Preston Badeer
Preston Badeer

📖
Sergei
Sergei

📖 💻 ⚠️
bazubii
bazubii

💻 ⚠️
Dan Caron
Dan Caron

📖
Shantanu
Shantanu

💻
regoawt
regoawt

💻 ⚠️
Lasse H. Bomholt
Lasse H. Bomholt

💻
Martey Dodoo
Martey Dodoo

📖
Pierre
Pierre

💻
Roman Imankulov
Roman Imankulov

⚠️ 💻
Lemi Boyce
Lemi Boyce

💻
Jack Sundberg
Jack Sundberg

💻
siliconcow
siliconcow

💻 ⚠️
Akintola Rahmat
Akintola Rahmat

💻
Mario Munoz
Mario Munoz

📖
Emily Wood
Emily Wood

💻
Jeremy Wright
Jeremy Wright

💻
Johanan Oppong Amoateng
Johanan Oppong Amoateng

💻

This project follows the all-contributors specification. Contributions of any kind welcome!

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

django_unicorn-0.67.0.tar.gz (508.7 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

django_unicorn-0.67.0-py3-none-any.whl (109.5 kB view details)

Uploaded Python 3

File details

Details for the file django_unicorn-0.67.0.tar.gz.

File metadata

  • Download URL: django_unicorn-0.67.0.tar.gz
  • Upload date:
  • Size: 508.7 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/6.1.0 CPython/3.13.7

File hashes

Hashes for django_unicorn-0.67.0.tar.gz
Algorithm Hash digest
SHA256 930dcf41d300614fbf9f198d2b985bbfd51fbdf125894c1813dcedd13dd5a918
MD5 085b7c548e375e50f62e85de6f9a2b61
BLAKE2b-256 8802c37dd08c64018b1e9e1b949691ea6f6123f06e6be2887595d1e058f6076a

See more details on using hashes here.

Provenance

The following attestation bundles were made for django_unicorn-0.67.0.tar.gz:

Publisher: publish.yml on django-commons/django-unicorn

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

File details

Details for the file django_unicorn-0.67.0-py3-none-any.whl.

File metadata

File hashes

Hashes for django_unicorn-0.67.0-py3-none-any.whl
Algorithm Hash digest
SHA256 7149b7dc7ae06d61c8f7d1931241f873cd18d92d21f82072931bd9d300fba2c1
MD5 0952df883f10eec73c9340cfd3405cfa
BLAKE2b-256 d12fda8189638907cd250fb6ffc5d1600a964a400c5784f2a0db8373eb48c4e5

See more details on using hashes here.

Provenance

The following attestation bundles were made for django_unicorn-0.67.0-py3-none-any.whl:

Publisher: publish.yml on django-commons/django-unicorn

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page