Çevrili Kod Blogları
Bir önceki ünitede yer alan Kod Tanımlama dersinde sizlere nasıl kod bloğu eklenebileceğini göstermiştim. Hatırlarsanız, kod bloğu ekleyebilmek için her satırı ya bir tab ya da dört adet boşluk ile girintilememiz gerekiyordu.
Gelişmiş söz diziminde bu kadar kafa karıştırmaya gerek kalmıyor. Kod bloğu olmasını istediğiniz satırların hem üstüne hem de altına üç tane ``` ya da üç tane ~~~ koymanız sorununuzu çözüyor.
Gelin basit bir örnekle inceleyelim ve ne kadar kolay olduğunu görelim:
Markdown
```
let a = 25;
let b = 32;
console.log(a + b);
```
HTML
<pre>
<code>
let a = 25;
let b = 32;
console.log(a + b);
</code>
</pre>
Çıktı
let a = 25;
let b = 32;
console.log(a + b);
Gördüğünüz gibi girinti yapmak zorunda kalmadan, kafanız karışmadan sadece yazınıza odaklanabiliyorsunuz. Şimdi de çok daha güzel bir özellikten bahsedelim:
Kod Dili Belirtmek
Özellikle teknik kitaplar hazırlayanların yazdıkları kodları renklendirmek istediklerini biliyoruz. Bunu yapabilmek için ise ilgili CSS sınıflarının dosyada tanımlanması gerekiyor. E Markdown bu kadar komplike olmaması için tasarlandı. Bunu nasıl yapacağız? Hemen gösterelim:
Markdown
```javascript
const URI = "mongodb://localhost:27017";
mongodb.connect(URI);
```
HTML
<div class="sourceCode" id="cb1"><pre class="sourceCode javascript"><code class="sourceCode javascript"><span id="cb1-1"><a href="#cb1-1" aria-hidden="true" tabindex="-1"></a><span class="kw">const</span> URI <span class="op">=</span> <span class="st">"mongodb://localhost:27017"</span><span class="op">;</span></span>
<span id="cb1-2"><a href="#cb1-2" aria-hidden="true" tabindex="-1"></a>mongodb<span class="op">.</span><span class="fu">connect</span>(URI)<span class="op">;</span></span></code></pre></div>
Çıktı
const URI = "mongodb://localhost:27017";
mongodb.connect(URI);