Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Render tex (text and math) in the app #32

Draft
wants to merge 1 commit into
base: master
Choose a base branch
from
Draft

Conversation

ivan-aksamentov
Copy link
Member

@ivan-aksamentov ivan-aksamentov commented Sep 27, 2023

This is a work in progress, little fun experiment, of rendering document written in tex in the web app.

There's notes/notex.tex file with some complex equations. First I used pandoc to convert tex to markdown:

sudo apt-get install pandoc
pandoc -s notes/notes.tex -o web/src/content/en/Notes.md

Then I replaced home page content with the generated web/src/content/en/Notes.md.

I use remark-math and rehype-katexplugins for the @next/mdx renderer. I had to also add global CSS from katex so that formulas look a bit prettier.

I had to remove % comment from the formula in the tex file, because it was confusing the parser it seems and it generated red unformatted text past the % sign .

The document has hard line breaks at char 80, and this unfortunately translates into line breaks in the final render too, even though I'd expect it not to. This might be configurable (by i.e. using GitHub flavor of markdown rendering). Otherwise we could tell doc authors to remove the hard breaks and use soft-wrap in the editor instead.

Some styling will be needed, but otherwise it seems to be working very well. This feature might allow to:

  • have shared tex snippets, let's say between a paper and the website
  • add formulas to existing markdown content

This is a work in progress, little fun experiment, of rendering document written in tex in the web app.

There's `notes/notex.tex` file with some complex equations. First I used `pandoc` to convert tex to markdown:

```bash
sudo apt-get install pandoc
pandoc -s notes/notes.tex -o web/src/content/en/Notes.md
```

Then I replaced home page content with the generated `web/src/content/en/Notes.md`.

I use `remark-math` and `rehype-katex`plugins for the `@next/mdx` renderer. I had to also add global CSS from `katex` so that formulas look a bit prettier.

I had to remove `%` comment from the formula in the tex file, because it was confusing the parser it seems and it generated red unformatted text past the `%` sign .

The document has hard line breaks at char 80, and this unfortunately translates into line breaks in the final render too, even though I'd expect it not to. This might be configurable (by i.e. using GitHub flavor of markdown rendering). Otherwise we could tell doc authors to remove the hard breaks and use soft-wrap in the editor instead.

Otherwise it seems to be working very well. This feature might allow to:
 - have shared tex snippets, let's say between a paper and the website
 - add formulas to existing markdown content
@vercel
Copy link

vercel bot commented Sep 27, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated (UTC)
flu-frequencies ✅ Ready (Inspect) Visit Preview Sep 27, 2023 10:19am

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant