Skip to main content

Add more bracket angles to Django templates </>

Project description

dj-angles </>

Add more bracket angles to Django templates

https://dj-angles.adamghill.com/

PyPI PyPI - Downloads GitHub Sponsors

📖 Documentation located at https://dj-angles.adamghill.com/. 📦 Package located at https://pypi.org/project/dj-angles/.

⭐ Features

  • Use HTML-like elements in Django templates, e.g. <dj-partial /> instead of {% include 'partial.html' %}
  • Can be sprinkled in as needed, but does not remove existing Django functionality
  • Pretend like you are writing React components, but without dealing with JavaScript at all
  • Lets you excitedly tell your friends how neat the Shadow DOM is
  • Since it looks like HTML, syntax highlighting mostly "just works"
  • Wraps included templates in a custom element for easier debugging and targeted CSS styling

💥 Example

base.html

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

index.html

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

<dj-block 'content'>  <!-- {% block 'content' %} -->
  <dj-include '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-#>this is another comment</dj-#>    <!-- {# this is another comment #} -->

  <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 'img/django.jpg' />  <!-- <img src="{% static 'img/django.jpg' %}" /> -->
  <dj-css 'css/styles.css' />  <!-- <link href="{% static 'css/styles.css' %}" rel="stylesheet" /> -->
</dj-block '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 that 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.6.1.tar.gz (23.9 kB view details)

Uploaded Source

Built Distribution

dj_angles-0.6.1-py3-none-any.whl (11.6 kB view details)

Uploaded Python 3

File details

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

File metadata

  • Download URL: dj_angles-0.6.1.tar.gz
  • Upload date:
  • Size: 23.9 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.6.1.tar.gz
Algorithm Hash digest
SHA256 8d98e2f767ca94ea8f03d6ff20f70633f6552ec7c9df4254d99ed58a20db2564
MD5 a71aa33743d3d9c654a5b95c3eca73d2
BLAKE2b-256 35af5b6d69a760712232420f9a23df03e674d8d0fa6182e6a59209ec54dfdaa8

See more details on using hashes here.

File details

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

File metadata

  • Download URL: dj_angles-0.6.1-py3-none-any.whl
  • Upload date:
  • Size: 11.6 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.6.1-py3-none-any.whl
Algorithm Hash digest
SHA256 49f45e2d1b84220328b6b4bddcab98d3605ea6a8b039bcbab71a9016889c1210
MD5 35695abd96283501e3902b82399882d7
BLAKE2b-256 26c680a0d5c37c94f52d7029afb9ec7787299cfe07a7ee06a0de749db8c5bf12

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