Markdown Preview

Apa itu Markdown?

Markdown adalah bahasa markup ringan yang dibuat oleh John Gruber pada tahun 2004. Bahasa ini menggunakan simbol pemformatan teks biasa seperti tanda bintang, tanda pagar, dan tanda hubung untuk menunjukkan struktur: heading, tebal, miring, daftar, tautan, dan blok kode. Sebuah pratinjau Markdown merender teks biasa tersebut menjadi HTML terformat sehingga Anda dapat melihat dengan tepat tampilan dokumen akhir sebelum diterbitkan. Spesifikasi Markdown asli dijelaskan dalam dokumentasi Daring Fireball milik Gruber, dan format ini kemudian diformalkan sebagai CommonMark.

Markdown telah menjadi format penulisan default untuk dokumentasi pengembang, file README, generator situs statis (Jekyll, Hugo, Astro), wiki, dan basis pengetahuan. GitHub, GitLab, Bitbucket, Stack Overflow, Reddit, dan Notion semuanya mendukung Markdown secara native. Karena sumbernya adalah teks biasa, file Markdown sangat mudah dikontrol versinya dengan Git, dibedakan antar cabang, dan digabungkan tanpa konflik pada bagian file yang tidak tumpang tindih.

Sebuah alat pratinjau Markdown mengurai input Anda dan mengonversinya menjadi HTML secara real time. Ini memungkinkan Anda menangkap kesalahan pemformatan, tautan rusak, dan struktur bersarang yang tidak terduga sebelum Anda mengomit file atau menerbitkan halaman. Pratinjau ini berjalan sepenuhnya di browser Anda tanpa perjalanan bolak-balik ke server, sehingga Anda dapat mengerjakan dokumentasi pribadi atau sensitif tanpa mengirimkan konten melalui jaringan.

Mengapa Menggunakan Pratinjau Markdown Online?

Menulis Markdown di editor biasa tanpa pratinjau berarti Anda menebak-nebak hasilnya. Pratinjau langsung menutup siklus umpan balik itu seketika.

Kasus Penggunaan Markdown Preview

Referensi Sintaks Markdown

Tabel di bawah memetakan sintaks Markdown umum ke hasil rendernya dan elemen HTML yang sesuai. Ini mencakup dasar CommonMark yang didukung oleh hampir semua parser Markdown.

Perbandingan Varian Markdown

Platform yang berbeda memperluas spesifikasi Markdown asli dengan fitur tambahan. Mengetahui varian mana yang Anda targetkan membantu Anda menghindari sintaks yang gagal secara diam-diam di renderer lain.

Contoh Kode: Merender Markdown Secara Terprogram

Ketika Anda perlu merender Markdown di dalam sebuah aplikasi daripada alat browser, gunakan salah satu pustaka berikut. Setiap contoh mengonversi string Markdown menjadi string HTML.

import { marked } from 'marked'

const md = '# Hello\n\nThis is **Markdown**.'
const html = marked(md)
// → "<h1>Hello</h1>\n<p>This is <strong>Markdown</strong>.</p>\n"

// With options
marked.setOptions({ gfm: true, breaks: true })
const gfmHtml = marked('Line one\nLine two')
// → "<p>Line one<br>Line two</p>\n"

import markdown

md = '# Hello\n\nThis is **Markdown**.'
html = markdown.markdown(md)
# → '<h1>Hello</h1>\n<p>This is <strong>Markdown</strong>.</p>'

# With extensions
html = markdown.markdown(md, extensions=['fenced_code', 'tables'])

# Convert a file
with open('README.md') as f:
    html = markdown.markdown(f.read(), extensions=['extra'])

package main

import (
	"bytes"
	"fmt"
	"github.com/yuin/goldmark"
)

func main() {
	source := []byte("# Hello\n\nThis is **Markdown**.")
	var buf bytes.Buffer
	if err := goldmark.Convert(source, &buf); err != nil {
		panic(err)
	}
	fmt.Println(buf.String())
	// → <h1>Hello</h1>
	// → <p>This is <strong>Markdown</strong>.</p>
}

# Convert Markdown file to HTML
pandoc README.md -f markdown -t html -o output.html

# Convert with GitHub Flavored Markdown
pandoc README.md -f gfm -t html --standalone -o output.html

# Pipe from stdin
echo '# Hello **world**' | pandoc -f markdown -t html
# → <h1>Hello <strong>world</strong></h1>

Pertanyaan yang Sering Diajukan