Skip to main content

Add more bracket angles to Django templates </>

Project description

dj-angles </>

PyPI PyPI - Downloads GitHub Sponsors All Contributors

⭐ Features

  • Use HTML-like elements in Django templates, e.g. <dj-some-partial /> instead of {% include 'some-partial.html' %}
  • Can be sprinkled in as needed to enhance existing Django functionality
  • Since it looks like HTML, syntax highlighting mostly "just works"
  • Wraps included templates in a custom element for easier debugging and targeted CSS styling
  • Support for making components with Shadow DOM
  • Integrates with Django libraries like django-bird and django-template-partials
  • call and model to call functions directly from a template instead of creating custom template tags
  • dateformat filter to use Python strftime formats instead of PHP for formatting dates
  • Submit forms via AJAX and swap in the resulting HTML

💥 Examples

<!-- base.html -->
<dj-block name='content'>  <!-- {% block content %} -->
</dj-block>  <!-- {% endblock content %} -->
<!-- template-tags.html -->
<dj-extends parent='base.html' />  <!-- {% extends 'base.html' %} -->

<dj-block name='content'>  <!-- {% block content %} -->
  <!-- components -->
  <dj-some-partial />  <!-- {% include 'test-partial.html' %} -->
  <dj-include template='test-partial.html' />  <!-- {% include 'test-partial.html' %} -->

  <dj-verbatim>  <!-- {% verbatim %} -->
    This is verbatim: {% include %}
  </dj-verbatim>  <!-- {% endverbatim %} -->

  <dj-comment>  <!-- {% comment %} -->
    this is a comment
  </dj-comment>  <!-- {% endcomment %} -->

  <dj-autoescape-on>  <!-- {% autoescape-on %} -->
    This is escaped
  </dj-autoescape-on>  <!-- {% endautoescape %} -->

  <dj-autoescape-off>  <!-- {% autoescape off %} -->
    This is not escaped
  </dj-autoescape-off>  <!-- {% endautoescape %} -->

  <dj-csrf />  <!-- {% csrf_token %} -->

  <dj-debug />  <!-- {% debug %} -->
</dj-block>  <!-- {% endblock content %} -->
<!-- static-helpers.html -->
<dj-image src='img/django.jpg' />  <!-- <img src="{% static 'img/django.jpg' %}" /> -->
<dj-css href='css/styles.css' />  <!-- <link href="{% static 'css/styles.css' %}" rel="stylesheet" /> -->
<!-- call-code-from-template.html -->
<dj-call code='slugify("Hello Goodbye")' as='variable_name' />  <!-- {% call slugify("Hello Goodbye") as variable_name %} -->
<dj-model code='Book.objects.filter(id=1)' as='book' />  <!-- {% model Book.objects.filter(id=1) as book %} -->
<!-- inline-expressions.html -->
{{ request.user.username or request.user.email }}  <!-- {% if request.user.username %}{{ request.user.username }}{% else %}{{ request.user.email }}{% endif %} -->
{{ request.user.username if request.user.is_authenticated else 'Unknown' }}  <!-- {% if request.user.is_authenticated %}{{ request.user.username }}{% else %}Unknown{% endif %} -->
<!-- ajax-form-submission.html -->
<dj-form action='/submit' method='POST' swap='outerHTML' ajax csrf> <!-- <ajax-form><form action='/submit' method='POST'>{% csrf_token %} -->
  <button type='submit'>Submit</button>
</dj-form><!-- </form></ajax-form> -->
<!-- conditional-attributes.html -->
<div dj-if="True">  <!-- {% if True %}<div> -->
  If
</div>
<div dj-elif="False">  <!-- {% elif False %}<div> -->
  Elif
</div>
<div dj-else>  <!-- {% else %}<div> -->
  Else
</div>  <!-- </div>{% endif %} -->

📖 Documentation

To learn how to install and use dj-angles see the complete documentation at https://dj-angles.adamghill.com/.

🧩 Django Component Libraries

There are a growing number of component libraries for Django. A non-complete list:

  • Slippers: Build reusable components in Django without writing a single line of Python.
  • django-components: Create simple reusable template components in Django.
  • django-template-partials: Reusable named inline partials for the Django Template Language.
  • django-bird: High-flying components for perfectionists with deadlines.
  • django-cotton: Enabling Modern UI Composition in Django.
  • django-viewcomponent: Build reusable components in Django, inspired by Rails ViewComponent.
  • django-unicorn: The magical reactive component framework for Django ✨.

✨ Inspiration

🙌 Contributors

Emmanuelle Delescolle
Emmanuelle Delescolle

💻 ⚠️ 📖

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

dj_angles-0.24.0.tar.gz (28.6 kB view details)

Uploaded Source

Built Distribution

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

dj_angles-0.24.0-py3-none-any.whl (41.6 kB view details)

Uploaded Python 3

File details

Details for the file dj_angles-0.24.0.tar.gz.

File metadata

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

File hashes

Hashes for dj_angles-0.24.0.tar.gz
Algorithm Hash digest
SHA256 d96c2ddbf4a2f4cc134d6ec6b2bc708faf2e11b50671bcef80f36ee8059d0273
MD5 039b9da68eebc076e0d0006efec03024
BLAKE2b-256 ab574b2f25da2befaf1151dfe7dd120c81be18d4906d4ed9c1399c1641d50944

See more details on using hashes here.

Provenance

The following attestation bundles were made for dj_angles-0.24.0.tar.gz:

Publisher: publish.yml on adamghill/dj-angles

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

File details

Details for the file dj_angles-0.24.0-py3-none-any.whl.

File metadata

  • Download URL: dj_angles-0.24.0-py3-none-any.whl
  • Upload date:
  • Size: 41.6 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/6.1.0 CPython/3.13.7

File hashes

Hashes for dj_angles-0.24.0-py3-none-any.whl
Algorithm Hash digest
SHA256 ccb28ee0ed6c651db560e35365fb02af4bd3f24387a8fbb7a057e121856da291
MD5 2278088980df3043f3603ef6e4437b84
BLAKE2b-256 fb11223cadba1c8b5ba373d1433e497cec74b76a6e9fa451f39203b01c283e6f

See more details on using hashes here.

Provenance

The following attestation bundles were made for dj_angles-0.24.0-py3-none-any.whl:

Publisher: publish.yml on adamghill/dj-angles

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