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

Transpile HTML to the Django Template Language </>
https://github.com/adamghill/dj-angles

css django django-templates html web-components

Last synced: about 1 hour ago
JSON representation

Transpile HTML to the Django Template Language </>

• Host: GitHub
• URL: https://github.com/adamghill/dj-angles
• Owner: adamghill
• License: mit
• Created: 2024-09-01T20:25:48.000Z (6 months ago)
• Default Branch: main
• Last Pushed: 2025-02-14T00:33:10.000Z (5 days ago)
• Last Synced: 2025-02-16T03:08:53.135Z (3 days ago)
• Topics: css, django, django-templates, html, web-components
• Language: Python
• Homepage: https://dj-angles.adamghill.com
• Size: 243 KB
• Stars: 31
• Watchers: 2
• Forks: 2
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

README

        


  
dj-angles </>


![PyPI](https://img.shields.io/pypi/v/dj-angles?color=blue&style=flat-square)

![PyPI - Downloads](https://img.shields.io/pypi/dm/dj-angles?color=blue&style=flat-square)

![GitHub Sponsors](https://img.shields.io/github/sponsors/adamghill?color=blue&style=flat-square)

[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors-)

- 📖 Complete documentation: https://dj-angles.adamghill.com/

- 📦 Package: https://pypi.org/project/dj-angles/

## ⭐ Features

- Use HTML-like elements in Django templates, e.g. `` instead of `{% include '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 the [Shadow DOM](https://dj-angles.adamghill.com/components/#CSS-scoping)

- Integrates with Django component libraries like [django-bird](https://django-bird.readthedocs.io)

## 💥 Example

**base.html**

```html

  

  

```

**index.html**

```html

  

  

    

  
  

    If

  

  
  

    Elif

  

  
  

    Else

  
  


    

    This is verbatim: {% include %}

    

    

    this is a comment

    

    

    This is escaped

    

    

    This is not escaped

    

    

  

    

    

    

  

```

**partial.html**

```html



  This is a partial: {{ now|date:"c" }}



```


## 📖 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](https://mitchel.me/slippers/): Build reusable components in Django without writing a single line of Python.

- [django-components](https://django-components.github.io/django-components/): Create simple reusable template components in Django.

- [django-template-partials](https://github.com/carltongibson/django-template-partials): Reusable named inline partials for the Django Template Language.

- [django-bird](https://django-bird.readthedocs.io): High-flying components for perfectionists with deadlines.

- [django-cotton](https://django-cotton.com): Enabling Modern UI Composition in Django.

- [django-viewcomponent](https://github.com/rails-inspire-django/django-viewcomponent): Build reusable components in Django, inspired by Rails ViewComponent.

- [django-unicorn](https://www.django-unicorn.com): The magical reactive component framework for Django ✨.

## ✨ Inspiration

- [Web Components](https://web.dev/learn/html/template)

- [django-cotton](https://django-cotton.com) by [wrabit](https://github.com/wrabit)

## 🙌 Contributors

  

    

      
Emmanuelle Delescolle
💻 ⚠️ 📖