Markdown to HTML Demo Article

Basic Syntax

These are the elements outlined in John Gruber’s original design document. All Markdown applications support these elements.

Heading

H1

H2

H3

H4

H5

Bold

bold text

Italic

italicized text

Blockquote

blockquote

Ordered List

  1. First item
  2. Second item
  3. Third item

Unordered List

  • First item
  • Second item
  • Third item

Code

These elements extend the basic syntax by adding additional features. These elements extend the basic syntax by adding additional features. It's npm run dev boys. Not all Markdown applications support these elements. Not all Markdown applications support these elements.

Horizontal Rule


These elements extend the basic syntax by adding additional features. Not all Markdown applications support these elements. If you want to learn see Markdown Guide to clear your concepts. These elements extend the basic syntax by adding additional features. Not all Markdown applications support these elements. These elements extend the basic syntax by adding additional features. Not all Markdown applications support these elements.

Image

alt text

Extended Syntax

These elements extend the basic syntax by adding additional features. Not all Markdown applications support these elements.

Table

Syntax Description Test Text
Header This creates a header Here's this
Paragraph A paragraph for long description And more
Header but a biggger one Title Here's this
Paragraph Text Another test for paragraph

Footnote

Here's a sentence with a footnote. 1

Here's a sentence 2 with a footnote. 2

Fenced Code Block

data/fetchedUser_data_from_api.json

{
  "firstName": "Johnddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd",
  "lastName": "Smith",
  "age": 25
}

JS code

import { something } from 'that-thing';

// Not sure what this code does

let index = 123;
const secret = 'my secret' + "her secret";

function find_thatThing(index, secret) {
  var temp = something.find(index, secret);

  temp.map((item, i) => {
    if(item.active === true) {
      index+=item.currentIndex;
      console.log(`He did it :), for ${index}.`)
    } else {
      break;
    }
  });
}

/* function forWhat() {
  console.log("IDK");
} */

export default find_thatThing;

Strikethrough

The world is flat.

Task List

  • Write the press release
  • Update the website
  • Contact the media

Emoji

😎️

Subscript

H2O

Superscript

X2

Footnotes

  1. This is the footnote.

  2. This is the footnote 2.

Made with ❤️ by Rajan