Post AxI5LnF534enydptdQ by aral@mastodon.ar.al
 (DIR) More posts by aral@mastodon.ar.al
 (DIR) Post #AxI5LnF534enydptdQ by aral@mastodon.ar.al
       2025-08-18T10:00:39Z
       
       0 likes, 0 repeats
       
       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 <style> and <div> in the Reactions component, which I couldn’t make fit without reducing the font size) for the example you see in the browser with functional buttons that persist their state to Kitten’s built-in default database.When I say all the code, I mean all the code. There is no scaffolding. Those two files are the only two files in the project.https://kitten.small-web.org#Kitten #SmallWeb #SmallTech #HTML #CSS #JavaScript #JS #Markdown #web #dev #comingSoon
       
 (DIR) Post #AxI5QvOIBCyYhIak8u by aral@mastodon.ar.al
       2025-08-18T10:01:01Z
       
       0 likes, 0 repeats
       
       Alt text (continued due to Mastodon’s 1500 character limit on alt-text):Source of Button and Reactions components:/**  Simple Reactions control.  Broadcasts «reaction» event.*/function Button ({ Icon }) {  const iconName = Icon.name  return kitten.html`    <div class='reaction'>      <button name='reaction' data='type:"${iconName}"' connect>        <${Icon} weight=duotone alt=${Icon.name} colour=deeppink><title>${Icon.name}</title></>      </button>      ${kitten.db.reactions[iconName]}    </div>  `}export default function Reactions () {  return kitten.html`    <div id='reactions' morph>      <${Button} Icon=${kitten.icons.Heart} />      <${Button} Icon=${kitten.icons.Confetti} />      <${Button} Icon=${kitten.icons.Smiley} />      <style>        button { background: var(--background-alt); }        button:hover { background: var(--background); }        #reactions { display: flex; }        .reaction { display: flex; flex-direction: column; align-items: center; font-size: 2em;}      </style>    </div>  `}
       
 (DIR) Post #AxI8OJRyZRmGJHlER6 by aral@mastodon.ar.al
       2025-08-18T10:34:47Z
       
       0 likes, 0 repeats
       
       OK, so here’s likely the simplest possible example demonstrating:• The same route, implemented as both a Kitten JavaScript Page (.page.js) and as a Kitten Markdown Page (.page.md)• How to persist to the default Kitten JSDB¹ database.https://kitten.small-web.org¹ https://kitten.small-web.org/tutorials/persistence/#Kitten #SmallWeb #web #dev #JavaScript #HTML #Markdown #example #comingSoon
       
 (DIR) Post #AxIkdxuqCQeMPi9XyS by aral@mastodon.ar.al
       2025-08-18T17:42:55Z
       
       0 likes, 0 repeats
       
       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 <markdown> 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
       
 (DIR) Post #AxImBz1kfoLXf2AcjI by nilix@cafe.nilfm.cc
       2025-08-18T17:47:54Z
       
       0 likes, 0 repeats
       
       @aral fiiiiire, keep it up ^^ i love seeing the progress youre making with kitten
       
 (DIR) Post #AxImBztHSnAGL3DNAG by aral@mastodon.ar.al
       2025-08-18T17:59:30Z
       
       0 likes, 0 repeats
       
       @nilix Thank you 💕
       
 (DIR) Post #AxImMCQ5jcvw5pQV3A by brad@1040ste.net
       2025-08-18T18:02:25Z
       
       0 likes, 0 repeats
       
       @aral And we all know that regex usage leaves you with two problems - https://regex.info/blog/2006-09-15/247(disclaimer: Perl is still my true love, even though I've no avenue to use it at work save for some old library systems' bespoke scripts that need a tweak whenever we upgrade Dead Rat Linux majors. And I really like regexes when appropriate, which for text processing is very often)
       
 (DIR) Post #AxJ559zHQKk8ksTSaW by mlohbihler@techhub.social
       2025-08-18T21:32:18Z
       
       0 likes, 0 repeats
       
       @aral my dude, I'll give you the two pennies
       
 (DIR) Post #AxJJUyIUuNKhO1fIDA by mahmoudsalama98@mastodon.social
       2025-08-19T00:13:54Z
       
       0 likes, 0 repeats
       
       @aral Hello my friend aral I am Mahmoud from Gaza, the sole provider for my family of 12 during the war and genocide we are experiencing. Please, I am new to this site.Could you help boost my account and quote my latest post?🙏I would be very grateful to you.Wishing you well.💙