Skip to main content

Add more bracket angles to Django templates </>

Project description

dj-angles </>

Add more bracket angles to Django templates

PyPI PyPI - Downloads GitHub Sponsors

⭐ Features

  • Use HTML-like elements in Django templates, e.g. <dj-partial /> instead of {% include 'partial.html' %}
  • Can be sprinkled in as needed and only enhances 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
  • Lets you excitedly tell your friends how neat the Shadow DOM is
  • Pretend like you are writing React components, but without dealing with JavaScript at all

💥 Example

base.html

<dj-block name='content'>
</dj-block name='content'>

index.html

<dj-extends parent='base.html' />  <!-- {% extends 'base.html' %} -->

<dj-block name='content'>  <!-- {% block content %} -->
  <dj-include template='partial.html' />  <!-- {% include '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-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" /> -->
</dj-block name='content'>  <!-- {% endblock content %} -->

partial.html

<div>
  This is a partial: {{ now|date:"c" }}
</div>

📖 Documentation

To learn more about how to install and use dj-angles go to https://dj-angles.adamghill.com/.

✨ Inspiration

I have been interested in Django components and encapsulating functionality for a long time (see django-unicorn, dlitejs, etc), but had never thought of using HTML directly until I looked at Cotton by wrabit. dj-angles takes the initial idea further to see how well it works.

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.8.0.tar.gz (25.4 kB view details)

Uploaded Source

Built Distribution

dj_angles-0.8.0-py3-none-any.whl (13.4 kB view details)

Uploaded Python 3

File details

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

File metadata

  • Download URL: dj_angles-0.8.0.tar.gz
  • Upload date:
  • Size: 25.4 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/5.1.1 CPython/3.9.7

File hashes

Hashes for dj_angles-0.8.0.tar.gz
Algorithm Hash digest
SHA256 f0753dfa096ebbcf29ad591cf4fc82f8896076df21f828fbb0254640c8e3a0a2
MD5 5296cfdd40a0b62e9eb589886a2c23e3
BLAKE2b-256 bec476708951eddfa8350d92fe2672ea2926f64ca1f942964bc1bcb36c59ff2e

See more details on using hashes here.

File details

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

File metadata

  • Download URL: dj_angles-0.8.0-py3-none-any.whl
  • Upload date:
  • Size: 13.4 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/5.1.1 CPython/3.9.7

File hashes

Hashes for dj_angles-0.8.0-py3-none-any.whl
Algorithm Hash digest
SHA256 855f8d815f635033cc76e91ea6bfee6e0a893ec8c0e6be2245d29b0996e4107b
MD5 eb66d0780d4bd5c4a4fd8bbb5da51428
BLAKE2b-256 881bffca36054a6ec36cf6b0958a240d7fbdc0c7fb848dcd8a3b34510e470ad2

See more details on using hashes here.

Supported by

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