Представляємо вашій увазі підбірку 15 розширень для Visual Studio Code (VSCode), які стануть в нагоді програмісту будь-якого рівня.
Для тих, хто не в курсі, Visual Studio Code - це безкоштовний і багатоплатформовий текстовий редактор, створений компанією Microsoft. Він досить швидко став «народним улюбленцем», зважаючи на його високу продуктивність і рясного функціоналу.
Як і більшість сучасних IDE, VSCode має перманентно розвивається ринок встановлюються доповнень, що розширюють вихідні можливості редактора. Для того, щоб розібратися, на які саме плагіни варто звернути уваги, ресурс «Бібліотека програміста» представляє вашій увазі підбірку 15 плагінів для Visual Studio Code, які будуть корисні будь-якому програмісту.
За замовчуванням, Visual Studio Code не передбачає можливості відкривати файл в будь-якому вибраному браузері. Дане розширення не тільки додає функцію Відкрити в браузері за замовчуванням, але також дозволяє відкривати файли в будь-якому наявному у вас браузері (Firefox, Chrome, IE).
Quokka - це утиліта, що дає вам можливість попереднього перегляду результату виконання того чи іншого шматка коду. Вона видає вам результати виконання функцій і пораховані значення змінних. Розширення легко налаштувати, і воно запускається з того ж ящика, що і JSX або Typescript проекти.
Швидко вставляйте випадкові дані за допомогою знаменитої бібліотеки Javascript Faker. Ви можете вставляти довільні імена, адреси, зображення, телефонні номери і навіть уривки відомих літературних творів. Кожна категорія має свої підкатегорії, що дозволяє вам вибрати найбільш підходящий варіант.
З цим плагіном ви можете відстежувати визначення CSS класів і id таблиць стилів. Для цього просто достатньо натиснути правою кнопкою миші на селектор в вашому HTML файлі і скористатися функцією Перейти до визначення або Підглянути визначення.
Це розширення спрощує роботу з HTML файлами, позбавляючи вас від необхідності прописувати теги head і body вручну. Просто наберіть в порожньому файлі html, натисніть на Tab, і VS Code сам згенерує шаблон вашого документа.
На сьогоднішній день, Prettier - найпопулярніший редактор коду в світі веб-розробки. Він дозволяє приводити код, написаний кількома людьми, до однакового виду. В налаштуваннях Prettier можна встановити автоматичний запуск, що дозволяє моментально форматувати JS і CSS документи.
Невеликий плагін, який дає вам можливість отримувати коротку довідку про використовувані в CSS кольорах. Навівши курсор на назву кольору, ви можете побачити, як цей колір виглядає, а також отримати всю інформацію про трансляцію даного кольору в різні формати (hex, rgb, hsl і cmyk).
Це розширення привносить в VS Code можливість працювати з SVG файлами. За допомогою SVG Viewer, ви можете редагувати SVG файли, конвертувати їх в PNG і створювати data URL схеми.
Дана програма дозволяє вам проставляти мітки всім недоробленим місцях в коді, що спрощує подальшу роботу над проектом. За замовчуванням, мітки можуть бути тільки TODO (доробити) і FIXME (виправити), але при бажанні ви можете створювати і свої типи міток.
Невелике доповнення, що додає в VS Code підтримку близько 20 популярних шрифтів, зокрема, Font Awesome, Ionicons, Glyphicons, and Material Design.
Minify є утилітою, що пропонує масу можливостей по оптимізації і стиснення розмірів коду. Minify працює з HTML, JS і CSS файлами і також відмінно поєднується з такими плагінами, як uglify-js, clean-css і html-minifier.
Так, прийшов час трохи розслабитися. Якщо всі розглянуті до цього розширення були орієнтовані на якесь практичне застосування, то ця утиліта дозволяє трохи побавитися з регістрами. За замовчуванням, VS Code має тільки функції приведення до верхнього і нижнього регістра, але, встановивши собі Change Case, ви отримаєте доступ до досить великому кількості регістрів, наприклад, зміїний регістр, верблюжий регістр та інше.
Дуже корисний інструмент, який дозволяє вам працювати з регулярними виразами прямо в текстовому редакторі. Він приймає на вхід два регулярних вирази і видає результати порівняння. Принцип роботи чимось схожий на RegExr.
VS Code підтримує велику кількість мов і фреймворк, але далеко не все. Якщо з якихось причин, використовувана вами технологія не потрапила в цей список, то ви завжди можете завантажити потрібну вам розширення з підтримкою таких приємних фіч, як автозаповнення, правильні відступи тощо.
Ось і дійшли до самого смачного. Адже ви збираєтеся багато працювати в VS Code, так чому б для початку не зробити його красивим? Є тонни відмінних тим, але ми відібрали 4 фаворита:
• One Monokai
• Aglia
• One Dark
• Material Icon
