মূল কনটেন্টে যান
LibraTool logoLibraTool

বিনামূল্যে Markdown এডিটর

রিয়েল টাইমে Markdown লিখুন ও প্রিভিউ করুন। শিরোনাম, বোল্ড, ইটালিক, কোড ব্লক, টেবিল এবং তালিকা সমর্থন করে।

একবার লোড হলে অফলাইনেও কাজ করে
92 শব্দ · 548 অক্ষর
Markdown
পূর্বদর্শন
<h2 class="text-2xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">মার্কডাউন এডিটরে স্বাগতম</h2> <p class="my-3 text-slate-700 dark:text-slate-300 leading-relaxed">বাম দিকে <strong>মার্কডাউন</strong> লিখুন, ডান দিকে লাইভ পূর্বরূপ দেখুন।</p> <h3 class="text-xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">বৈশিষ্ট্য</h3> <ul class="list-disc list-inside my-3 space-y-0.5 text-slate-700 dark:text-slate-300"><li class="my-0.5"><strong>বোল্ড</strong>, <em>ইতালিক</em> এবং <del>স্ট্রাইকথ্রু</del></li><li class="my-0.5"><code class="bg-slate-100 dark:bg-slate-800 text-pink-600 dark:text-pink-400 rounded px-1 py-0.5 text-[0.85em] font-mono">ইনলাইন কোড</code> এবং ফেন্সড কোড ব্লক</li><li class="my-0.5"><a href="https://libratool.com" target="_blank" rel="noopener noreferrer" class="text-teal-600 dark:text-teal-400 underline underline-offset-2">লিংক</a></li><li class="my-0.5">তালিকা, ব্লক উদ্ধৃতি, টেবিল এবং আরও অনেক কিছু</li></ul> <h3 class="text-xl font-bold text-slate-900 dark:text-slate-50 mt-6 mb-2">কোড উদাহরণ</h3> <pre class="bg-slate-900 dark:bg-slate-950 text-slate-100 rounded-lg p-4 overflow-x-auto text-sm font-mono my-4"><code class="language-javascript">function greet(name) { return `Hello, ${name}!`; }</code></pre> <blockquote class="border-l-4 border-teal-400 dark:border-teal-600 pl-4 my-3 text-slate-600 dark:text-slate-400 italic">মার্কডাউন জন গ্রুবার দ্বারা 2004 সালে ওয়েবের জন্য লেখা সহজ করার জন্য তৈরি করা হয়েছিল।</blockquote> <table class="my-4 w-full text-sm border-collapse"><thead><tr><th class="border border-slate-300 dark:border-slate-600 bg-slate-100 dark:bg-slate-800 px-3 py-2 text-left font-semibold">বৈশিষ্ট্য</th><th class="border border-slate-300 dark:border-slate-600 bg-slate-100 dark:bg-slate-800 px-3 py-2 text-left font-semibold">সমর্থিত</th></tr></thead><tbody><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">শিরোনাম</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">তালিকা</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">টেবিল</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr><tr><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">কোড</td><td class="border border-slate-200 dark:border-slate-700 px-3 py-2 text-left">✓</td></tr></tbody></table>
Markdown চিটশিট
# Heading 1H1
**bold**বোল্ড
*italic*ইটালিক
`code`ইনলাইন কোড
- itemবুলেট তালিকা
1. itemসংখ্যাযুক্ত তালিকা
> quoteব্লককোট
[text](url)লিঙ্ক
![alt](url)ইমেজ
---বিভাজক

সাধারণ ব্যবহার

  • Markdown এ API ডকুমেন্টেশন লিখুনMarkdown এ এন্ডপয়েন্ট বর্ণনা, অনুরোধ/প্রতিক্রিয়া উদাহরণ এবং প্যারামিটার টেবিল খসড়া করুন।
  • মার্কডাউন নোট নিনNotion, Obsidian, Bear বা যেকোনো Markdown অ্যাপে পেস্ট করা যায় এমন কাঠামোগত নোট Markdown-এ লিখুন।
  • Markdown এ GitHub README লিখুনলাইভ Markdown রেন্ডারিং সহ আপনার GitHub রিপোজিটরি README খসড়া এবং পূর্বরূপ দিন।
  • প্রযুক্তিগত নথিপত্র লিখুনপ্রকাশনার আগে Markdown এ API ডক উইকি এবং প্রযুক্তিগত নির্দেশিকা লিখুন এবং পূর্বরূপ দিন।
  • Markdown এ ব্লগ পোস্ট লিখুনGhost Jekyll Hugo Hashnode এবং অন্যান্য Markdown-ভিত্তিক প্রকাশনা প্ল্যাটফর্মের জন্য ব্লগ পোস্ট খসড়া করুন।

কিভাবে কাজ করে

প্রিভিউ টুলে সরাসরি তৈরি একটি হাতে লেখা Markdown পার্সার দিয়ে দেখানো হয় — কোনো marked, remark বা বাইরের লাইব্রেরি নেই। এটি ব্রাউজারে উৎস লাইন ধরে ধরে টোকেনাইজ করে, সিনট্যাক্সকে HTML-এ রূপান্তর করে, যা দেখানোর আগে একটি sanitizer দিয়ে যায়।

  1. 1
    লাইন ধরে ধরে টোকেনাইজেশন
    কাস্টম renderMarkdown ফাংশন আপনার উৎসকে নতুন লাইনে ভাগ করে এক ধাপে ঘোরে, অগ্রাধিকার ক্রমে fenced কোড ব্লক, হেডিং (H1–H6), blockquote, ক্রমযুক্ত ও ক্রমহীন তালিকা, GFM টেবিল (কলাম সারিবদ্ধতাসহ), অনুভূমিক রেখা এবং অনুচ্ছেদ মেলায়।
  2. 2
    ইনলাইন সিনট্যাক্স প্রসারণ
    প্রতিটি সংগৃহীত লাইন বা ঘর তারপর inlineMarkdown দিয়ে প্রক্রিয়া হয়, একটি regex প্রতিস্থাপনের শৃঙ্খল যা bold (** ও __), italic (* ও _), bold-italic (***), strikethrough (~~), ইনলাইন কোড (), ছবি (![alt](url)) ও লিংক ([text](url)) সামলায় — ছবি লিংকের আগে সমাধান হয় যাতে ! প্রিফিক্স ভুলভাবে খেয়ে না ফেলে।
  3. 3
    স্যানিটাইজেশন ও দূরবর্তী রিসোর্স ব্লক
    রেন্ডারারের তৈরি কাঁচা HTML একটি sanitizer (sanitize-html) দিয়ে যায়, যা <script>, onerror হ্যান্ডলার ও javascript: href-এর মতো অনিরাপদ ট্যাগ ও অ্যাট্রিবিউট সরায়। দ্বিতীয় ধাপ (neutralizeRemote) ডিফল্টে দূরবর্তী ছবির src মান প্লেসহোল্ডার দিয়ে বদলায়, যাতে আপনি সম্মতি দেওয়ার আগে প্রিভিউ চুপচাপ বাইরের সার্ভারে যোগাযোগ না করে।
  4. 4
    .md বা স্বতন্ত্র .html হিসেবে এক্সপোর্ট
    Markdown কপি বা ডাউনলোড করলে কাঁচা উৎস টেক্সট লেখা হয়। HTML ডাউনলোড স্যানিটাইজ করা আউটপুটকে নিজস্ব ইনলাইন স্টাইলশিটসহ একটি স্বয়ংসম্পূর্ণ ডকুমেন্টে মোড়ে — Tailwind ক্লাস শুধু সাইটের ভেতরে কাজ করে, তাই এক্সপোর্টে এর বদলে সাধারণ CSS নিয়ম থাকে, ফলে ফাইলটি যেকোনো জায়গায় পড়া যায়।

সম্পর্কিত টুলস

সচরাচর জিজ্ঞাসিত প্রশ্নাবলী