Comment by akkartik

Comment by akkartik 16 hours ago

This works if your code snippets generate relatively static output. Lately I often need to create animations, often interactive ones. See https://akkartik.name/debugUIs.html, for example.

In my life I've often switched to more manual tools when I notice that the more automated tool causes me to live within certain limitations. Sometimes it has taken me a decade to notice these limitations. Automation matters when I do something tens of times a day. But I publish a blog post once in tens of days. It feels worth some additional work to get a little more control and break out of ruts.

adityaathalye 7 hours ago

The neat thing about org-mode for writing and publishing (I don't use it for "productivity") is that every time I have a new requirement, there is a solution that I can integrate into my existing writing workflow. And I get multimedia publishing "for free".

Discussed here: https://news.ycombinator.com/item?id=43157672

  Why and How I use "Org Mode" for my writing and more
  217 points by sebg 7 months ago | 64 comments

src: https://github.com/adityaathalye/shite/blob/master/sources/p...

Reply View 0 replies

justinhj 9 hours ago

I also blog with org mode and anything that can be exported as a block of html can be easily included. Recently I dropped an interactive chart using React into the text, for example.

Reply View 1 reply

adityaathalye 7 hours ago

Ditto. I wanted to show JavaScript text art animation, and could "just" do this:

  *** ~setInterval~ and ~setTimeout~ worked just right
  These let us call functions that do exactly the thing we want,
  viz. punch /[[#the-aesthetic-of-text-art-and-its-animation][characters]]/
  into our "live spreadsheet" medium, exactly the way the artist
  placed them in the original art source.

  These methods can make a CPU sing, but hey, the awesome art
  is worth every watt it, ah, draws.

  #+html: <div class="box invert">
  #+html: <em>Random twitch loop <code>setTimeout</code> and recursion.</em>
  #+html: <div id="blink-demo"></div>
  #+html: </div>
  #+html: <script type="text/javascript">demoBlink();</script>

  #+html: <div class="box invert">
  #+html: <em>Flipbook-like frame-by-frame animation loop with <code>setInterval</code>.</em>
  #+html: <div id="glider-demo"></div>
  #+html: </div>
  #+html: <script type="text/javascript">demoGlider();</script>

This works very nicely because I've structured my website as "every post is just a microsite". See:

src: https://github.com/adityaathalye/shite/tree/master/sources/p...

  \_ (develop %|u+4) $ tree sources/posts/animate-text-art-javascript/
  sources/posts/animate-text-art-javascript/
  ├── animations.js
  ├── blink.ddw
  ├── DarkDrawSheetView.png
  ├── glider.ddw
  ├── HanukkahOfData2022ArtCopyrightDwimmertxt.png
  ├── HanukkahOfData2022ArtSliceCopyrightDwimmertxt.png
  ├── HanukkahOfData2022DarkDrawDrawingViewCopyrightDwimmer.png
  ├── HanukkahOfData2022DarkDrawSheetViewCopyrightDwimmer.png
  ├── index.org
  ├── loading.ddw
  └── spinner.ddw
  
  1 directory, 11 files

Reply View 0 replies