https://github.com/bbelderbos/htmx-demo

https://github.com/bbelderbos/htmx-demo

Last synced: 1 day ago
JSON representation

• Host: GitHub
• URL: https://github.com/bbelderbos/htmx-demo
• Owner: bbelderbos
• Created: 2023-07-18T16:17:11.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2024-01-11T16:57:18.000Z (9 months ago)
• Last Synced: 2024-01-12T02:10:36.340Z (9 months ago)
• Language: Python
• Size: 39.1 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Htmx demo: adding nice UI behaviors to a simple Django movie app.

This repo is for a 2-part [PDM](https://pybit.es/catalogue/the-pdm-program/) Code Clinic I gave implementing various htmx effects.

## Get it running 💪

```

$ git clone [email protected]:bbelderbos/htmx-demo.git

$ cd htmx-demo

$ python3 -m venv venv

$ source venv/bin/activate

(venv) $ pip install -r requirements.txt

# create sqlite DB and run Django migrations

(venv) $ python manage.py migrate

...

  Applying sessions.0001_initial... OK

(venv) $ python manage.py import_movies data/movie_data.csv

...

978 movies imported

(venv) $ python manage.py runserver

```

Browse to http://locahost:8000 - enjoy 😎

Here is a quick animation of the htmx examples we implemented:

Doc links (in order of demo animation):

- [Infinite scroll](https://htmx.org/examples/infinite-scroll/)

- [Click to edit](https://htmx.org/examples/click-to-edit/)

- [Delete Row](https://htmx.org/examples/delete-row/)

- [Active Search](https://htmx.org/examples/active-search/)

Related htmx Pybites YouTube videos:

- [How to make an infinite scroll of YouTube videos using FastAPI, SQLModel and htmx](https://www.youtube.com/watch?v=5uOCUkJU-4Q)

- [Plotting database tables using SQLAlchemy automap, Flask, htmx and Chart.js](https://www.youtube.com/watch?v=EbKeZkobGbA) (here I implemented [Cascading Selects](https://htmx.org/examples/value-select/))

For more ideas [open an issue](https://github.com/bbelderbos/htmx-demo/issues) and feel free to contribute [opening a pull request](https://github.com/bbelderbos/htmx-demo/pulls) 🙏

- [Bob](https://github.com/bbelderbos).