Hung-Yi’s Journal

It's been more than 5 years since I started writing my UI code in a reactive fashion with ReactiveX. I've used RxJava for Android development, ReactiveUI for Xamarin development, and now I'm using RxJS for Angular development. I stuck with it not because it was easy—it definitely wasn't—but because something about it just felt so right. For the longest time I couldn't explain it, and I'm not even sure I can explain it succinctly now. But today I want to use an example to at least try to illustrate just a touch of the mystery and allure that drew me into Reactive¹ Programming in the first place. Let's dive in.

It can be confusing as a new Emacs user. The tutorials that you read online often throw a bunch of obscure command names or long chains of key sequences at you without explaining the why and the how behind the what.

Today I'll outline what I think are the fundamentals for exploring Emacs features. These techniques can be used if you're just messing around in Emacs on your own, but they can even help you understand other Emacs tutorials better. You might consider this a tutorial for how to follow other Emacs tutorials.

One thing sorely lacking in native Emacs is the ability to edit with multiple cursors like VS Code. Fortunately for Doom Emacs or Evil users, there's evil-mc. But even with that installed, all it gives you is a bunch of commands—you still have to decide how to bind them yourself or rely on Doom's suggested bindings that map everything to the g z prefix for every command.

But I think we can do better. Today, I'm sharing an Emacs hydra that I've been using to power up my evil-mc usage. Just put this anywhere in your config.el:

Let's say you're writing a recipe but you want to scale the ingredients down by one third. The recipe calls for 280g of flour. And you want to round to the nearest 10g.

I applaud you if you can easily do that in your head—because I certainly can't. Also yes, it would be easy just to run your system's calculator app to get the answer, but why leave Emacs if you can help it? Doing it this way also saves you a bunch of manual copying and pasting.

Simple HTML and CSS is all you need for a basic signal indicator icon. CSS flexbox makes it easy to space the bars evenly apart from each other and sink them to the bottom. After that, some weak, medium and strong classes and creative use of the :nth-child() selector lets us tweak the size and emphasis of the signal bars. Take a look!