Atom, редактор коду від Github, зростає з кожним днем. Розробники віддають перевагу цьому редактору коду, тому що він легкий, має низьку криву навчання та його можна розширити різними корисними пакетами Atom.

Спочатку Atom використовувався як внутрішній інструмент для Github, але пізніше він був випущений як інструмент з відкритим кодом для широкої громадськості. Спільнота швидко відреагувала, і тепер вона може похвалитися процвітаючою екосистемою користувачів і учасників.

Будучи готовим міжплатформним редактором, Atom працює на OS X, Windows і Linux. Він має інтелектуальне автозавершення, корисне для тих, хто хоче швидко писати чистий код, і має зручний файловий браузер, де можна швидко відкривати та додавати файли.

Якщо ви прагнете стати досвідченим користувачем Atom, ось список найкращих пакетів Atom, які підвищать вашу продуктивність і значно спростять кодування.

Продовжуйте читати більше про цю тему в цій статті, створеній нашою командою wpDataTables, плагіна WP №1 для створення таблиць і діаграм.

Дізнайтеся, які пакети Atom варто використовувати і чому.

Найкращі пакети Atom для завершення налаштування програмування

Деякі кажуть, що Atom є найкращим редактором загального коду на ринку. Його, звичайно, можна порівняти з такими, як Sublime Text і Notepad++, з власними перевагами. Редактор коду наповнений різноманітними функціями, які покращують кодування, серед яких слід згадати:

Він кросплатформний — незалежно від того, яку ОС ви використовуєте, Atom просто працює
Він має вбудований менеджер пакетів — якщо ви хочете встановити найкращі пакети Atom, вам не доведеться керувати ними
Функція розумного автозавершення — за допомогою цієї функції ви можете писати код набагато швидше
Пошук у файловій системі — попрощайтеся з надто довгим переглядом файлів, оскільки ви можете робити все це в одному вікні
Кілька панелей — ви можете розділити інтерфейс Atom на кілька панелей
Простота. Найбільшою перевагою Atom є те, що ним дуже просто користуватися

Як ви бачите, Atom уже оснащено всім необхідним для програмування. Для більш спеціалізованих потреб ви можете звернутися до пакетів, наданих спільнотою, які будуть пояснені в наступному розділі.

Які найкращі пакети Atom і навіщо вони нам потрібні?

Пакети Atom — це зовнішні програмні програми та фрагменти коду, які додають додаткові функції до основного продукту, таким чином розширюючи його можливості. У Atom пакет також іноді називають «плагіном» або «розширенням».

Завдяки додаванню пакетів Atom до основної програми Atom стає набагато ефективнішим і допомагає робити більше з меншими зусиллями. Усі користувачі можуть самостійно вибирати, які пакети Atom використовувати.

Завантажувати та інсталювати пакети легко, і вони можуть значно покращити роботу основної програми. Однак багато з них можуть не стосуватися вашого робочого процесу чи мов, з якими ви працюєте, тому вам слід установлювати лише найкращі пакети Atom.

Але спочатку давайте розглянемо, як встановити пакет Atom.

Як встановити пакети Atom

Встановлюючи свій перший пакет Atom, краще уважно прочитати кроки. Швидше за все, ви вивчите їх напам’ять і вам не доведеться кожного разу використовувати цей список. Після того, як ви вибрали найкращі для себе пакети Atom, ось два способи їх встановлення:

Натисніть Файл > Параметри. Відкриється вікно налаштувань. Тут натисніть «Встановити» та введіть назву пакета, який ви плануєте встановити. Комбінація клавіш для перегляду параметрів — ctrl + ,(ctrl і кома) на ПК та cmd + на Mac.
Таким же чином можна використовувати палітру команд. Щоб відкрити його, натисніть ctrl+Shift+P на ПК або cmd+Shift+P на Mac. Введіть тут «встановити пакети». Потім ви можете використовувати перегляд налаштувань, як зазначено вище.

Деякі пакети включені в Atom за замовчуванням. Вони називаються основними пакетами, і їх можна вимкнути. Однак не рекомендується вимикати їх, оскільки вони впливають на загальну поведінку редактора. Інші пакунки, які ви встановите, будуть перераховані в розділі Пакети спільноти.

Список найкращих пакетів Atom для негайного встановлення

Atom є універсальним, і було б шкода не розширити його новими функціями лише за кілька клацань.

Тим не менш, існує понад 8000 пакетів, і прийняти рішення може бути дуже важко, якщо ви точно не знаєте, чого хочете.

Щоб допомогти вам у пошуку, перегляньте наш список найкращих пакетів Atom нижче:

Еммет

Emmet — один із найкращих пакетів Atom, оскільки він універсально корисний багатьма мовами.

Це інструмент створення фрагментів коду, який допомагає розробникам інтерфейсу швидко створювати HTML і CSS, а також його можна використовувати для створення спеціальних фрагментів коду для будь-чого іншого. Для цього Еммет використовує скорочення, які перетворюються на довші рядки тексту.

Запитайте Стека

Жодному розробнику не зручно перемикатися з браузера на редактор і навпаки на цілий день. Ask Stack Overflow — це пакет, який дозволяє здійснювати пошук у Stack Overflow і отримувати зразки коду безпосередньо в Atom, не шукаючи відповідей самостійно.

git-blame

Ще один із найкращих пакетів Atom, git-blame, дозволяє перемикати анотації в редакторі Atom. Щоб зробити це, вам просто потрібно натиснути ctrl + B або клацнути правою кнопкою миші на вашому файлі та вибрати Git Blame.

Переконайтеся, що ви робите це в правильному файлі; інакше ви можете перемкнути неправильний елемент або згорнути папки на бічній панелі у вигляді дерева.

Лінтер

Це пакет, який сам по собі не робить багато, але він забезпечує основу, яку ви можете використовувати в Atom, щоб швидше додавати плагіни linter. Він підтримує більшість мов і працює з HTML, HAML, JSON, CSS, SCSS, Java тощо.

У Linter також є плагіни для внутрішніх мов. Повний список розміщено на домашній сторінці пакета.

Загалом лінтери використовуються для покращення якості коду та зменшення кількості помилок.

git-машина часу

Іноді візуальне уявлення про всі ваші минулі дії прямо перед вами може бути дуже корисним. Ось чому git-time-machine заслуговує бути в списку найкращих пакетів Atom на ринку.

Він дозволяє вам переглядати візуальний сюжет ваших файлів, а також є інтерактивним. Ви можете натиснути на часовий графік і переглянути коміти за певний часовий діапазон.

Atom Beautify

Чистий код набагато легше проходити та виправляти, якщо виявлені помилки. Зробити його читабельним без особливих зусиль можливо за допомогою Atom Beautify, пакета Atom, який вимагає одного клацання, щоб очистити сотні рядків коду.

Ті, хто працює у великих командах, можуть вважати цей пакет дуже корисним, оскільки код буде відформатований у стандартний спосіб, який кожен зможе прочитати без проблем. Пакет підтримує різні мови, включаючи HTML, CSS, Python, Ruby, C тощо.

Турбо JavaScript

Якщо ви використовуєте Atom для кодування в JavaScript, цей пакет не може бути відсутнім у вашому списку. Це дозволяє використовувати фрагменти коду JavaScript, які покращують робочий процес і оптимізують код.

Ці фрагменти добре працюють для ECMAScript 6, і їх дуже легко вивчити, оскільки їхні назви інтуїтивно зрозумілі, короткі та помітні. Одним із прикладів може бути «if», що означає цілий блок «if».

мова-рідина

Інтерфейсні розробники, які використовують мову шаблонів Shopify Liquid, можуть використовувати language-liquid для виділення свого синтаксису.

У Atom за замовчуванням включена опція підсвічування, але вона недоступна під час використання Liquid. Саме тут на допомогу приходить language-liquid, який рятує користувачів від витрачання годин на перевірку коду.

Якщо ви використовуєте іншу мову, яка потребує додаткової підтримки підсвічування синтаксису, спробуйте знайти подібний пакет з назвою іншої мови.

Виділіть вибране

Подібно до підсвічування синтаксису, але з іншою функцією, «Виділити вибране» використовується для вказівки на випадки появи певного слова у вашому коді.

Ви можете вибрати будь-яке слово, двічі клацнувши його, і «Виділити вибране» покаже вам усі інші місця, де з’являється це слово. Просто, але надзвичайно зручно!

Привіт, чи знаєте ви, що дані теж можуть бути красивими?

wpDataTables може зробити це таким чином. Є вагома причина, чому це плагін №1 WordPress для створення адаптивних таблиць і діаграм.

Фактичний приклад wpDataTables у дикій природі

І це дуже легко зробити щось подібне:

Ви надаєте дані таблиці
Налаштуйте та налаштуйте його
Опублікуйте його в публікації або на сторінці

І це не просто красиво, а й практично. Ви можете створити великі таблиці з мільйонами рядків, або ви можете використовувати розширені фільтри та пошук, або ви можете піти дико і зробити їх редагованими.

«Так, але мені дуже подобається Excel, а на сайтах нічого подібного немає». Так, є. Ви можете використовувати умовне форматування, як у Excel або Google Таблицях.

Чи я казав вам, що ви також можете створювати діаграми зі своїми даними? І це лише мала частина. Для вас є багато інших функцій.

Телетайп

Teletype заслуговує на своє місце в списку найкращих пакетів Atom, оскільки він привносить щось нове: дозволяє вам і вашій команді співпрацювати в одному робочому просторі.

Телетайп дозволяє ділитися своїм кодом з іншим програмістом і надає їм доступ до його редагування в режимі реального часу. У деяких випадках це дуже корисно, оскільки програмістам-початківцям рекомендується спостерігати за більш досвідченими програмістами та вивчати їхні способи роботи з проектом.

Телетайп також можна використовувати для командної співпраці, тому він не обмежується обміном кодом з однією особою, а з кількома. Цей пакет є результатом креативності та інновацій команди GitHub.

З 2017 року Teletype є одним із улюблених пакетів багатьох розробників, заохочуючи такі концепції, як парне програмування та соціальне кодування.

Advanced-open-file (від Osmose)

Advanced Open File — це пакет Atom, який допомагає користувачам легше відкривати файли та переглядати папки. Ви також можете створювати нові в Advanced Open File, що скорочує час, необхідний для цього в Atom. Ви можете отримати доступ до нього, натиснувши Alt + cmd/ctrl + O.

LessThan-Slash

Тим, хто більше використовує HTML порівняно з іншими мовами, варто спробувати Less Than-Slash. Серед найкращих пакетів Atom Less Than-Slash вирізняється простотою та ефективністю.

Пакет додає завершальний тег HTML після введення </. Крім того, пакет може розпізнати, який тег потрібно закрити, і автоматично додає його, ігноруючи теги типу або схожі.

Ви також можете вказати всі теги, які ви бажаєте ігнорувати, на панелі налаштувань пакета. Крім того, ви можете скористатися опцією повернення курсору, яка надсилає ваш курсор на початок закриваючого тегу, що полегшує переписування.

Піктограми файлів

Atom запрограмований на відображення імені файлу в ієрархічній панелі під час доступу до вікна редактора. Іноді це сприймається як незручність, враховуючи, що деякі люди вважають за краще знати назву файлу, над яким вони працюють, у піктограмі файлу.

Як випливає з назви, File Icons — це пакет Atom, який робить саме це. Це невелика зміна з великим ефектом, тож спробуйте й подивіться, як покращиться ваш робочий процес.

Панель Layout Plus

Виникли проблеми з організацією панелей в Atom? Page Layout Plus дозволяє керувати розподілом кожної панелі, а також надає можливість використовувати ярлики. Використовуючи ярлики, ви можете переходити між колонками або встановлювати макети.

Пакет Git-Plus

Виконувати дії в Гітісі досить складно, тому що завжди потрібно перемикатися на термінал. Git-Plus допомагає вам виконувати дії Git без необхідності перемикання для цього. Він заснований на коротких кодах, і вам потрібно лише натиснути cmd/ctrl + Shift + H. Усі команди Git можна запускати за допомогою цього пакета.

Пігменти (від abe33)

У веб-дизайні кольорові коди — це все. Pigments — це зручний пакет, який сканує ваш файл і виявляє наявні коди кольорів, які потім відображаються. Пігменти охоплюють HEX, RGB і HSL.

Якщо ви працюєте з такими функціями перетворення кольору, як LESS або Stylus CSS, Pigments також може допомогти вам, оскільки він має готові функції для цього. Ви можете налаштувати тип маркера або встановити різні кольорові слова для кожного файлу.

Палітра кольорів

Говорячи про найкращі пакети Atom з точки зору керування кольором, Color Picker заслуговує на місце тут. Ви можете налаштувати значення кольорів набагато швидше у файлі CSS, що є корисною функцією для тих, хто працює в галузі веб-дизайну.

Панель вибору кольорів з’явиться на екрані, якщо натиснути cmd/ctrl + Shift + C. З такою легкістю можна дізнатися, які кольори ви використовуєте, що скорочує час, необхідний для налаштування відтінків.

Міні-карта (за atom-minimap)

Для тих, хто знайомий із Sublime Text, міні-карта є корисною функцією для розробників, які хочуть бачити попередній перегляд вмісту свого файлу у вікні редактора коду. Наявність одного з них на екрані допомагає розробникам зберігати напрямок і концентрацію.

Minimap — це пакет для Atom, який дозволяє робити те саме. Окрім основної функції, ви також можете відображати закладки, маркери лінтерів і кольори пігментів.

TODO-Show

Хочете, щоб усі коментарі TODO, FIXME і CHANGED відображалися на вашому екрані? Якщо так, використовуйте TODO-Show. Це класний пакет, який дуже зручний для розробників, які віддають перевагу написанню своїх нотаток безпосередньо в коді.

Серед найкращих пакетів Atom цей, здається, один із найкорисніших. Майте на увазі, що ви також можете створювати власні коментарі на додаток до попередньо створених.

Керівник проекту

Швидке перемикання між проектами не є сильною стороною Atom. Ось чому вам слід спробувати цей пакет, який дозволяє вам набагато легше переключатися.

Збережіть свої проекти за допомогою палітри команд, ввівши в менеджері проектів: Зберегти проект. Після того як ви збережете їх, ви зможете відфільтрувати свої проекти та легко перемикатися між ними.

Відкриті вкладки Atom

Цей пакет Atom дає вам можливість переходити до відкритих файлів у програмі. Якщо ви знайомі з Mission Control від Mac, то він дуже схожий. Пакет покаже активні панелі та попередній перегляд кожної вкладки.

Останні думки про найкращі пакети Atom

Хоча цей список повинен дати вам достатньо для ознайомлення, він навряд чи є вичерпним для всіх найкращих пакетів Atom. Пам’ятайте, що їх понад 8000, тож знайдіть ті, які найбільше підходять для мов, якими ви користуєтеся.

Atom достатньо потужний і без усіх цих пакетів, але ці пакети Atom, які легко встановити, доступні безкоштовно, розширять його функціональні можливості, щоб зробити його зручнішим у використанні.

Якщо вам сподобалося читати цю статтю про найкращі пакети Atom, ви повинні переглянути цю статтю про теми Sublime Text.

Ми також писали про кілька пов’язаних тем, як -от плагіни Sublime Text і про те, як стати розробником інтерфейсу.

Джерело запису: wpdatatables.com