Markdown'ı Canlı Önizlemeli HTML'e Dönüştür
Markdown metnini yazarken güncellenen canlı önizlemeyle temiz HTML koduna dönüştürün.
Belgeniz cihazınızda kalır
Sonradan silinecek bir şey yok
İç belgeler için güvenli
Her modern tarayıcıda çalışır
Nasıl çalışır
- 1
Markdown’ınızı yapıştırın
Bir README, bir belge sayfası, bir yazı ya da HTML olarak istediğiniz notlar.
- 2
Önizlemeyi denetleyin
İşaretlemeye bakmadan önce yapının amaçladığınız gibi çıktığını doğrulayın.
- 3
HTML’i kopyalayın
Bir içerik yönetim sistemine, e-posta şablonuna, statik siteye ya da belge sayfasına taşıyın.
Neden bu araç
CommonMark artı GitHub uzantıları
Tablolar, üstü çizili, görev listeleri ve otomatik bağlantılar — Markdown’ın çoğunun gerçekte yazıldığı lehçe.
Önizleme ve işaretleme birlikte
İşlenmiş sonucu ve ürettiği HTML’i görün, böylece ikisini de yapıştırmadan önce denetleyin.
Anlamsal çıktı
Biçimlendirilmiş div duvarı yerine gerçek başlıklar, listeler ve tablolar; böylece işaretleme bir şey ifade eder.
Satır sonu davranışını siz seçin
Tek bir satır sonunun kırılma mı olacağına yoksa paragrafa mı katılacağına karar verin — insanların hep istediği ayar.
Hiçbir şey yüklenmez
Dönüştürme tarayıcınızda olur — yayımlanmamış belgeler hiçbir sunucuya ulaşmaz.
Ücretsiz, hesapsız
Kayıt yok, filigran yok, ne kadar dönüştüreceğinize dair sınır yok.
Markdown diye tek bir şey yoktur — birkaç tane vardır
Sürprizlerin çoğunun ardındaki olgu budur. 2004’teki özgün tanım kısa bir belge ve bir Perl betiğiydi; biçimsel bir dilbilgisi ve sınama takımı yoktu, bu da pek çok şeyi gerçekten tanımsız bıraktı. Uygulamalar boşlukları farklı doldurdu, dolayısıyla aynı girdi hangisini kullandığınıza göre farklı çıktı üretti. CommonMark tam da bunu düzeltmek için var: uygunluk takımı olan kesin bir belirtim ve artık ciddi ayrıştırıcıların çoğu onu hedefliyor. Ama CommonMark, insanların sürekli kullandığı şeyleri bilerek dışarıda bırakır; bu yüzden GitHub Flavored Markdown üstüne tabloları, üstü çiziliyi, görev listelerini ve otomatik bağlantıları ekler. Pratik sonuç: tablo içeren bir belge GitHub’da tablo olarak, katı bir CommonMark ayrıştırıcısında ise düz boru karakterleri olarak görünür. Markdown’ınızı suçlamadan önce hedefin hangi lehçeyi konuştuğunu denetleyin.
Tek bir satır sonu satır kırılması değildir
Bu, geri kalan her şeyin toplamından daha çok insanı şaşırtan davranıştır ve bir hata değildir. Markdown ardışık satırları tek paragraf sayar ve aralarına boşluk koyarak birleştirir; çünkü biçim, bir paragrafı metin düzenleyicide elle sarmanın çıktıyı değiştirmemesi için tasarlanmıştı. Ayrı satırlara yazılmış iki adres satırı bu yüzden tek satırda çıkar. Klasik çare satır sonuna iki boşluk koymaktır; bu gerçekten berbat bir gelenektir, çünkü görünmezdir ve düzenleyiciler onu siler. Satır sonundaki ters eğik çizgi CommonMark’ta aynı işi görür ve en azından görünürdür. Boş bir satır ise yeni bir paragraf başlatır ki genellikle insanların gerçekten istediği budur. GitHub yorum alanlarında varsayılanı değiştirdi ve orada satır sonu bir kırılma oldu; aynı metnin bir konu başlığında ve bir README’de farklı davranmasının nedeni budur.
Markdown HTML’i bilerek geçirir ve bu bir güvenlik kararıdır
Markdown içindeki ham HTML bir gözden kaçırma değil bir özelliktir: özgün tasarım, Markdown gereksiniminizi ifade edemediğinde HTML’e ineceğinizi varsaydı. Bu da bir Markdown-HTML dönüştürücüsünün, belirtim gereği, bir `<script>` etiketini doğrudan çıktısına geçirmesine izin verildiği anlamına gelir. Kendi belgeleriniz için istediğiniz tam olarak budur. Bir kullanıcının gönderdiği herhangi bir şey için — bir yorum, bir değerlendirme, bir profil tanıtımı, bir destek talebi — bu, olmayı bekleyen saklanmış bir siteler arası betik çalıştırma açığıdır ve dönüştürme adımı onun inşa edildiği yerdir. Taşınmaya değer kural basittir: güvenilen Markdown’ı işlemek güvenlidir, güvenilmeyen Markdown’ı işlemek sonradan ortaya çıkan HTML’in bir izin listesine karşı temizlenmesini gerektirir. Kullanıcı girdisini güvenli kılması için asla Markdown ayrıştırıcısının kendisine güvenmeyin, çünkü o bunun için tasarlanmadı.
Markdown’ın bilerek yapamadıkları
Markdown düzyazı için bir biçimlendirme dilidir, bir yerleşim dili değil, ve sınırları eksik özellikler değil kasıtlıdır. Bir öğeye sınıf ya da kimlik koymak için sözdizimi yoktur, bir görselin genişliğini ayarlamanın yolu yoktur, herhangi türden bir öznitelik eklemek yoktur. Tablo hizalaması tek istisnadır ve o bile sola, sağa ve ortaya sınırlıdır. Bunlardan birine ihtiyaç duyduğunuzda Markdown içindeki yanıt satır içi HTML yazmaktır — işe yarar ve taşınabilir alt kümeden anında çıkar, çünkü o parça HTML’i temizleyen bir bağlamda görünmez. Biçimin kalbindeki ödünleşim budur: düz metin olarak okunur kalmasının nedeni tam da büyümeyi reddetmesidir. Kendinizi Markdown’dan çok HTML yazarken bulursanız, belge biçmi aşmış demektir.
Çıktının nereye gittiği neyi tutmanız gerektiğini değiştirir
Çıkan HTML bilerek çıplaktır — başlıklar, paragraflar, listeler ve bağlantılar; sarmalayıcı div ve sınıf yok — çünkü bir stil sayfasını temizce devralan budur. Denetlediğiniz bir sayfa için bu tam olarak doğrudur. E-posta planlanmaya değer istisnadır: çoğu istemci `<style>` bloklarını söker ve harici stil sayfalarını yok sayar, dolayısıyla bir gelen kutusunda tasarlanmış görünmesi gereken her şeyin CSS’i dönüştürmeden sonra öğe öğe satır içine alınmalıdır. İçerik yönetim sistemi öteki durumdur: pek çok düzenleyici yapıştırılan HTML’i temizler ve öznitelikleri sessizce düşürür, bu yüzden görsel görünüme değil kaynak görünümüne yapıştırın. Ve hedef doğrudan Markdown kabul ediyorsa — çoğu statik site üreteci, wiki ve belge platformu gibi — önce dönüştürmek geriye bir adımdır, çünkü düzenlemesi daha kolay olan kaynağı yitirirsiniz.
Bu tür metinde yerel dönüştürme neden önemlidir
Bir Markdown düzenleyicide genellikle ne bulunduğunu düşünün. Bir sistemin nasıl çalıştığını anlatan iç belgeler. Henüz herkese açık olmayan bir depo için bir README. Yayımdan önceki bir blog yazısı. İçinde adlar geçen toplantı notları. Sunucu adları veren ve bir şey bozulduğunda ne yapılacağını anlatan bir çalıştırma kılavuzu. Markdown, insanların iç bilgiyi yazdığı biçimdir; bu da yapıştırılan bir belgeyi bir kurumun nasıl işlediğinin betimi kılar — dramatik anlamda nadiren gizli, ama bir yabancıya vermeyi seçeceğiniz bir şey de nadiren. Barındırılan bir dönüştürücü bunların hepsini alır. Bu araç sayfada dönüştürür ve hiçbir şey iletmez; bunu geliştirici araçlarının Ağ sekmesinde doğrulayabilirsiniz.
Kaçınılması gereken yaygın hatalar
- Tek bir satır sonunun satırı kıracağını beklemek. Markdown ardışık satırları tasarım gereği tek paragrafta birleştirir — yeni paragraf için boş satır, sert kırılma için satır sonunda ters eğik çizgi kullanın.
- Kullanıcının gönderdiği Markdown’ı çıktı temizlenmeden işlemek. Ham HTML belirtim gereği geçer, dolayısıyla bir yorumdaki `<script>` etiketi dönüştürme adımında saklanmış bir betik açığına dönüşür.
- Her ayrıştırıcının aynı lehçeyi konuştuğunu varsaymak. Tablolar, görev listeleri ve üstü çizili CommonMark değil GitHub uzantısıdır; bir tablo başka yerde düz boru karakterleri olarak görünebilir.
- Sınıf ya da görsel genişliği için satır içi HTML’e uzanmak. İşe yarar ve taşınabilir alt kümeden çıkar — o parça HTML’in söküldüğü her yerde yok olur.
- Hedefin doğrudan kabul edeceği Markdown’ı dönüştürmek. Statik site üreteçleri, wiki’ler ve belge platformları genellikle Markdown alır; önce dönüştürmek düzenlemesi kolay kaynağı yitirir.
Karşılaştırma
| Ölçüt | Bu araç | Çevrimiçi dönüştürücüler | Bir statik site üreteci |
|---|---|---|---|
| İçerik sunucuya gönderilir | Asla | Genellikle evet | Hayır |
| GitHub uzantıları desteklenir | Evet | Değişir | Genellikle |
| Çıktı CSS’inizi devralır | Evet | Değişir | Evet |
| Kurulum gerekir | Yok | Yok | Kur ve yapılandır |
| Hesap veya kayıt | Gerekmez | Sık sık istenir | Gerekmez |
| Fiyat | Ücretsiz | Ücretsiz / ücretli paket | Ücretsiz |
Özellikler
Tablolar ve görev listeleri
Katı CommonMark’ta olmayan ama gerçek Markdown’ın çoğunda bulunan GitHub uzantıları.
Canlı önizleme
İşlenmiş çıktı siz yazarken güncellenir, böylece hatalar anında görünür.
Çitli kod blokları
Üç ters tırnaklı bloklar, dili bir sınıf olarak kaydedilmiş `pre` ve `code` olur.
Temiz, asgari işaretleme
Sarmalayıcı div yok, üretilmiş sınıf adı yok, satır içi stil yok — HTML sizin stil sayfanızı devralır.
Baştan sona Unicode
Türkçe, Arapça ve şapkalı metin her iki yönde de değişmeden geçer.
Uzun belgeleri kaldırır
Bütün kılavuzlar yükleme ya da boyut sınırı olmadan dönüşür.
Kurulum gerekmez
Statik site üreteci, çalışma ortamı ya da bağımlılık yok — web sayfasında çalışır.
Arapça ve RTL uyumlu
Sağdan sola Arapça dahil sekiz dilde tam arayüz.
Varsayılan olarak güvenli
HTTPS üzerinden sunulur, içerik izleme ve üçüncü tarafa yükleme yoktur.
Kimler kullanıyor
Teknik yazarlar
Belgeleri, HTML kabul edip Markdown kabul etmeyen bir içerik yönetim sistemine sokmak.
Geliştiriciler
Bir README’nin depoya gönderilmeden önce nasıl görüneceğini denetlemek.
İçerik editörleri
Bir yazarın Markdown taslağını, yayın sisteminin alabileceği işaretlemeye çevirmek.
Bülten yazarları
Düz Markdown’la yazılmış bir taslaktan bir e-postanın HTML gövdesini üretmek.
Sıkça Sorulan Sorular
Hayır. Her şey tarayıcınızda yerel çalışır — metniniz asla yüklenmez, saklanmaz veya paylaşılmaz.
Evet — tamamen ücretsiz, hesap ve sınır yok.