Aral Balkan
@aral@mastodon.ar.al replied  ·  activity timestamp 4 days ago

🥳 All tests passing!

(And real-world projects seem to be rendering perfectly – and faster than before to boot.) :)

If further testing doesn’t bring out any issues, expect a new Kitten release this week with the new (and far improved) Markdown parser.

kitten💕

#Kitten #SmallWeb #web #dev#Markdown
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp last week

I’m speaking at Defuse – Design For Use – at The Sugar Club in Dublin on November 10th at 7PM.

The theme is “Reclaiming Design: Taking Back Purpose in an Automated Age” and my talk’s titled “Think small.”

It’s first come, first served, so mark your calendars and show up early (and find me and say hi if you do!) :)

defuse.ixd.ie
Aral Balkan
@aral@mastodon.ar.al replied  ·  activity timestamp last week

🎶 One of these things is not like the other…🎶

Can you spot the difference kids?

defuse.ixd.ie
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp last week

I’m speaking at Defuse – Design For Use – at The Sugar Club in Dublin on November 10th at 7PM.

The theme is “Reclaiming Design: Taking Back Purpose in an Automated Age” and my talk’s titled “Think small.”

It’s first come, first served, so mark your calendars and show up early (and find me and say hi if you do!) :)

defuse.ixd.ie
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 2 weeks ago

Coming soon (likely this afternoon, I’m writing tests and docs and updating examples as we speak)…

This is the sort of thing you’ll be able to do with Markdown pages. Just pop any arbitrary JavaScript you want in the new script block in the front matter and then import and use components as well as plain old JavaScript tagged template variable interpolation (not shown in this example) inside your Markdown.

The screen has all the code (sans the end of the last line of CSS and the closing tags for the

Screenshot: three windows: left side: Source of index.page.md, top-right browser showing running web app, bottom-right, source of Button and Reactions components. Contents of windows: index.page.md: --- title: An interactive markdown page script: | import Reaction from './Reaction.fragment.js' // Initialise database if necessary. kitten.db.reactions ??= {} kitten.db.reactions.Heart ??= 0 kitten.db.reactions.Confetti ??= 0 kitten.db.reactions.Smiley ??= 0 let page export function onConnect (data) { page = data.page } export function onReaction (data) { kitten.db.reactions[data.type]++ page.send(kitten.html`<${Reaction} />`) } --- <page css> # Hello! While this is a __markdown__ page, I can easily layer interactivity by adding a simple component in a script block. ## Reactions{id=your-reactions} <${Reaction} /> Browser (output): Hello! While this is a markdown page, I can easily layer interactivity by adding a simple component in a script block. Reactions Heart button: 5 Confetti button: 4 Smiley button: 3
Screenshot: three windows: left side: Source of index.page.md, top-right browser showing running web app, bottom-right, source of Button and Reactions components. Contents of windows: index.page.md: --- title: An interactive markdown page script: | import Reaction from './Reaction.fragment.js' // Initialise database if necessary. kitten.db.reactions ??= {} kitten.db.reactions.Heart ??= 0 kitten.db.reactions.Confetti ??= 0 kitten.db.reactions.Smiley ??= 0 let page export function onConnect (data) { page = data.page } export function onReaction (data) { kitten.db.reactions[data.type]++ page.send(kitten.html`<${Reaction} />`) } --- <page css> # Hello! While this is a __markdown__ page, I can easily layer interactivity by adding a simple component in a script block. ## Reactions{id=your-reactions} <${Reaction} /> Browser (output): Hello! While this is a markdown page, I can easily layer interactivity by adding a simple component in a script block. Reactions Heart button: 5 Confetti button: 4 Smiley button: 3
Screenshot: three windows: left side: Source of index.page.md, top-right browser showing running web app, bottom-right, source of Button and Reactions components. Contents of windows: index.page.md: --- title: An interactive markdown page script: | import Reaction from './Reaction.fragment.js' // Initialise database if necessary. kitten.db.reactions ??= {} kitten.db.reactions.Heart ??= 0 kitten.db.reactions.Confetti ??= 0 kitten.db.reactions.Smiley ??= 0 let page export function onConnect (data) { page = data.page } export function onReaction (data) { kitten.db.reactions[data.type]++ page.send(kitten.html`<${Reaction} />`) } --- <page css> # Hello! While this is a __markdown__ page, I can easily layer interactivity by adding a simple component in a script block. ## Reactions{id=your-reactions} <${Reaction} /> Browser (output): Hello! While this is a markdown page, I can easily layer interactivity by adding a simple component in a script block. Reactions Heart button: 5 Confetti button: 4 Smiley button: 3
Aral Balkan
@aral@mastodon.ar.al (and 1 other) recently replied  ·  activity timestamp 2 weeks ago

Not coming this afternoon :)

Just realised that I’m not handling nested interpolated values properly as I’m using a regular expression to simulate what JavaScript’s native tagged template feature does.

Instead, I have to write a simple parser.

If I had a penny for every time I started with regular expressions on this and then had to implement a proper parser afterwards… I’d have two pennies (the other time was for extracted nested tags. See a pattern? (I’m here all week.)

So, barring the discovery of other edge (or not-so edge) cases following further testing, I’m going to aim for middle of the week for the release of the new Markdown Pages feature.

kitten💕

#Kitten#KittenUpdate #SmallWeb
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 2 weeks ago

Coming soon (likely this afternoon, I’m writing tests and docs and updating examples as we speak)…

This is the sort of thing you’ll be able to do with Markdown pages. Just pop any arbitrary JavaScript you want in the new script block in the front matter and then import and use components as well as plain old JavaScript tagged template variable interpolation (not shown in this example) inside your Markdown.

The screen has all the code (sans the end of the last line of CSS and the closing tags for the

Screenshot: three windows: left side: Source of index.page.md, top-right browser showing running web app, bottom-right, source of Button and Reactions components. Contents of windows: index.page.md: --- title: An interactive markdown page script: | import Reaction from './Reaction.fragment.js' // Initialise database if necessary. kitten.db.reactions ??= {} kitten.db.reactions.Heart ??= 0 kitten.db.reactions.Confetti ??= 0 kitten.db.reactions.Smiley ??= 0 let page export function onConnect (data) { page = data.page } export function onReaction (data) { kitten.db.reactions[data.type]++ page.send(kitten.html`<${Reaction} />`) } --- <page css> # Hello! While this is a __markdown__ page, I can easily layer interactivity by adding a simple component in a script block. ## Reactions{id=your-reactions} <${Reaction} /> Browser (output): Hello! While this is a markdown page, I can easily layer interactivity by adding a simple component in a script block. Reactions Heart button: 5 Confetti button: 4 Smiley button: 3
Screenshot: three windows: left side: Source of index.page.md, top-right browser showing running web app, bottom-right, source of Button and Reactions components. Contents of windows: index.page.md: --- title: An interactive markdown page script: | import Reaction from './Reaction.fragment.js' // Initialise database if necessary. kitten.db.reactions ??= {} kitten.db.reactions.Heart ??= 0 kitten.db.reactions.Confetti ??= 0 kitten.db.reactions.Smiley ??= 0 let page export function onConnect (data) { page = data.page } export function onReaction (data) { kitten.db.reactions[data.type]++ page.send(kitten.html`<${Reaction} />`) } --- <page css> # Hello! While this is a __markdown__ page, I can easily layer interactivity by adding a simple component in a script block. ## Reactions{id=your-reactions} <${Reaction} /> Browser (output): Hello! While this is a markdown page, I can easily layer interactivity by adding a simple component in a script block. Reactions Heart button: 5 Confetti button: 4 Smiley button: 3
Screenshot: three windows: left side: Source of index.page.md, top-right browser showing running web app, bottom-right, source of Button and Reactions components. Contents of windows: index.page.md: --- title: An interactive markdown page script: | import Reaction from './Reaction.fragment.js' // Initialise database if necessary. kitten.db.reactions ??= {} kitten.db.reactions.Heart ??= 0 kitten.db.reactions.Confetti ??= 0 kitten.db.reactions.Smiley ??= 0 let page export function onConnect (data) { page = data.page } export function onReaction (data) { kitten.db.reactions[data.type]++ page.send(kitten.html`<${Reaction} />`) } --- <page css> # Hello! While this is a __markdown__ page, I can easily layer interactivity by adding a simple component in a script block. ## Reactions{id=your-reactions} <${Reaction} /> Browser (output): Hello! While this is a markdown page, I can easily layer interactivity by adding a simple component in a script block. Reactions Heart button: 5 Confetti button: 4 Smiley button: 3
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 2 weeks ago

Rewriting the Windows section of Kitten’s installation instructions.

Update: it’s live now.

kitten.small-web.org/

Screenshot of web browser showing https://localhost. It’s a detail of the Kitten web site’s main page, with the Install section highlighted: Install Latest version released last Tuesday at 5:28 PM Europe/Dublin (view source). Tabs: Linux, macOS, Windows (selected) Tab contents of Windows tab: Sorry, no. Microsoft is complicit in Israel’s genocide of the Palestinian people. (link) Small Technology Foundation (link) stands in solidarity with the Boycott, Divestment, and Sanctions (BDS) movement (link). Callout with exclamation mark: Windows is an ad-infested and surveillance-ridden dumpster fire of an operating system and, alongside supporting genocide, you are putting both yourself and others at risk by using it.
Screenshot of web browser showing https://localhost. It’s a detail of the Kitten web site’s main page, with the Install section highlighted: Install Latest version released last Tuesday at 5:28 PM Europe/Dublin (view source). Tabs: Linux, macOS, Windows (selected) Tab contents of Windows tab: Sorry, no. Microsoft is complicit in Israel’s genocide of the Palestinian people. (link) Small Technology Foundation (link) stands in solidarity with the Boycott, Divestment, and Sanctions (BDS) movement (link). Callout with exclamation mark: Windows is an ad-infested and surveillance-ridden dumpster fire of an operating system and, alongside supporting genocide, you are putting both yourself and others at risk by using it.
Screenshot of web browser showing https://localhost. It’s a detail of the Kitten web site’s main page, with the Install section highlighted: Install Latest version released last Tuesday at 5:28 PM Europe/Dublin (view source). Tabs: Linux, macOS, Windows (selected) Tab contents of Windows tab: Sorry, no. Microsoft is complicit in Israel’s genocide of the Palestinian people. (link) Small Technology Foundation (link) stands in solidarity with the Boycott, Divestment, and Sanctions (BDS) movement (link). Callout with exclamation mark: Windows is an ad-infested and surveillance-ridden dumpster fire of an operating system and, alongside supporting genocide, you are putting both yourself and others at risk by using it.
Russ Sharek
alcinnz
Jess Mahler
Russ Sharek and 3 others boosted
👻 eboy (ectoplasm boy)
@pixouls@post.lurk.org  ·  activity timestamp 2 weeks ago

Looking for server recommendations for a friend:
- POC, AuDHD friendly
- Asian LGBT+ fan media (esp Thai BL)
- Creative arts, Indie Web (as a newbie), UI/UX, creative coding
- Language learning (Thai, Cambodian, Mandarin) and linguistics (like languages at risk of being lost or color processing)

My first thought was yesterweb, any other thoughts?

#SEA#SoutheastAsian#IndieWeb #SmallWeb #fediverse #fandom
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 2 weeks ago

The new integrated Markdown parser I’ve been implementing in Kitten has been kicking my ass for the past few weeks but I think I finally have it fully working and seamlessly so. Expect a new release this/next week that brings the parsing of Markdown pages (.page.md files) in your apps up to the standard of the recently-improved runtime Markdown parsing in Kitten HTML tagged-template strings (within &lt;markdown&gt;…&lt;/markdown&gt; blocks).

The coolest thing is I was able to implement this without introducing any new syntax. In fact, I was able to simplify things so that you can now add arbitrary JavaScript to your Markdown pages within a multi-line script block in the YAML front matter (script: |) and use JavaScript string interpolation syntax in your Markdown (and, of course, Kitten components and conditionals, which, themselves, rely on string interpolation).

The only place where you have to deviate from standard Markdown in your Markdown pages is if you have JavaScript string interpolations or Kitten components/conditionals in code fences within your Markdown. In that case, you’ll have to escape them (e.g., &lt;\${Component} /&gt;, \&lt;if \${something}&gt;something\&lt;/if&gt;, etc.). And, to be fair, the person most impacted by this is likely me as the Kitten documentation at https://kitten.small-web.org is written in Kitten so I had a lot of escaping to do. But for any other use case, it means that things should just work and work exactly as they do in JavaScript pages (page.js files).

Anyway, so this is going to be a breaking change so I thought I’d give you (the three of you playing with Kitten right now?) a heads up. Of course, I’ll be updating the documentation to reflect all this.

(Remember, Kitten is in pre-release and it’s the framework I’m building/using to create Catalyst – the Small Web hosting solution – and Yarn – a small web – peer to peer – personal site app. So Kitten isn’t the means, not the end. And, at least until the Version 1 API freeze, things can and will break. That said, there’s nothing stopping you from playing with it now and, to be fair, at this point, such breaking changes should become rarer and rarer).

kitten💕

#Kitten #SmallWeb#SmallTech #web #dev#Markdown#JavaScript#HTML#CSS#JavaScript#NodeJS
Aral Balkan
@aral@mastodon.ar.al replied  ·  activity timestamp 2 weeks ago

Bloody hell, finally, I think I’m done with the Markdown support rewrite in Kitten.

The Markdown rule for interpreting four spaces as code fences has been the biggest pain in my neck during this whole ordeal but, bitching aside, it means the parser is now more accurate and thus stronger for it.

If all goes well, expect a Monday release :)

https://kitten.small-web.org

kitten💕

#Kitten #SmallWeb#SmallTech #web #dev#Markdown#HTML#CSS#JavaScript#NodeJS
👻 eboy (ectoplasm boy)
@pixouls@post.lurk.org  ·  activity timestamp 2 weeks ago

Looking for server recommendations for a friend:
- POC, AuDHD friendly
- Asian LGBT+ fan media (esp Thai BL)
- Creative arts, Indie Web (as a newbie), UI/UX, creative coding
- Language learning (Thai, Cambodian, Mandarin) and linguistics (like languages at risk of being lost or color processing)

My first thought was yesterweb, any other thoughts?

#SEA#SoutheastAsian#IndieWeb #SmallWeb #fediverse #fandom

¡Abbie!
¡Abbie! boosted
Cari
@cari@sunny.garden  ·  activity timestamp 3 weeks ago

Hi, fedi! I'm crawling out of my hermit hole to share my new app, TumblBee, with you all 🐝

https://lilacpixel.itch.io/tumblbee

TumblBee is a pay-what-you-want cross-platform app for exporting your original #Tumblr posts (and pages) to Markdown or HTML. Back up your content and browse it locally, or export to Markdown and drop your posts into your favorite static site generator. (There's even a guide to exporting for Obsidian, if that's your thing.)

If you decide to give it a try, I'd love to hear about it! Boosts are, as always, hugely appreciated 💕 boost_requested Thanks so much!

#software #tools#IndieDev#IndieWeb #SmallWeb #blogging #backup #markdown
Cari
@cari@sunny.garden replied  ·  activity timestamp 2 weeks ago

Happy Friday, fedi! Version 1.2.0 of TumblBee is now available!

https://lilacpixel.itch.io/tumblbee

A few small but nice tweaks in this update! You can now exclude empty reblogs from your exports, and self-reblogs will now link to the exported original post where possible. (Also: some new goodies for those of you who like finding Easter eggs. 🥚)

#software #tools#Tumblr#IndieDev#IndieWeb #SmallWeb #blogging #markdown
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 2 weeks ago

The new integrated Markdown parser I’ve been implementing in Kitten has been kicking my ass for the past few weeks but I think I finally have it fully working and seamlessly so. Expect a new release this/next week that brings the parsing of Markdown pages (.page.md files) in your apps up to the standard of the recently-improved runtime Markdown parsing in Kitten HTML tagged-template strings (within &lt;markdown&gt;…&lt;/markdown&gt; blocks).

The coolest thing is I was able to implement this without introducing any new syntax. In fact, I was able to simplify things so that you can now add arbitrary JavaScript to your Markdown pages within a multi-line script block in the YAML front matter (script: |) and use JavaScript string interpolation syntax in your Markdown (and, of course, Kitten components and conditionals, which, themselves, rely on string interpolation).

The only place where you have to deviate from standard Markdown in your Markdown pages is if you have JavaScript string interpolations or Kitten components/conditionals in code fences within your Markdown. In that case, you’ll have to escape them (e.g., &lt;\${Component} /&gt;, \&lt;if \${something}&gt;something\&lt;/if&gt;, etc.). And, to be fair, the person most impacted by this is likely me as the Kitten documentation at https://kitten.small-web.org is written in Kitten so I had a lot of escaping to do. But for any other use case, it means that things should just work and work exactly as they do in JavaScript pages (page.js files).

Anyway, so this is going to be a breaking change so I thought I’d give you (the three of you playing with Kitten right now?) a heads up. Of course, I’ll be updating the documentation to reflect all this.

(Remember, Kitten is in pre-release and it’s the framework I’m building/using to create Catalyst – the Small Web hosting solution – and Yarn – a small web – peer to peer – personal site app. So Kitten isn’t the means, not the end. And, at least until the Version 1 API freeze, things can and will break. That said, there’s nothing stopping you from playing with it now and, to be fair, at this point, such breaking changes should become rarer and rarer).

kitten💕

#Kitten #SmallWeb#SmallTech #web #dev#Markdown#JavaScript#HTML#CSS#JavaScript#NodeJS
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 2 weeks ago

The new integrated Markdown parser I’ve been implementing in Kitten has been kicking my ass for the past few weeks but I think I finally have it fully working and seamlessly so. Expect a new release this/next week that brings the parsing of Markdown pages (.page.md files) in your apps up to the standard of the recently-improved runtime Markdown parsing in Kitten HTML tagged-template strings (within &lt;markdown&gt;…&lt;/markdown&gt; blocks).

The coolest thing is I was able to implement this without introducing any new syntax. In fact, I was able to simplify things so that you can now add arbitrary JavaScript to your Markdown pages within a multi-line script block in the YAML front matter (script: |) and use JavaScript string interpolation syntax in your Markdown (and, of course, Kitten components and conditionals, which, themselves, rely on string interpolation).

The only place where you have to deviate from standard Markdown in your Markdown pages is if you have JavaScript string interpolations or Kitten components/conditionals in code fences within your Markdown. In that case, you’ll have to escape them (e.g., &lt;\${Component} /&gt;, \&lt;if \${something}&gt;something\&lt;/if&gt;, etc.). And, to be fair, the person most impacted by this is likely me as the Kitten documentation at https://kitten.small-web.org is written in Kitten so I had a lot of escaping to do. But for any other use case, it means that things should just work and work exactly as they do in JavaScript pages (page.js files).

Anyway, so this is going to be a breaking change so I thought I’d give you (the three of you playing with Kitten right now?) a heads up. Of course, I’ll be updating the documentation to reflect all this.

(Remember, Kitten is in pre-release and it’s the framework I’m building/using to create Catalyst – the Small Web hosting solution – and Yarn – a small web – peer to peer – personal site app. So Kitten isn’t the means, not the end. And, at least until the Version 1 API freeze, things can and will break. That said, there’s nothing stopping you from playing with it now and, to be fair, at this point, such breaking changes should become rarer and rarer).

kitten💕

#Kitten #SmallWeb#SmallTech #web #dev#Markdown#JavaScript#HTML#CSS#JavaScript#NodeJS
Aral Balkan
@aral@mastodon.ar.al  ·  activity timestamp 3 weeks ago

🥳 New Kitten Release

Housekeeping:

• Updated runtime version to Node version 22.18.0 (latest LTS).

• Removed --experimental-global-customevent in node launch command (as CustomEvent is no longer behing the CLI flag since Node v19.0.0)

• Renamed --experimental-loader flag to --loader as the experimental prefix is no longer required.

https://kitten.small-web.org

Enjoy!

kitten💕

#Kitten#KittenRelease #SmallWeb#SmallTech #web #dev#HTML#JavaScript#CSS#NodeJS
Aral Balkan
@aral@mastodon.ar.al replied  ·  activity timestamp 3 weeks ago

Ah, and also, forgot to mention this change:

Improved:

• Debugging your Kitten app is now easier when you run it using `INSPECT=true kitten …` as the Node runtime is launched using the `--inspect-brk` tag instead of the `--inspect` tag. This means that execution will wait for your debugger (e.g., Chromium’s DevTools at `chrome://inspect`, etc.) to connect before starting the server. This makes it possible to hit breakpoints that might previously have been impossible to reach as they occured before you had a chance to run the debugger.

Full change log:
codeberg.org/kitten/app/src/br