dj-angles 0.26.0

Add more bracket angles to Django templates </>

dj-angles </>

• 📖 Complete documentation: https://dj-angles.adamghill.com/
• 📦 Package: https://pypi.org/project/dj-angles/

⭐ 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 components in a custom HTML element for easier debugging and targeted CSS styling
• Support for the Shadow DOM to encapsulate component styles
• Lightweight way to submit forms via AJAX and swap in the resulting HTML
• Error boundaries to catch and display template errors

Component library integrations

• Support for Django 6.0 template partials
• django-components
• django-viewcomponent
• django-bird
• django-template-partials

Template tags

• call: call functions in a template
• model: call a model in a template
• view: render a view in a template

Filters

• dateformat: use Python strftime format for formatting dates as a string

💥 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 %} -->
<dj-view name='some-view' />  <!-- {% view 'some-view' %} -->

<!-- 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 %} -->

<!-- error-boundaries.html -->
<dj-block name='content' error-boundary>
  <dj-include template='missing-template.html' />
</dj-block>

<dj-error-boundary>
  <dj-include template='missing-template.html' />
</dj-error-boundary>

<!-- 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

• Web Components
• django-cotton by wrabit

🙌 Contributors

Emmanuelle Delescolle 💻 ⚠️ 📖

Jarkko Saltiola 📖