Hello Friend.

You landed on this site’s first Astro page render.

Don’t worry. This website doesn’t track you and has no ads. Just a lot of words and- Oh.

What’s an Astro, you ask?

So glad you asked.

It’s a modern web builder. React, Vite, Vue, with static page or SSR serving, depending on the HTTP route. We’re focused on it’s utility here: rendering .md into static pages.

That is, convert the markdown and for the love of maths, parse inline and LaTeX blocks such as $\latex$ and $$\frac{42}{\pi}$$.

But why?

Well, markdown is what I and may consider a first-class medium for technical writing. That is to:

  1. Get to the point (concise & brief)
  2. Write with clarity: input divided by average of the sum (avoid this)
  3. Seperation of concerns: write words and maths, not JS

Quick Demonstration

I had notes on RSA, and one particular area of concern is how one converts decimal to binary. Say we have have the data 459173 to encrypt. And, we’ll assume… no libraries, no magic. Just a calculator. Well, let’s talk machine:

We need our number in binary. So, first off is figuring out how many bits fit in our binary number. Then we using a cool trick, we can just subtract each bit going down. We know it’s a 1 in our binary number if the number from the operation was positive, the opposite is true for 0 where a negative means we’ll write a 0.

Ah, we fit it to base 2!

That means our binary number is 11100000000110100112=459173101110000000011010011_2 = 459173_{10} or more importantly in this case: 218+217+216+28+27+25+22+202^{18}+2^{17}+2^{16}+2^8+2^7+2^5+2^2+2^0, since we may be interested in using the powers for Fast Exponentiation with Modular Exponentiation.

Markdown Winning

That was past me, adopted. Sure, I could have made another example, but imagine, all I had to do was pull up a search for a local file with “RSA”. Ah, perfect- the defunct RSA example. In case you’re wondering, it’s was bad because it’s too big for most calculators, but the important part is I could pull up any example I’ve done in the past, written with the clarity of a book. Well.. not book quality, I’m not getting awards for writing, but the format has fidelity: having the readability of maths with and the portability of a .txt, that’s markdown.

But here it is in a portion, adopted for this example. Notes that can be agnostic, just as many Python applications utilize the numpy package to utilize the speed of low level language. Why don’t we utilize LaTeX in the same manner?

Of course, markdown is more like Python. Perfect I say, it should be easy to write and communicate. Imagine if I had to recall JS along with LaTeX. I wouldn’t both writing this example.

I would be remiss to not mention, LaTeX isn’t standardized as a part of markdown- but it’s a trend. Second mind or Knowledge Management Systems (KMS), such as Obsidian, Logseq, Notation, and others often support this exact type of inline maths.

It’s rather time mathematics stops receiving the backseat in web presentation, and that’s why this page uses markdown with a framework like Astro or Hugo. It enables brief writing that is rich, without making it a friction point.

With a bit of technical effort, it can be trivial to support what LaTeXLaTeX and markdown has to offer.

Static Page Generation

As I hinted at, Asto is part of what makes this page possible. It parses the .md file with a few helping packages. Hugo also implements a similar approach, although, required more time to implement. Both are great projects.

Astro on the other hand, is a highly flexiable framework. Imagine, if you will, putting JS in your markdown. Astro presented me .mdx or Markdown JSX Embeddable, so JavaScript + markdown.

Conjoined Triangle of Success

You might think, wait, didn’t you just finish advocating markdown purity of JS?

…tsk.

Well, guess what, we have the JSX option. The component-era MDX sibbling, and it’s pretty exciting for the future of web development. I think there’s a clear calling for both.

That’s what makes Astro so addicting. It’s ready for page routes for React, markdown, or JSX markdown. Which, for development, exploration, and narratives explaining what technology is doing, this enables it. Think of it as a website friendly Jupyter Notebooks, if you will.

And that’s an Astro + katex + markdown stack, in a nutshell. Shout out to rehypeKatex and remarkMath. The latter deserves some GitHub hype and has a wonderful demonstration of their own.