تمت الترجمة بواسطة Ahmed Gamal
هناك طريقتان لتنظيم الكود باستخدام لغة Markdown. يمكنك إدراج الكود ضمن النص المكتوب دون فصله في قسم خاص، وهو ما يسمى بالـ (Inline Code) بأن تُدرج سطر الكود بين اثنتين من الفاصلة العلوية المائلة (Backticks) (`)، أو يمكنك فصل الكود في قسم خاص به بعيدًا عن النص الرئيسي وهو ما يسمى بالـ (Code Block)، والذي ستقوم بعض البرامج المستخدمة لعرض ملفات Markdown بتطبيق تنسيقات الألوان (Highlighting) على الكود كما يتوافق مع لغة البرمجة المستخدمة فيه.
إدراج الكود ضمن النص الأساسي Inline Code
بإمكانك إدراج الكود ضمن النص الأساسي (Inline Code formatting) لإبراز أمر بسيط أو مُقتطع صغير من الكود ضمن السطر الذي تقوم بكتابته.
على سبيل المثال، إذا أردت أن تذكر دالة ()Array.prototype.map
من لغة JavaScript يمكنك إدراجها بالطريقة السابقة. وباستخدام هذه الطريقة، من البيًن أن المذكور بين العلامتين هو كود وليس كلامًا ضمن النص المكتوب. بإمكانك أيضًا أن تستخدم هذه الطريقة لإيضاح أمرٍ خاصٍ بالـ terminal كالتالي yarn install
.
لإدراج الكود ضمن النص بهذه الطريقة، نقوم ببساطة بوضع جزء الكود الذي نريد تنسيقه بين علامات الفاصلة العلوية المائلة (Backticks). بإمكانك إيجاد هذه العلامات في لوحات المفاتيح التي تتبع التنسيق الطبيعي للولايات المتحدة والمسمى ب (QWERTY Layout) على يسار رقم 1، أو أعلى زر Tab مباشرةً. المزيد من المعلومات التوضيحية حول مكان العلامات في التنسيق العالمى للوحات المفاتيح مُدرجة بأسفل المقال.
مثال على ما قلناه، إذا قمت بكتابة `()Array.prototype.map` في ملف Markdown، سيتم عرضه بهذا الشكل ()Array.prototype.map
.
تنسيق الكود في أقسام منفصلة Code Blocks
إذا أردت مساحةً إضافيةً لكتابة كميةٍ أكبر من الكود المُفَصّل، سيكون من الأفضل أن تقوم بإدراج الكود بداخل Code Block. عند استخدام الـ Code Blocks فإنها تسمح لك أن تقوم بكتابة أسطر متعددة وليست مقتصرةً على سطر واحد فقط، بعكس الـ Inline Code، وستقوم لغة Markdown بعرضه في صندوق منفصل خاص بالكود وبطريقة الكتابة الخاصة بالكود البرمجي.
لتحقيق هذا، يمكنك بدء الكود بثلاثةٍ من علامات الفاصلة العلوية المائلة (Backticks) في سطرٍ منفصل. هذا يقوم بإعلام Markdown أنك تقوم بكتابة Code Block، وبالمثل فإنك في حاجة لأن تقوم بإعلام Markdown بأنك انتهيت من كتابة الكود بنفس الطريقة، باستخدام سطر به ثلاثة من العلامات. فعلى سبيل المثال:
```
var add2 = function(number){
return number + 2;
}
```
سيتم عرضه بهذه الطريقة باستخدام Markdown:
var add2 = function(number) {
return number + 2;
}
استخدام تنسيقات الألوان الخاصة باللغات البرمجية Syntax highlighting
بالرغم من أنها ميزة غير مدعومة في الأصل من قِبل Markdown، الكثير من محركات Markdown، بما في ذلك المُستخدم بواسطة GitHub، يقومون بدعم تنسيقات الألوان لللغات. وهذا معناه أنك عندما تقوم بإخبار Markdown عن اللغة التي تقوم باستخدامها داخل الCode Block، ستقوم بإضافة ألوان إلى الكود كما تفعل بيئة التطوير(IDE).
بإمكانك استخدام هذه الخاصية بإضافة اسم اللغة في نفس السطر الأول مع علامات الفاصلة العلوية . في المثال السابق، بدلًا من كتابة ``` في السطر الأول بإمكانك كتابتها بهذه الطريقة ```js، وعندها ستطبق Markdown تنسيقات الألوان الخاصة بلغة JavaScript على الكود الذي تقوم بكتابته داخل الـ Code Block.
var add2 = function(number) {
return number + 2;
}
تنسيقات الألوان بإمكانك أن تطبقها على ما هو أكثر من لغة JavaScript. على سبيل المثال، بإمكانك تطبيقها على html بكتابة ```html:
<div class="row">
<div class="col-md-6 col-md-offset-3">
<h1>Hello World</h1>
</div>
</div>
أو ```ruby:
"Hello World".split('').each do |letter|
puts letter
end
أو ```Python:
a, b = 0, 1
while b < 10:
print(b)
a, b = a, a + b
فقط عليك أن تتذكر أنه ليست كل محركات Markdown ستقوم بتطبيق تنسيقات الألوان على الكود.
علامات الفاصلة العلوية المائلة(Backticks) في لوحات المفاتيح التي تتبع التنسيق العالمي
مكان تواجد الفاصلة العلوية من الممكن أن يختلف من لوحة مفاتيح إلى أُخرى، وإذا لم تكن مُستخدِمًا التنسيق المتبع للولايات المتحدة (QWERTY)، فإنك ستجد نوعًا من الصعوبة في إيجادها. يُمكنك أن تجد دليلًا مفيدًا عن طريقة البحث عن مفتاح علامة الفاصلة العلوية هنا، والذي قمنا بجمعها هنا:
تنسيقات QWERTY و QWERTZ:
تنسيق AZERTY: