Django HTMX Components

This is a collection of components for Django and htmx. They are meant to be copy-pasted into your project and customized to your needs.

They're designed to be as simple as possible, so you can easily understand how they work and modify them to your needs. They have very little styling, for the same reason.

Installation

1. Install Django and htmx.
2. Install and set up django-compoenents
3. Create a urls.py file in components/ and add the following code:

       from django.urls import path
       urlpatterns = []

   Then import this file in your project's urls.py file:

       from django.urls import path, include
       urlpatterns = [
           path('components/', include('components.urls')),
       ]

   This step simplifies adding URL patterns for your components and keeps them separate from your project's URL patterns. Then, adding a single-file component to your components/urls.py file is as easy as:

       from django.urls import path
       from components.mycomponent import MyComponent
       urlpatterns = [
           path('mycomponent/', MyComponent.as_view()),
       ]

   It will handle requests to /components/mycomponent/ and render the component.
4. Copy-paste the components you want to use into your components/ folder. Add them to your components/urls.py file as described above.

Contributing

Contributions are welcome! Please open an issue or pull request if you have a component you'd like to add or a bug to report.

Local development

1. Clone this repository.
2. Create a virtual environment and install the dependencies:

   poetry install
   npm install

3. Run the Tailwind CSS build:

   make tailwind

4. Start redis:

   make redis

5. Run the development server:

   make run

6. Open http://localhost:8000/ in your browser.
7. Make your changes and test them in your browser.
8. Commit your changes and open a pull request.

License

This project is licensed under the MIT License. See LICENSE for details.