Wouldn't it be cool if DEV could render LaTeX?

Oh neat, you can.

$$c = \pm\sqrt{a^2 + b^2}$$

Here's the code to produce that snippet:

{% katex %}
c = \pm\sqrt{a^2 + b^2}
{% endkatex %}

It's new and there will be kinks that need to be worked out.

Kudos to @maestromac for a really fabulous implementation.

Implement KatexTag #6237

maestromac posted on Feb 21, 2020

What type of PR is this? (check all applicable)

• [x] Feature

Description

Used katex-ruby gem to make a Katex Liquid Tag.

• In order to make this work, I had to turn off Redcarpet's superscripts feature. I was more comfortable with this change when I learn that Github and Gitlab shared similar settings.
• I found it impossible to pass our storybook prebuild because it can't resolve @import _katex as that is a geminifed CSS. I've decided to copy provided CSS into our own app. I'd imagine this would help with serving up CSS for stack bit apps. If this is a bad idea please let me know.

Misc resources:

• similar jekyll implementation

Related Tickets & Documents

Resolves https://github.com/thepracticaldev/dev.to/issues/182 Resolves https://github.com/thepracticaldev/dev.to/issues/97

Mobile & Desktop Screenshots/Recordings (if there are UI changes)

Added tests?

• [x] yes

Added to documentation?

• [x] yes, need to add in the editor guide

[optional] Are there any post-deployment tasks we need to perform?

n/a

View on GitHub

Happy coding!

Comments

[Andrew (he/him)]

$$\int\left(\frac{\omega \omicron^w}{\mathit{t}\hbar \alpha t'^s\cdot a_ma\mathbf{z}ing}\right)\int$$

[Ben Halpern The DEV Team]

Ha!

[Daan Wilmer]

Cool to see that

$$\text{\LaTeX} \in \text{Supported Features}$$

[Ben Halpern The DEV Team]

Charts would also be really cool. Comments in this thread have some good ideas on that matter...

What's the best charts library with a small bundle size?

Ben Halpern

Ben Halpern

Ben Halpern

Follow

Feb 28 '20

What's the best charts library with a small bundle size?

#discuss #javascript #webdev #dataviz

16 reactions

10 comments

1 min read

[Ben Halpern The DEV Team]

Interesting...

Is that fully inline, so $$x^2$$ automatically becomes...

$$x^2$$

?

[Basti Ortiz]

👏👏👏

What a great feature! Thanks, @maestromac .

[Mac Siri]

No problem 😊

[Swastik Baranwal]

OMG! Fabulous!

[Martí]

Lemme see if it works...

{% katex %}
c = \pm\sqrt{a^2 + b^2}
{% endkatex %}

hello $$\alpha=4$$ testing inline equation
testing double dollar notation

$$\text{This would be amazing}\longrightarrow \sqrt{x}$$

[Martí]

Ah crap without code block?

$$c = \pm\sqrt{a^2 + b^2}$$

[Martí]

Does this work? $$\text{This would be amazing}\longrightarrow \sqrt{x}$$

[Martí]

Ah I see

$$\text{So inline equations not supported... still great!}$$

:)

[jeikabu]

LaTeX was a major part of my stint in academia. Have something of a love/hate relationship with it, but this is a welcome feature, nonetheless.

[cartman]

test equation

$$c = \pm\sqrt{a^2 + b^2} \\ e^{ i \pi } + 1 = 0$$

[Michel Renaud]

Damn... I haven't used LaTeX since the mid-90s. :)