Kuika’nın MD Viewer elementi, Markdown formatında yazılmış içerikleri uygulama arayüzünde biçimlendirilmiş ve okunabilir bir şekilde görüntülemek için kullanılır. Markdown; başlıklar, kalın–italik yazı stilleri, kod blokları, alıntılar, numaralı ve madde işaretli listeler gibi pek çok metinsel formatı hızlıca oluşturmayı mümkün kılan pratik bir işaretleme dilidir.
MD Viewer elementi, web ve mobil uygulamalarda desteklenmektedir.
1.1. Sık Kullanım Senaryoları
Dokümantasyon ve kullanım kılavuzları göstermek: Teknik dökümanlar, API açıklamaları, modül tanıtımları veya uygulama içi yardım içeriklerini formatlı bir şekilde sunmak için kullanılabilir.
Blog veya duyuru içeriklerini listelemek: Web uygulamalarında Markdown ile hazırlanmış blog yazıları, haber duyuruları veya bilgilendirme metinleri kolayca görüntülenebilir.
Release notes (sürüm notları) yayınlamak: Versiyon değişiklikleri, yeni özellikler ve hata düzeltmelerini içeren metinler Markdown formatıyla yazılabilir.
Eğitim materyalleri ve içerik yönetim sistemi (CMS) çıktıları göstermek: Eğitim platformları, e-öğrenme içerikleri veya modül açıklamaları için düzenli bir metin sunumu sağlar.
Sıkça Sorulan Sorular (FAQ) bölümleri: Liste ve başlık yapıları sayesinde soru–cevap formatlarını düzenli bir şekilde gösterebilirsiniz.
Markdown formatında gelen dinamik içerikleri görüntülemek: REST API, veri tabanı veya action üzerinden gelen Markdown metinleri kullanıcıya zengin formatlı şekilde gösterilebilir.
Kod örnekleri ve teknik anlatımlar: Kod blokları, alıntılar ve highlight alanları içeren teknik içerikler için uygundur.
2. Temel Özellikler
Markdown desteği: Başlıklar, listeler, kalın/italik yazılar, bağlantılar, tablolar, alıntılar ve kod blokları gibi tüm temel Markdown sözdizimini destekler.
Statik veya dinamik içerik gösterme: MD Viewer içine yazılan statik Markdown metinler görüntülenebileceği gibi, REST API, Managed DB veya Action çıktısından gelen dinamik Markdown metinleri de gösterilebilir.
2.1. MD Viewer Elementi Özellikleri
MD Viewer elementinin özelliklerini, sağ kenardaki Properties panelinden yapılandırabilirsiniz.
Value: MD Viewer elementi için statik bir metin yazabileceğiniz gibi, Symbol Picker kullanarak bir Input elementinin içeriğini veya bir aksiyon sonucunda elde edilen değeri dinamik olarak görüntüleyebilirsiniz.
Theme: MD Viewer elementi Markdown formatını desteklediği için metinlerinize başlıklar, listeler, kalın/italik yazılar gibi çeşitli biçimlendirmeler ekleyebilirsiniz.
MD Viewer elementi, Markdown formatını desteklediği için metinlerinize başlıklar, listeler, kalın ve italik yazılar gibi çeşitli biçimlendirmeler ekleyebilirsiniz. Bu özellik, içeriklerinizi daha düzenli ve okunabilir hale getirir.
2.2. MD Viewer Elementine Eklenebilen Aksiyonlar
MD Viewer elementi, içerik değişikliklerini algılayabilen tek bir tetikleyici destekler: onChange. Bu tetikleyici, elementin içeriği dinamik olarak güncellendiğinde aksiyon çalıştırmak için kullanılır. Kullanıcı doğrudan MD Viewer üzerinde düzenleme yapmadığından, tetikleyici yalnızca içerik değiştiğinde devreye girer.
onChange
MD Viewer’ın içeriği değiştiğinde çalışan tetikleyicidir.
Kullanım senaryoları:
Başka bir elementten gelen dinamik Markdown metni değiştiğinde güncelleme işlemlerinin tetiklenmesi
Bu bölümde MD Viewer elementinin uçtan uca dinamik kullanımını, örnek bir senaryo üzerinden ele alacağız.
Senaryo: Dinamik Değerlendirme / Dokümantasyon İçeriği Gösterimi
Bir proje veya içerik yönetimi uygulamasında, kullanıcıya gösterilen açıklama, değerlendirme veya dokümantasyon içerikleri statik değildir. İçerikler veritabanından veya servisten dinamik olarak alınır ve kullanıcıya düzenli bir formatla sunulur.
Bu senaryoda, proje değerlendirme içeriği Markdown formatında saklanır ve MD Viewer elementi ile ekranda gösterilir.
Kullanıcı ilgili ekrana girdiğinde:
İçerik backend’den dinamik olarak alınır,
Markdown formatı korunur,
Başlıklar, listeler ve vurgular otomatik olarak render edilir.
Bu yapı sayesinde içerikler güncellenebilir, yönetilebilir ve okunabilir şekilde sunulur.
Senaryoda:
Markdown içerik veri kaynağından dinamik olarak alınır.
Sayfa açıldığında ilgili aksiyon tetiklenir.
MD Viewer, aksiyon çıktısını doğrudan görüntüler.
Aynı yapı farklı sayfalarda tekrar kullanılabilir.
Adım 1 - Dinamik Kullanım için Gerekli Aksiyonları Tanımlama
Arayüzde verileri göstermek için:
Bir aksiyon tanımlamanız gerekir.
Datasources modülü içerisinde Actions > New SQL Action sekmesinden yeni aksiyon ekleyin.
Örnek Verileri Ekleyen Aksiyon (GetUserInfo):
SELECT
N'
# Proje Değerlendirmesi
Bu doküman, proje kapsamındaki mevcut durumun özet değerlendirmesini sunar.
## Genel Durum
- ✅ Temel fonksiyonlar tamamlandı
- ⏳ Entegrasyon süreci devam ediyor
- ⚠️ Performans testleri planlanıyor
## Teknik Notlar
- API yapısı **ölçeklenebilir** tasarlandı
- Hata yönetimi merkezi loglama ile sağlandı
- Kod yapısı dokümantasyon ile desteklendi
> **Not:** Süreç ilerledikçe bu içerik dinamik olarak güncellenebilir.
' AS MarkdownContent;
Sol panelden Elements > Display > MD Viewer elementini sayfaya sürükleyip bırakın.
MD Viewer içerisinde gösterilecek veriyi MDViewer > Properties > Value > Action Results > GetMDContent > First > MarkdownContent tanımlayın.
Görünüm teması, tasarım tercihlerinize göre özelleştirilebilir. Bu senaryoda MDViewer > Properties > Theme alanı Dark olarak ayarlanmıştır.
Preview
Uygulama test edildiğinde, proje değerlendirme içeriğinin MD Viewer elementi üzerinde karanlık tema ile düzenli ve okunabilir bir biçimde görüntülendiği görülür. Başlıklar, alt başlıklar, madde işaretleri ve vurgular Markdown formatı korunarak otomatik şekilde render edilir. Kullanıcı ekrana girdiğinde proje durumu, teknik notlar ve uyarı bilgileri tek bir dokümantasyon akışı içerisinde sunulur ve içerik güncellendiğinde ekran üzerinde anlık olarak yansıtılır.
4. Ortak Özellikler (Properties)
MD Viewer elementi üzerinde yer alan bazı alanlar tüm UI elementlerinde ortak olarak kullanılır. Bu nedenle, aşağıdaki özelliklerin detaylı açıklamaları ilgili genel kılavuz sayfalarında yer almaktadır:
Markdown yapısını temiz ve düzenli tutun. Başlıklar, listeler, kalın/italik metinler gibi yapıları doğru kullanmak MD Viewer çıktısının daha okunabilir olmasını sağlar.
Dinamik içerikte onChange tetikleyicisini doğru yönetin. MD Viewer içeriği başka bir aksiyonla güncelleniyorsa onChange tetikleyicisinin gereksiz yere sürekli çalışmasını önlemek için kontrol mekanizması kullanın.
6. Kısıtlamalar
Aksiyon tetiklemesi sınırlıdır. MD Viewer yalnızca onChange tetikleyicisini destekler; onClick veya benzeri etkileşim tetikleyicileri yoktur.
