Markdown Examples

This is the first line.
And this is the second line.

I just love bold text. Italicized text is the cat’s meow.

Dorothy followed her through many of the beautiful rooms in her castle.

First item
Second item
Third item
1. Indented item
2. Indented item
Fourth item

unordered
- indented list

Code Examples

Inline Code

Here is some inline code console.log('Hey I'm inline-code')

No Highlighting

	
		Svelte
		
			
			
		
	
	<script lang="ts">
	import { page } from '$app/stores'
	import { Url } from '$lib/url'
	import type { PageData } from './$types'
	export let data: PageData

	const { posts } = data
</script>

<svelte:head>
	<title>Cesar Mejia's Web Portfolio</title>
	<link rel="canonical" href={$page.url.href} />
</svelte:head>

<div>
	<ul>
		{#each posts as post (post.slug)}
			<li class="mb-4"><a class="unstyled" href={Url.BlogDetail(post.slug)}>{post.title}</a></li>
		{/each}
	</ul>
</div>

With Highlighting

	
		JavaScript
		
			
			
		
	
	export async function load({ fetch }) {
	const variable = "this is a super long variable declaration come on"
	const res = await fetch(`/posts.json`)
	if (res.ok) {
		const { posts } = await res.json()
		return { posts }
	}
}

const code = 'yay!'

const code = 'yay!'

With Focus

	
		TypeScript
		
			
			
		
	
	export async function load({ fetch }) {
	const variable = "this is a super long variable declaration come on"
	const res = await fetch(`/posts.json`)
	if (res.ok) {
		const { posts } = await res.json()
		return { posts }
	}
}

const code = 'yay!'

const code = 'yay!'

Remark Abbreviations Examples

This plugin works on Markdown Abstract Syntax Tree (MDAST), a Markdown Abstract Syntax Tree (AST) implemented by remark

Remark-Github Examples

ref: https://github.com/remarkjs/remark-github
Commit: 63cf895
Discussion: #1
Issue: #2
Mention: @cesarnml

test 🙂 inline

All Posts

Second Svelte MDX post

First Svelte MDX post