أفضل 10 إضافات لمحرر الأكواد Atom تفيد مطورين الويب

Atom هو واحد من أسرع محررات البحث نضجاً ونمواً، بالرغم من أنه خسر السنة الماضية مقابل SUBLIME TEXT إلا أن الكثر من الأخطاء لم تعد موجودة الأن : 

• وصول النسخة 1.0.
• تم تحسن السرعة بشكل كبير جداً.
• بقي مجاني ولكن أفضل من الكثير من العروض المدفوعة.
• سهل التثبيت على لينكس،وندوز وماك.

كما أن عدد الإضافات الخاصة بالمحرر إذدادت بأضعاف مضاعفة ، مع أكثر من 750 ثيم و 2400 إضافة لهذا الوقت من الكتابة، ويمكن لـ ATOM التمدد بإستخدام تقنيات ويب أكثر ، إذا كنت تعمل على Node.js أو مشاريع front-end ، محرر Atom إختيار عظيم جداً .

تثبيت الحزم عملية سهلة جداً

1. قم بفتح تاب + INSTALL من الإعدادات SETTINGS ثم إبحث عن الحزمة عن طريق الإسم وقم بتثبيتها 
2.  من خلال سطر الأوامر , بكتابة الأمر <apm install <package-name 

وهنا العديد من الإضافات المفيدة جداً لجعل المحرر مكاناً أفضل : 

1.  OPEN-RECENT 

 مثل SUBLIME تمكنك هذه الإضافة هذه الإضافة من الدخول إلى أخر المجلدات والملفات التي تم فتحها وإستخدامها على المحرر.




  https://atom.io/packages/open-recent


  2. TODO-show

تمكنك هذه الإضافة من عمل قائمة مهام للعمل وربط ملفاته بكلمات تدل على المهام التي ترغب بالعمل عليها وتنفذيها على كل ملف أو المشروع بشكل عام ، مثل TODO ، FIXME ,CHANGED كما يمكنك إضافة كلمات ودلالياتك الخاصة .

https://atom.io/packages/todo-show

 3.Minimap

Minimap هي واحدة من أكثر إضافات Atom الشعبية، تقوم إظهار عرض موجز للكود تمكنك من الوصول السريع الى ما تريد .

https://atom.io/packages/minimap

  4. Highlight selected

عند قيامك بتحديد كلمة أو متغير في المحرر , تمكنك هذه الإضافة من تحديد جميع اللكلمات والمتغيرات المشابهة للكلمة التي قمت بحديدها تماماً كما في sublime و notepad++ .

https://atom.io/packages/highlight-selected

  5. Auto-close html

تقوم هذه الإضافة من الغلق التلقائي لتاجات الـ HTML.

https://atom.io/packages/autoclose-html

 6.PIGMENTS

 إضافة تقوم بعمل تلوين تلقائي للـ HEX الخاصة بالألوان المستخدمة في التصميم لتمكنك من الوصول السريع والتمييز بينها

https://atom.io/packages/pigments

7. EMMET

إضافة تمكنك من كتابة أكواد HTML بسرعة فائقة وإختصار شديد.

 مثلاً عند كتابة الكواد التالي : 

div#page>p.top+ul#nav>li*5>a

سيتم إستبداله بهذا الكود : 

<div id="page">
  <p class="top"></p>
  <ul id="nav">
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
    <li><a href=""></a></li>
  </ul>
</div>

 وبهذه الطريقة سيقوم بإختصار الكثير عليك.

8.Beautify 

تجعل من كودك أكثر إتقاناً وأكثر قابلية للقراءة متوافقة مع العديد من لغات البرمجة.

 HTML,CSS,PHP,PYTHON,RUBY.... بعد القيام بتثبيت الإضافة , قم بتشغيلها من خلال 

 Packages > Atom Beautify > Beautify 

 9. Color picker

تمكنك من إختيار الألوان بواجهة بصرية , يعمل في ملفات الأوراق النمطية الخاصة بالتصميم css ، وأيضاً تمكنك من التحويل بين صيغ الألوان .

https://atom.io/packages/color-picker

   10. File icon 

تمكنك من إضافة الأيقونات إلى الملفات التي تعمل عليها بناءاً على محتواها , وتظهر لك عند فتح الملف التاب أو في شجرة العرض 

https://atom.io/packages/file-icons