Markdown Önizleme
Sol tarafta yazın, sağ tarafta HTML’in render edilişini izleyin. Önizleme, GitHub tarzı Markdown’ı destekler: tablolar, görev listeleri, sözdizimi vurgulu çitli kod blokları, üstü çizili metin, otomatik bağlanan URL’ler ve satır içi HTML. Commit’ten önce bir README hazırlamak, bir yorumun PR’de nasıl görüneceğini kontrol etmek ya da her tuş vuruşunun render edilişini izleyerek Markdown sözdizimini öğrenmek için kullanışlıdır.
Önizleme nasıl kullanılır
-
1
Markdown yazın
Sol bölme ham Markdown alır. Her değişiklik sağ bölmeyi anında yeniden render eder.
-
2
HTML önizlemesini görün
Sağ bölme, GitHub gibi biçimlendirilmiş render çıktısını gösterir.
-
3
Modu değiştirin
Dikkat dağıtmadan yazmak için yan yana görünüm, yalnızca önizleme veya yalnızca kaynak.
-
4
HTML'yi kopyalayın
Bir e-posta istemcisine veya CMS'ye yapıştırmanız gerekiyorsa render edilmiş HTML'yi alın.
Bu önizlemenin desteklediği özellikler
- CommonMark: başlıklar, paragraflar, vurgu, listeler, blok alıntılar, kod blokları, bağlantılar, resimler, yatay çizgiler.
- GFM uzantıları: sütun hizalamalı tablolar, görev listeleri (
- [ ]ve- [x]),~~ile üstü çizili metin, otomatik bağlanan URL’ler ve dil ipucu içeren çitli kod blokları. - Sözdizimi vurgusu: highlight.js ile 100’den fazla dil, JavaScript, Python, Go, Rust, SQL, YAML vb.
- Ham HTML: satır içi HTML olduğu gibi geçirilir (güvenlik için temizlenir).
- Matematik (isteğe bağlı): matematik uzantısını etkinleştirirseniz
$...$satır içi ve$$...$$blok olarak render edilir.
Desteklenmeyenler
- Obsidian tarzı özel wiki bağlantıları (
[[Page]]), bunlar yalnızca Obsidian’a özgüdür. - Pandoc’un çitli div’leri (
:::), yalnızca Pandoc için. - Sunucu tarafı içeriştirmeler (server-side includes) veya
{% ... %}şablon etiketleri.
Tipik kullanımlar
- README hazırlama: IDE dışında yazıp son sürümü yapıştırın.
- PR yorum biçimini kontrol etme: yayınlamadan önce, GitHub’ın yorum kutusu kod bloklarını doğru önizlemez.
- Notları HTML’ye dönüştürme: biçimlendirilmiş içeriği bir e-postaya veya ham HTML kabul eden bir CMS’ye yapıştırmanız gerektiğinde.
- Markdown öğretme: yan yana görünüm sözdizimini apaçık ortaya koyar.
Performans
Render işlemi, GFM eklentili bir Markdown-it ayrıştırıcısı kullanır ve tamamen tarayıcıda çalışır. Birkaç yüz KB’lik belgeler milisaniyeler içinde render edilir; çok büyük olanlar (tek dosyada koca bir kitap) siz yazarken takılabilir, böyle bir durumda bunları bölümlere ayırın.
Dışa aktarma
- HTML’yi kopyala, render edilmiş içeriği ve biçim sınıflarını içeren
<div>’i verir. - .md indir, kaynağı kaydeder.
- Tarayıcınızın yazdırma penceresinden PDF’e yazdır, render edilmiş görünümün biçimlendirilmiş bir PDF kopyasını üretir.
Sık Sorulan Sorular
GitHub, GFM’nin üzerine kendi CSS’ini uygular. HTML çıktısı eşleşmelidir; biçimlendirme (yazı tipleri, boşluklar) onlara aittir. Tam eşitlik için “GitHub’ta render edildi” tema anahtarını kullanın.
Evet, matematik uzantısını etkinleştirirseniz, satır içi $...$ ve blok $$...$$ KaTeX ile render edilir. Sayfayı hafif tutmak için varsayılan olarak kapalıdır.
Temizlenir, <div>, <span>, <table>, <img> gibi güvenli etiketler geçer; <script> ve satır içi olay işleyicileri kaldırılır.
Yüzlerce KB sorunsuz çalışır. Çok büyük dosyalar için canlı render’ı kapatıp istek üzerine render edin.
Render tamamen istemci tarafında yapılır. İçerik hiçbir yere gönderilmez. Sayfayı yenilerseniz, tarayıcı form durumunu korumadıkça taslaklar kaybolur.
İlgili Araçlar
FPS Sayacı
requestAnimationFrame ile tarayıcı FPS değerini ölçün: yumuşatma, en düşük ve en yüksek kare hızı, uyarı eşiği ve isteğe bağlı grafik. Yerel çalışır, yükleme ve API yoktur.
Webpack Yapılandırma Oluşturucu
Kısa bir formdan webpack 5 için bir webpack.config.js oluşturun: entry, çıkış klasörü ve modu ayarlayın; ardından TypeScript, Babel, bir CSS yükleyici, HtmlWebpackPlugin ve bir dev sunucu açın.
Kurgusal telefon numarası oluşturucu
Beş ülkede resmen ayrılmış aralıklardan 50 adede kadar kurgusal numara üretin.
Dosya Boyutu Dönüştürücü
Bayt, KB, MB, GB, TB ve ikili IEC birimleri (KiB, MiB, GiB, TiB) arasında, ondalık ve ikiliyi dilediğiniz gibi birleştirerek dönüşüm yapın.
Telefon numarası doğrulayıcı
Telefon numarasının ülkeye göre yapısını denetleyin; bölge, tür, E.164, uluslararası, ulusal ve RFC 3966 biçimlerini görün.
Rastgele adres oluşturucu
Arayüz maketleri ve testler için üç basitleştirilmiş biçimde 1–20 adres benzeri kayıt oluşturun.
Araç diğer dillerde mevcuttur
- Pratinjau Markdown [ID]
- Markdownプレビュー [JA]
- Markdown-förhandsvisare [SV]
- Markdown 미리보기 [KO]
- ตัวแสดงตัวอย่าง Markdown [TH]
- Podgląd Markdown [PL]
- Markdown-Vorschau [DE]
- Trình xem trước Markdown [VI]
- Visualizador de Markdown [PT]
- Previsualizador de Markdown [ES]
- معاينة Markdown [AR]
- Markdown-preview [NL]
- Aperçu Markdown [FR]
- Markdown Previewer [EN]
- Visualizzatore Markdown [IT]
- Предпросмотр Markdown [RU]
- Markdown 预览器 [ZH]