هل تستعمل الأداة emmet في تطوير موقعك

كم من الوقت تقضي لكتابة أكواد HTML ، الكثير من الأوسمة (Tags) ، ولكنها تبدوا أكثر سهولة إذا كان المحرر الذي تستخدمه لديه القدرة على إتمام و إكمال الأكواد . ولكن تبقى تلك الكتابة تستهلك الكثير من الوقت و الجهد.

ولكن ماذا لو كان المحرر لديه القدرة على التقدم خطوة إضافية على إتمام الكود ، وهي تحويل تعقيدات HTML اللى كود بسيط .

اليوم سوف أقوم بتفديم إداة emmet أو كما كانت تسمى سابقا Zen Coding ، وهي أداة تزيد من سرعة كتابة أكواد HTML و CSS . و هي ببساطة شديدة عبارة عن Plugin في محررات الHTML,CSS و هي تدعم الكثير من المحررات منها:

Sublime Text, Eclipse, TextMate, Coda, Espresso, Chocolat, Komodo Edit, Notepad++, PSPad, CodeMirror, Brackets, NetBeans, Adobe Dreamweaver

لنفهم في البداية طريقة العمل :

• أنت تكتب المخطط باستخدام طريقة معينة سنتعلمها لاحقاً .

• ثم تضغط علي مفتاح TAB .

• ثم يتم تحويل المخطط إلي كود HTML كامل .

لنر مثال على كود مكتوب بواسطة emmet

#menu>ul>li*3>a

بعد ضغط علي مفتاح TAB

سيظهر الكود التالي

<div id="menu">
    <ul>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
        <li><a href=""></a></li>
    </ul>
</div>

الموقع الخاص بالأداة

http://emmet.io

مصادر لتعرف على الأداة

http://docs.emmet.io http://docs.emmet.io

/cheat-sheet

إذا كنت تستعمل هذه الأداة أخبرنا عن تجربتك معها