There are lots of guides and courses out there on HTMX and Alpine.js separately, but I didn't find many with the particulars of using them together for persistence of instant client-side interactions, so this is an example of such a thing. I've taken a bootstrap 5 theme from one of the marketplace sites, and made one thing in it data driven and supportive of instant user gratification, persisted to the database as user preferences in Django.
Consider the following:
It took me some time of digging through disparate docs and blog posts to piece together how to use
django-tables2, htmx, django-template-partials,
and django-filter, all at the same time in an optimal way for highly interactive data tables in django.
At present I am not using Alpine.js, another popular addition to this stack, due to my preference
for writing plain ole javascript instead of having to learn another syntax, but that's really
outside of this scope anyway, this is meant to be a how-to on the Python tools + HTMX.
Credit to the following blog posts and stackoverflow replies that were helpful in piecing this stuff together as a first time user of most of these Django packages:
| #!/bin/sh | |
| export PATH=/opt/bin:/opt/sbin:$PATH | |
| mount -o remount,rw /opt | |
| rm -f /tmp/root/acme.log | |
| /opt/etc/init.d/S80nginx stop | |
| acme.sh --renew --ca-path /opt/etc/ssl/certs --cert-home /opt/etc/ssl --home /opt/root/.acme --log /tmp/root/acme.log -d '*.DOMAIN.NET' --dns dns_aws --ecc | |
| acme.sh --install-cert --ca-path /opt/etc/ssl/certs --cert-home /opt/etc/ssl --home /opt/root/.acme --log /tmp/root/acme.log -d '*.DOMAIN.NET' --ecc \ | |
| --cert-file '/opt/etc/ssl/pem/*.DOMAIN.NET/cert.pem' \ | |
| --key-file '/opt/etc/ssl/pem/*.DOMAIN.NET/key.pem' \ | |
| --fullchain-file '/opt/etc/ssl/pem/*.DOMAIN.NET/fullchain.pem' |
| #!/bin/bash | |
| export PATH="$PATH" | |
| ############ CHANGE VARS BELOW ############## | |
| BASH_ENV="/home/ubuntu/.bashrc" | |
| sourcedir="/home/ubuntu/Dropbox" | |
| destdir="/home/ubuntu/_site" | |
| log="/home/ubuntu/jekyll_build.log" | |
| s3_website_confdir="/home/ubuntu" | |
| dropbox="/opt/dropbox/dropbox.py" | |
| jekyll="/home/ubuntu/.rvm/gems/ruby-2.3.0/wrappers/jekyll" |