<code> tag: how to "correct" publish it?

Question

I'm not sure I will explain what I'm looking for.

What is the name "source code parser" for publishing code in HTML? For example, when I write some source code here in a stack overflow, the system automatically detects sintax and writes the "correct" source code in html.

I noticed that there is an HTML tag <"code">, but it just writes the source code in the courier font.

So, I ask you if there is some kind of “external” component that, given the text, parses it correctly on an HTML page.

Thanks!

Answer 1

SO uses prettify for syntax highlight <code> fragments.

Source: What tools and technologies were used to create Trilogy?

This is a JavaScript tool that scans a page for code snippets and paints them on the fly. The disadvantage of this solution is that it does not work with JavaScript disabled. Seeing how syntax coloring is not a really important task is probably a minor flaw.

Answer 2

The system is called Markdown , and here is the explanation that it uses.

Another syntax called prettify is used to highlight the syntax you mentioned.

Answer 3

There are two components to this:

• CSS / HTML structure for syntax highlighting (e.g. styles for printing keywords, #s, lines, comments, etc. in specific colors). It can be common or for each language.

• A code parser (grammar parser) that breaks the code into tokens and marks markers with the corresponding classes. This can be implemented either in the background through any language in which your internal server is located; or to the front-end via JavaScript (an example of the latest Google Pretty Code , which is used by StackOverflow).

  It can be associated with some heuristic logic to decide which language the code belongs to (and therefore which grammar / parser to use).