Shakedown Social

1 post1 participant0 posts today

Adam Johnson :django: :python:Django + htmx tip:Use hx-headers to pass Django’s CSRF token with all requests. This allows htmx to make data-modifying requests with methods like POST or PUT.More details: <a href="https://django-htmx.readthedocs.io/en/latest/tips.html#make-htmx-pass-djangos-csrf-token" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://django-htmx.readthedocs.io/en/latest/tips.html#make-htmx-pass-djangos-csrf-token</a><a href="https://fosstodon.org/tags/Django" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Django</a> <a href="https://fosstodon.org/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a>

SheenaMy April workshop schedule is up <a href="https://prelude.tech/upcoming_workshops" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://prelude.tech/upcoming_workshops</a> I now have some 4 day workshops (mon to thurs) as well as weekend workshops, to suit different schedules and time zones. Topics include: <a href="https://fosstodon.org/tags/Django" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Django</a> <a href="https://fosstodon.org/tags/Git" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Git</a> <a href="https://fosstodon.org/tags/HTMX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTMX</a> <a href="https://fosstodon.org/tags/Tailwind" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Tailwind</a> <a href="https://fosstodon.org/tags/Playwright" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Playwright</a> <a href="https://fosstodon.org/tags/AlpineJS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#AlpineJS</a> <a href="https://fosstodon.org/tags/AllAuth" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#AllAuth</a>

Adam Johnson :django: :python:📦 django-htmx 1.23.0 is out, now with a vendored copy of htmx!Now you no longer need to download and maintain a copy of htmx in your project, just use the template tag:{% load django_htmx %} {% htmx_script %}<a href="https://fosstodon.org/tags/Django" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Django</a> <a href="https://fosstodon.org/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a><a href="https://django-htmx.readthedocs.io/en/latest/changelog.html" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://django-htmx.readthedocs.io/en/latest/changelog.html</a>

SamHey has anyone used <a href="https://hachyderm.io/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> for a real project and if so how’d it go

saikyunI sat down and coded a bit and more and more things just came out. It felt like one thing naturally lead to another. :)Source: <a href="https://github.com/saikyun/writing-excuse" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://github.com/saikyun/writing-excuse</a><a href="https://mastodon.social/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> <a href="https://mastodon.social/tags/gamedev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#gamedev</a> <a href="https://mastodon.social/tags/javascript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#javascript</a>

saikyunNow the meeple can rest. :)Source: <a href="https://github.com/saikyun/writing-excuse" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://github.com/saikyun/writing-excuse</a><a href="https://mastodon.social/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> <a href="https://mastodon.social/tags/gamedev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#gamedev</a> <a href="https://mastodon.social/tags/javascript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#javascript</a>

Chris MayI just found out that my recent talk at DjangoCon about when to choose a <a href="https://fosstodon.org/tags/SPA" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SPA</a> architecture or one that leverages Hypermedia with tools like <a href="https://fosstodon.org/tags/HTMX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTMX</a> has suddenly become popular!<a href="https://djangotv.com/videos/djangocon-us/2024/choosing-wisely-spa-vs-htmx-for-your-next-web-project-with-chris-may/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://djangotv.com/videos/djangocon-us/2024/choosing-wisely-spa-vs-htmx-for-your-next-web-project-with-chris-may/</a>

SergiVersion 1.8.0 of jinja2-fragments is out!Release notes: - Adds support for rendering multiple blocks on Flask, Quart, Sanic and Litestar. - Fixes deprecated Litestar import.<a href="https://pypi.org/project/jinja2-fragments/1.8.0/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://pypi.org/project/jinja2-fragments/1.8.0/</a><a href="https://floss.social/tags/jinja" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#jinja</a> <a href="https://floss.social/tags/flask" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#flask</a> <a href="https://floss.social/tags/quart" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#quart</a> <a href="https://floss.social/tags/sanic" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#sanic</a> <a href="https://floss.social/tags/litestar" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#litestar</a> <a href="https://floss.social/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a>

Aral BalkanNew Kitten Release• Automatic message routing: if the element that triggers an event on the client does not have a `name` attribute, Kitten now falls back to using its `id` instead to route the event to the correct server-side event handler on your live Kitten pages. If neither attribute exists, Kitten will fail to route the message but no longer crash as it was due to a regression introduced when I implemented support for colons in element names.¹<a href="https://kitten.small-web.org" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org</a>For more details on Kitten’s live pages and automatic message routing, please see the Streaming HTML tutorial:<a href="https://kitten.small-web.org/tutorials/streaming-html/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org/tutorials/streaming-html/</a>Enjoy!:kitten:💕¹ A colon in an element name is ignored for message routing purposes, letting you, for example, give unique names to <details> elements, allowing more than one to be open at a time, while having their events be handled by the same handler.<a href="https://mastodon.ar.al/tags/Kitten" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Kitten</a> <a href="https://mastodon.ar.al/tags/SmallWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallWeb</a> <a href="https://mastodon.ar.al/tags/SmallTech" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallTech</a> <a href="https://mastodon.ar.al/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.ar.al/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dev</a> <a href="https://mastodon.ar.al/tags/JavaScript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#JavaScript</a> <a href="https://mastodon.ar.al/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTML</a> <a href="https://mastodon.ar.al/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://mastodon.ar.al/tags/hypermedia" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#hypermedia</a> <a href="https://mastodon.ar.al/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> <a href="https://mastodon.ar.al/tags/WebSocket" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebSocket</a> <a href="https://mastodon.ar.al/tags/beautifulDefaults" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#beautifulDefaults</a> <a href="https://mastodon.ar.al/tags/StreamingHTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#StreamingHTML</a>

Aral BalkanNew Kitten release• Fixes issue with routes where dynamic routes with file names that had more than two extensions were not recognised as the correct type of route. e.g., A route called index.xml.get.js would previously have been treated as a static route instead of a dynamic GET route.<a href="https://kitten.small-web.org" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org</a>For more details, see the Valid File Types section of the Kitten reference¹ and the Dynamic Pages tutorial².Enjoy!:kitten:💕¹ <a href="https://kitten.small-web.org/reference/#valid-file-types" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org/reference/#valid-file-types</a> ² <a href="https://kitten.small-web.org/tutorials/dynamic-pages/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org/tutorials/dynamic-pages/</a><a href="https://mastodon.ar.al/tags/Kitten" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Kitten</a> <a href="https://mastodon.ar.al/tags/SmallWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallWeb</a> <a href="https://mastodon.ar.al/tags/server" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#server</a> <a href="https://mastodon.ar.al/tags/framework" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#framework</a> <a href="https://mastodon.ar.al/tags/kit" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#kit</a> <a href="https://mastodon.ar.al/tags/SmallTech" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallTech</a> <a href="https://mastodon.ar.al/tags/routing" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#routing</a> <a href="https://mastodon.ar.al/tags/NodeJS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#NodeJS</a> <a href="https://mastodon.ar.al/tags/JavaScript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#JavaScript</a> <a href="https://mastodon.ar.al/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTML</a> <a href="https://mastodon.ar.al/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://mastodon.ar.al/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> <a href="https://mastodon.ar.al/tags/WebSocket" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebSocket</a> <a href="https://mastodon.ar.al/tags/hypermedia" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#hypermedia</a> <a href="https://mastodon.ar.al/tags/StreamingHTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#StreamingHTML</a> <a href="https://mastodon.ar.al/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.ar.al/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dev</a>

Chris Woody WoodruffAnnouncing ASP.NET Core Reimagined with htmx—your go-to guide for building modern, server-driven apps! Dive into Chapter 1 to see why htmx pairs perfectly with ASP.NET, Chapter 2 to set up your dev environment, and Chapter 3 for your first hands-on steps. <a href="https://mastodon.social/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> <a href="https://mastodon.social/tags/dotnet" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dotnet</a> <a href="https://mastodon.social/tags/ASPNET" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#ASPNET</a> <a href="https://aspnet-htmx.com/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://aspnet-htmx.com/</a>

Carlton Gibson 🇪🇺Anyone got an HTMX Django Todo example repo (or similar) that they’d point to for example purposes? Ta! <a href="https://fosstodon.org/tags/Django" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Django</a> <a href="https://fosstodon.org/tags/HTMX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTMX</a>

mborus<a href="https://mastodon.social/tags/TIL" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#TIL</a> there's a podcast on <a href="https://mastodon.social/tags/HTMX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTMX</a> and it's been going on for years - with nearly 100 episodes.<a href="https://hx-pod.transistor.fm" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://hx-pod.transistor.fm</a>

Aral BalkanNew Kitten release• You can now use key paths in the names of your client-side live components and these will automatically be transformed into object hierarchies on the server for you.¹• Self heals zombie live pages (see Streaming HTML workflow²) if they return to life due to client-side browser cache.³• Removes htmx⁴ headers from `data` property into separate `header` property in Kitten Page events and the data your Kitten Page message handlers receive.• Automatically passes references to the live page object (if any) and the request and response objects to the layout templates of Markdown pages⁵ (so you can, for example, check if `request.session.authenticated`⁶ is true from the your layout template and customise the layout accordingly).<a href="https://kitten.small-web.org" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org</a>Enjoy!:kitten:💕¹ e.g., See <a href="https://codeberg.org/small-tech/site/src/branch/kitten/admin%F0%9F%94%92/news/index_%5Boptional-postId%5D.page.js#L356" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codeberg.org/small-tech/site/src/branch/kitten/admin%F0%9F%94%92/news/index_%5Boptional-postId%5D.page.js#L356</a> (markup) and <a href="https://codeberg.org/small-tech/site/src/branch/kitten/admin%F0%9F%94%92/news/index_%5Boptional-postId%5D.page.js#L173" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codeberg.org/small-tech/site/src/branch/kitten/admin%F0%9F%94%92/news/index_%5Boptional-postId%5D.page.js#L173</a> (handler) and <a href="https://codeberg.org/small-tech/site/src/branch/kitten/app_modules/database/database.js#L95" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codeberg.org/small-tech/site/src/branch/kitten/app_modules/database/database.js#L95</a> (model class method). ² See Streaming HTML tutorial: <a href="https://kitten.small-web.org/tutorials/streaming-html/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org/tutorials/streaming-html/</a> (There’s actually more to it now but I haven’t had a chance to document the new class-based and event-driven live page workflow yet. It’s experimental but working very well for me so far so I will do so shortly.)³ When a person leaves a live/connected page (a page connected to its default web socket), we clean up and remove that live page from memory. However, browsers being what they are, cache the page on the client. If a person uses the back/forward buttons to return to the page, the browser will serve the cached source from memory, which has the old page ID, for the page that no longer exists in Kitten’s memory. So now we have a problem. The only way to recover from this is to tell the page to reload itself. So we accept the WebSocket connection, send a command to the page for it to reload itself, and then close the socket. That makes the stale page self heal by replacing itself with a fresh one. Yay, go us!⁴ HTMX: <a href="https://htmx.org" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://htmx.org</a>⁵ Kitten Markdown pages reference: <a href="https://kitten.small-web.org/reference/#markdown-pages-page-md-files" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org/reference/#markdown-pages-page-md-files</a>⁶ See Session tutorial: <a href="https://kitten.small-web.org/tutorials/sessions/" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org/tutorials/sessions/</a><a href="https://mastodon.ar.al/tags/Kitten" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Kitten</a> <a href="https://mastodon.ar.al/tags/SmallWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallWeb</a> <a href="https://mastodon.ar.al/tags/SmallTech" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallTech</a> <a href="https://mastodon.ar.al/tags/StreamingHTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#StreamingHTML</a> <a href="https://mastodon.ar.al/tags/WebSocket" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebSocket</a> <a href="https://mastodon.ar.al/tags/HTMX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTMX</a> <a href="https://mastodon.ar.al/tags/Markdown" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Markdown</a> <a href="https://mastodon.ar.al/tags/sessions" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#sessions</a> <a href="https://mastodon.ar.al/tags/data" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#data</a> <a href="https://mastodon.ar.al/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.ar.al/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dev</a> <a href="https://mastodon.ar.al/tags/JavaScript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#JavaScript</a> <a href="https://mastodon.ar.al/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTML</a>

Xe :verified:Today I'm gonna be working on some interesting things on stream!<ol><li>A meme generator using <a href="https://bsky.brid.gy/r/https://bsky.app/profile/tigrisdata.com" class="u-url mention" rel="nofollow noopener noreferrer" target="_blank">@tigrisdata.com</a>'s documentation and blogposts as inputs</li><li>A RAG-powered chatbot using the unrestrained glory of <a href="https://pony.social/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> </li></ol>Want to witness? Check out <a href="https://twitch.tv/princessxen" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://twitch.tv/princessxen</a> at noon EST!

Funky BobHello, again <a href="https://chaos.social/tags/FediHire" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#FediHire</a> ... seems my contract is winding up sooner than expected.Anyone need a <a href="https://chaos.social/tags/Python" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Python</a> / <a href="https://chaos.social/tags/Django" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Django</a> / Web / <a href="https://chaos.social/tags/Javascript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Javascript</a> senior dev with decades of experience?Comfortable with <a href="https://chaos.social/tags/React" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#React</a> and <a href="https://chaos.social/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> And can tune your <a href="https://chaos.social/tags/postgres" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#postgres</a> DBMS to keep it deliveringBased in Melbourne, Australia, and quite practiced at working remote.

Aral BalkanMay I just say so myself that I‘m loving playing with Kitten¹ to build Domain² (shown below) and Place³.¹ <a href="https://kitten.small-web.org" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org</a> ² <a href="https://codeberg.org/domain/app" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codeberg.org/domain/app</a> ³ <a href="https://codeberg.org/place/app" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codeberg.org/place/app</a><a href="https://mastodon.ar.al/tags/Kitten" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Kitten</a> <a href="https://mastodon.ar.al/tags/Domain" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Domain</a> <a href="https://mastodon.ar.al/tags/Place" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Place</a> <a href="https://mastodon.ar.al/tags/SmallWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallWeb</a> <a href="https://mastodon.ar.al/tags/SmallTech" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallTech</a> <a href="https://mastodon.ar.al/tags/humanRights" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#humanRights</a> <a href="https://mastodon.ar.al/tags/democracy" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#democracy</a> <a href="https://mastodon.ar.al/tags/technology" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#technology</a> <a href="https://mastodon.ar.al/tags/peerToPeer" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#peerToPeer</a> <a href="https://mastodon.ar.al/tags/peerToPeerWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#peerToPeerWeb</a> <a href="https://mastodon.ar.al/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.ar.al/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dev</a> <a href="https://mastodon.ar.al/tags/JavaScript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#JavaScript</a> <a href="https://mastodon.ar.al/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTML</a> <a href="https://mastodon.ar.al/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://mastodon.ar.al/tags/NodeJS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#NodeJS</a> <a href="https://mastodon.ar.al/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> <a href="https://mastodon.ar.al/tags/WebSocket" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebSocket</a> <a href="https://mastodon.ar.al/tags/objectOriented" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#objectOriented</a> <a href="https://mastodon.ar.al/tags/eventBased" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eventBased</a> <a href="https://mastodon.ar.al/tags/hypermedia" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#hypermedia</a>

Aral BalkanNew Kitten update<a href="https://kitten.small-web.org" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org</a>• Added `remove()` method to kitten.Component class. Use this when working with live pages and components and you want to remove a component from the page (or its parent). It will handle removing event listeners for you so you don’t end up with any memory leaks.• Improved `update()` method so it similarly removes listeners on child components before updating the component itself in case you have class-based child components that will be reinstantiated on render.• Updated the `send()` methods on `page.everyone` and `page.everyoneElse` so you can pass a swap target to insert the element being streamed to the page before, after, asFirstChildOf, or asLastChildOf another. (This was already there for the page.send() but now the two broadcast objects have the same consistent interface.The @small-web/kitten npm package (Kitten’s types package) has also been updated to version 5.1.0 to reflect the latest changes.(Remember that the new class and event-based page and component model is still experimental and largely undocumented and fully backwards compatible with the classic functional way of authoring your page routes and components.)Enjoy!:kitten:💕<a href="https://mastodon.ar.al/tags/Kitten" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Kitten</a> <a href="https://mastodon.ar.al/tags/SmallWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallWeb</a> <a href="https://mastodon.ar.al/tags/SmallTech" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallTech</a> <a href="https://mastodon.ar.al/tags/OOP" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#OOP</a> <a href="https://mastodon.ar.al/tags/eventModel" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eventModel</a> <a href="https://mastodon.ar.al/tags/StreamingHTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#StreamingHTML</a> <a href="https://mastodon.ar.al/tags/hypermedia" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#hypermedia</a> <a href="https://mastodon.ar.al/tags/WebSockets" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebSockets</a> <a href="https://mastodon.ar.al/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> <a href="https://mastodon.ar.al/tags/NodeJS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#NodeJS</a> <a href="https://mastodon.ar.al/tags/Javascript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Javascript</a> <a href="https://mastodon.ar.al/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTML</a> <a href="https://mastodon.ar.al/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://mastodon.ar.al/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.ar.al/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dev</a>

Aral BalkanA quick demonstration of using the State: Overview page in Kitten’s¹ settings while developing to keep an eye on your event and event listener counts to avoid memory leaks.Notice how the events and listeners counts change as I navigate between the People and Settings pages in my Place² node and that they are consistent. If they were rising as I navigated back and forth I’d know I had a memory leak somewhere.If you use Kitten’s built-in features (e.g., the `addEventHandler()` method on your `kitten.Component` subclasses, Kitten will handle adding and removing listeners for you automatically during your component’s lifecycle. You can also do so manually in your component’s automatically-called `onConnect()` and `onDisconnect()` event handlers.This view is useful during development to ensure you don’t have any memory leaks as pages are loaded and unloaded.<a href="https://vimeo.com/1050714714" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://vimeo.com/1050714714</a>¹ <a href="https://kitten.small-web.org" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://kitten.small-web.org</a> ² Place is in early development at the moment (<a href="https://codeberg.org/place/app" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://codeberg.org/place/app</a>)<a href="https://mastodon.ar.al/tags/Kitten" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Kitten</a> <a href="https://mastodon.ar.al/tags/SmallWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallWeb</a> <a href="https://mastodon.ar.al/tags/SmallTech" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#SmallTech</a> <a href="https://mastodon.ar.al/tags/demo" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#demo</a> <a href="https://mastodon.ar.al/tags/developerExperience" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#developerExperience</a> <a href="https://mastodon.ar.al/tags/developerTools" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#developerTools</a> <a href="https://mastodon.ar.al/tags/design" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#design</a> <a href="https://mastodon.ar.al/tags/eventModel" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#eventModel</a> <a href="https://mastodon.ar.al/tags/events" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#events</a> <a href="https://mastodon.ar.al/tags/memory" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#memory</a> <a href="https://mastodon.ar.al/tags/memoryLeaks" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#memoryLeaks</a> <a href="https://mastodon.ar.al/tags/observerPattern" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#observerPattern</a> <a href="https://mastodon.ar.al/tags/listeners" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#listeners</a> <a href="https://mastodon.ar.al/tags/web" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#web</a> <a href="https://mastodon.ar.al/tags/dev" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#dev</a> <a href="https://mastodon.ar.al/tags/HTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTML</a> <a href="https://mastodon.ar.al/tags/CSS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#CSS</a> <a href="https://mastodon.ar.al/tags/JavaScript" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#JavaScript</a> <a href="https://mastodon.ar.al/tags/NodeJS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#NodeJS</a> <a href="https://mastodon.ar.al/tags/server" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#server</a> <a href="https://mastodon.ar.al/tags/platform" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#platform</a> <a href="https://mastodon.ar.al/tags/framework" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#framework</a> <a href="https://mastodon.ar.al/tags/WebSockets" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#WebSockets</a> <a href="https://mastodon.ar.al/tags/hypermedia" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#hypermedia</a> <a href="https://mastodon.ar.al/tags/htmx" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#htmx</a> <a href="https://mastodon.ar.al/tags/StreamingHTML" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#StreamingHTML</a> <a href="https://mastodon.ar.al/tags/place" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#place</a> <a href="https://mastodon.ar.al/tags/peerToPeer" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#peerToPeer</a> <a href="https://mastodon.ar.al/tags/peerToPeerWeb" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#peerToPeerWeb</a>

SheenaMy next Modern frontend development with <a href="https://fosstodon.org/tags/Django" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Django</a>, <a href="https://fosstodon.org/tags/HTMX" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#HTMX</a>, <a href="https://fosstodon.org/tags/Tailwind" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Tailwind</a>, <a href="https://fosstodon.org/tags/Playwright" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#Playwright</a> and <a href="https://fosstodon.org/tags/AlpineJS" class="mention hashtag" rel="nofollow noopener noreferrer" target="_blank">#AlpineJS</a> workshop is happening on 1 and 2 Feb. There are still some tickets left! Learn more here: <a href="https://buff.ly/4hq7FUr" rel="nofollow noopener noreferrer" translate="no" target="_blank">https://buff.ly/4hq7FUr</a> I also have some really cool bonuses for you.Please share this with whoever might benefit!

Recent searches

Search options

Administered by:

Server stats:

#htmx