основные настройки редакторов кода atom
Основные настройки редакторов кода atom
Заходим в настройки редактора Settings и открываем первую вкладку настроек Core (Ядро).
Ниже перечислены все настройки данной вкладки:
Allow Pending Pane Items — Если поставить галку, то кликая по файлам в дереве проекта, они будут открываться в одной и той же вкладке на панеле редактора, пока вы не кликните по файлу два раза, либо пока не внесете изменения в файл.
Audio Beep — Аудиосигнал при недоступности действия или результата выполнения.
Auto Hide Menu Bar — Автоматически скрывать верхнюю панель меню.
Automatically Update — Автоматическое обновление текстового редактора Atom.
Close Deleted File Tabs — Автоматически закрывать вкладку, если файл удален из файловой системы (с жесткого диска).
Close Empty Windows — Автоматически закрывать окно, если в нем нет открытых панелей и вкладок
Color Profile — Цветовой профиль (системный или sRGB).
Remove Empty Panes — Закрывать пустые панели (без вкладок)
Exclude VCS Ignored Paths — Исключить файлы и папки из поиска и поиска с заменой, пути которых прописаны в VCS.
File Encoding — Кодировка файлов по умолчанию.
File System Watcher — Наблюдатель за изменениями файлов в системе (то, что будет отслеживать изменения файлов на вашем жестком диске, я не меняю эти настройки, оставляю по умолчанию).
Follow Symlinks — Проходить ли по ярлыкам при поиске или поиске с заменой. То есть учитывать ли файлы и папки, на которые ведут ярлыки в открытом проекте.
Ignored Names — Игнорируемые файлы и директории в дереве проектов и поиске.
Open Empty Editor On Start — Открывать пустой редактор при старте (если не активна настройка — Открывать последний закрытый проект при старте).
Project Home — Директория проекта по умолчанию.
Reopen Project Menu Count — Какое количество последних закрытых проектов отображать в меню File > Reopen.
Restore Previous Windows On Start — Открывать последний закрытый проект при старте.
— No — Нет — Открывать пустой редактор.
— Yes — Да — Открывать последнее состояние редактора, если он запущен при помощи иконки текстового редактора Атом или из командной строки.
— Always — Всегда — Открывать последнее состояние редактора атом, в любых случаях.
Send Telemetry to the Atom Team — Отсылать ли техническую информацию для анализа, команде разработчиков текстового редактора Atom. Я всегда ставлю — Do not send any telemetry data (Никогда не отсылать никакие технические данные).
Use Proxy Settings When Calling APM — Использовать ли прокси сервер, при установке пакетов, через командную строку с помощью команды apm.
Use Tree Sitter Parser — Использовать синтаксический анализатор для поддерживаемых языков. Штука полезная для структурирования переменных, функций, классов и т.д. для плагинов, которые анализируют и структурируют эти данные для удобства навигации по ним и поиска определений. Кто в теме, тот поймет. Остальным совет — лучше оставить галочку включенной.
Version Pinned Packages — Список имен установленных пакетов, которые не будут обновляться автоматически.
Warn On Large File Limit — Предупреждать, при открытии файла размером превышающим лимит. По умолчанию стоит лимит на открытие файлов весом в 40Мб.
Edit — настройки самого текстового редактора Atom
Atomic Soft Tabs — Перемещать ли курсор по табам, пропуская пробелы. Для большего понимания и наглядности в действии — смотрите видео урок к статье. Да, кстати и не забывайте подписываться на канал, ставить лайки и присоединяться к нам в соц. сетях! 😉
Auto Indent — Автоматический отступ курсора при переводе на новую строку.
Auto Indent On Paste — Автоматический отступ при вставке скопированного кода/текста.
Confirm Checkout HEAD Revision — Показывать ли окно подтверждения, при сбросе изменений в файлах к последнему коммиту. (эта настройка будет интересна тем, кто юзает git систему контроля версий и его команды 🙂
Font Family — Шрифт(ы) используемые в редакторе.
Font Size — Размер текста. По умолчанию 14px.
Invisibles — Блок в котором можно указать, какими символами отображать символы пробела, табуляции, перевода строк, каретки. После слова Default: в каждой строке идет отображение используемых для визуализации скрытых символов по умолчанию. Для того чтобы включить отображение скрытых символов, необходимо поставить галку в настройке чуть ниже — Show Invisibles (Показывать скрытые символы).
Line Height — Высота межстрочного интервала текста в редакторе Атом.
Max Screen Line Length — Длина строк кода, после превышения которой, идет перенос текста. По умолчанию 500px.
Non Word Characters — Символы не относящиеся к словам и служащие разделителями слов. (Для чего это, более подробно смотрите в видео уроке).
Preferred Line Length — Предпочтительная длина строки, после которой текст будет переносится на новую строку. (действует, при включенной опции — Soft Wrap at Preferred Line Length ниже). Более подробно в видео уроке.
Scroll Past End — Разрешить скроллить документ ниже последней линии в документе.
Scroll Sensitivity — Чувствительность скрола. По умолчанию стоит значение 40.
Show Cursor On Selection — Показывать мигающий курсор на выделении.
Show Indent Guide — Показывать направляющие линии отступов.
Show Invisibles — Показывать невидимые символы (пробелы, табуляции, переносы строк…)
Show Line Numbers — Показывать номера строк.
Soft Tabs — Определяет, с каким типом отступов (пробелами — галка стоит / табуляцией — галка снята) будет вставлен код из буфера, если в Tab Type (опции ниже) стоит значение auto.
Soft Wrap — Переносить строки кода при достижении края максимальной длины строки.
Soft Wrap At Preferred Line Length — Переносить строки по достижении предпочтительной длины строки. Длина указывается в строке Preferred Line Length — выше.
Soft Wrap Hanging Indent — Отступ перенесенного текста относительно начала строки. По умолчанию без отступа — 0.
Tab Length — Длина отступа в пробелах, при нажатии клавиши Tab.
Tab Type — Тип табуляции: Soft — пробелами; hard — табами; auto — определяется автоматически, исходя из кода в буфере, либо (если не удалось определить автоматически) в зависимости от опции Soft Tab (выше).
Undo Grouping Interval — Интервал группирования действий в истории изменений (в миллисекундах). По умолчанию 300 миллисекунд.Zoom Font When Ctrl Scrolling — Изменять ли размер шрифта, при зажатой клавише Ctrl и скролле колесиком мыши.
System Settings — cистемные настройки текстового редактора Атом (для Windows)
Register as file handler — Показывать ли Atom в контекстном меню файла, во вкладке “Открыть с помощью”.
Show in file context menus — Показывать Atom в контекстном меню файлов.
Show in folder context menus — Показывать Атом в контекстном меню папок.
Раздел настроек URI Handling
Честно говоря так сильно не заморачивался и не юзал этот раздел настроек редактора Атом. Для функциональности редактора, настройка не несет никакой пользы. Интересно мнение тех, кто раскопал надобность и возможность применения данных настроек — отпишитесь в комментариях ниже — обсудим и примем на заметку! 😉
Keybindings — раздел настроек горячих клавиш
Горячие клавиши и их настройку мы рассмотрим в одном из дальнейших видео по текстовому редактору Атом.
Packages — установленные пакеты
Здесь можно посмотреть все установленные пакеты.
Раздел настроек — Themes (темы) редактора Атом.
UI Theme — Список тем меняющих вид интерфейса текстового редактора Atom.
Syntax Theme — Список тем отображения кода текстового редактора.
Дополнительные темы вы можете установить в разделе настроек — Install.
Раздел Updates
Отображаются доступные обновления для текстового редактора Atom.
Раздел настроек — Install
Тут можно просмотреть доступные для установки и установить пакеты расширений функциональности текстового редактора Атом.
Кнопка Open Config Folder — Открывает папку расположения настроек текстового редактора.
Вот и разобрались мы с настройками текстового редактора Atom. Пишите свои комментарии ниже, делитесь информацией с вашими друзьями. До новых встреч друзья!
Как пользоваться Atom
В этой статье мы разберёмся, как пользоваться редактором Atom для веб-разработки, какие плагины нужно установить, а также как правильно всё настроить, чтобы получить удобное рабочее окружение.
Установка Atom
Для операционной системы Windows или MacOS редактор Atom можно загрузить с GitHub репозитория проекта. Затем надо распаковать полученный архив и запустить atom.exe. Программа портативная, поэтому установки не требует.
Версию для Linux можно скачать там же. Доступны deb- и rpm-пакеты, а также есть возможность собрать программу из исходников. Для установки загруженного deb-пакета в Ubuntu или Debian выполните команду:
Также в Ubuntu можно установить программу через менеджер пакетов snap. Для этого выполните такую команду:
После завершения установки вы можете найти программу в главном меню системы:
Как пользоваться редактором Atom
1. Установка пакетов Atom
Далее для установки пакета нужно выбрать пакет из списка найденных и нажать кнопку Install.
Когда установка завершится, вы сможете открыть его настройки кнопкой Settings или деактивироивать его кнопкой Disable. Также вы можете устанавливать пакеты atom из командой строки. Для этого выполните в терминале:
apm install имя_пакета
2. Русификация Atom
Я не рекомендую русифицировать программу. Если вы разработчик, то английский вам обязательно понадобится и не нужно избегать возможности его практиковать. К тому же ничего сложного в меню нет, а в интернете есть множество инструкций на русском. Но если очень хотите, то можно. Для этого установите пакет atom-i18n. Это не просто русификатор Atom, пакет содержит поддержку огромного количества языков.
Когда пакет будет установлен, нажмите кнопку Settings под именем пакета и в поле Language выберите Русский:
Затем вам останется перезагрузить редактор. Теперь главное меню и контекстное меню будут на русском:
Как видите, получить русский язык в Atom не так сложно. Дальше в этой инструкции я буду предполагать, что русификацию вы не ставили и все названия кнопок будут на английском языке. Уже сейчас редактор кода Atom готов к использованию, но мы можем сделать его ещё лучше.
3. Выбор темы оформления
Здесь можно выбрать тему интерфейса Theme UI и тему подсветки синтаксиса Theme Syntax:
Доступна светлая тема и тёмная:
Тем синтаксиса тоже доступно несколько, выберите то, что вам нравится. Также можно устанавливать темы из сети.
4. Подсветка синтаксиса и ошибок
По умолчанию редактор подсвечивает синтаксис для большинства языков, потому что пакеты их поддержки установлены по умолчанию. Это PHP, HTML, Json, SQL, XML, CSS, CoffeeScript, JavaScript, Java, C/C++, Go и многие другие. Но если вы хотите подсветку для дополнительных языков, их надо установить. Добавьте поддержку twig, если пользуетесь этим шаблонизатором, установив пакет:
Также для улучшения вида файлов можно установить пакет, который добавляет для каждого типа файла иконки:
В Atom для подсветки ошибок на лету используется интерфейс линтеров. Есть общий пакет Linter, а также реализации проверки для разных языков. Чтобы добавить подсветку ошибок в PHP, CSS, JSON и HTML, надо установить эти пакеты:
После установки этих пакетов, если вы допустите ошибку в PHP или другом поддерживаемом языке, то сразу же текстовый редактор покажет вам сообщение об этом:
5. Поддержка Git
Системы контроля версий используются сейчас практически везде. Чтобы добавить поддержку Git в Atom, нужно установить пакет git-plus. После этого в среде появится интеграция с Git. Если в папке проекта есть Git-репозиторий, то вы будете видеть файлы, которые были изменены, новые файлы, а также текущую ветку. Кроме того, прямо из интерфейса программы можно выполнять коммиты:
Чтобы сделать коммит, нажмите на кнопку Git в нижнем правом углу экрана. Здесь надо выбрать изменённые файлы, затем ввести описание коммита и нажать Commit to имя_ветки. Рядом с кнопкой Git, есть кнопки, с помощью которых можно переключаться между ветками или публиковать изменения в удалённый репозиторий.
6. Автоматическое форматирование
В популярных средах разработки есть очень удобная функция. Вы можете исправить форматирование кода нажатием одной кнопки. В Atom тоже можно добавить такую возможность. Для этого установите пакет atom-beautify и пакет php-cs-fixer, чтобы добавить поддержку автоматического форматирования php.
Также для php нужно установить инструмент php-cs-fixer в систему. Для этого выполните такие команды в терминале Linux:
sudo chmod a+x php-cs-fixer
sudo mv php-cs-fixer /usr/local/bin/php-cs-fixer
7. Редактор в стиле Vim
Если вам нравится философия редактора Vim, как мне, то вы захотите, чтобы в других реакторах можно было использовать все возможности vim. В Atom это возможно, достаточно установить:
Теперь вы можете перемещаться по тексту, используя клавиши h j k l, выделять с помощью v, использовать y x и p для копирования и вставки, / для поиска, а также команды vim, например :w для сохранения документа.
8. Префиксы в CSS
Далее наберите Autoprefixer и нажмите Enter. После этого префиксы производителя в css atom будут автоматически установлены:
9. Отладка PHP в Atom
При написании серьёзных проектов не обойтись без отладки. Для отладки PHP можно использовать отладчик Xdebug. Сначала нужно установить Xdebug в систему. В Ubuntu для этого выполните:
sudo apt install php-xdebug
Затем добавьте такие строчки в конфигурацию отладчика:
zend_extension=xdebug.so
xdebug.remote_enable=1
xdebug.remote_host=127.0.0.1
xdebug.remote_connect_back=1
xdebug.remote_port=9000
xdebug.remote_handler=dbgp
xdebug.remote_mode=req
xdebug.remote_autostart=false
Здесь важен параметр xdebug.remote_autostart, его значение должно быть false. Если это значение будет true, то отладчик будет запускаться для всех выполняемых скриптов, а это нам не нужно. Порт оставляем по умолчанию 9000, хост 127.0.0.1. Затем перезапустите веб-сервер, чтобы применить настройки:
sudo systemctl restart apache2
Далее надо установить пакет php-debug, также установите его зависимости, которые предлагает установить среда:
Чтобы при каждом запуске не показывалось сообщение «You have both linter and atom-ide-diagnostics enabled, which will both display lint results for Linter-based packages». Откройте настройки пакета atom-ide-ui и найдите там пункт Enabled Fetures. Здесь надо отключить функции Diagnostics Services и Diagnostics:
После установки вы можете запускать отладку. Для этого просто кликните напротив строчки, на которой нужно установить точку останова, чтобы появилась синяя точка:
Дальше займёмся браузером. По умолчанию отладка будет отключена. Чтобы её включить, установите это расширение. Затем кликните по его значку и выберите Debug:
После этого можно перезагрузить страницу и в Atom автоматически запустится отладчик, где вы можете выполнять программу пошагово и смотреть значения переменных. Когда программа спросит соответствие удалённого пути к локальному файлу, укажите в обоих полях одинаковый путь, если проект находится на локальной машине:
Затем вам станет доступна отладка:
А инструкция, как пользоваться Atom для отладки, уже выходит за рамки данной статьи, но я думаю, что вы разберётесь.
10. Работа с проектами в Atom
Выводы
В этой статье мы рассмотрели, как пользоваться Atom для веб-разработки, а также основные полезные плагины, которые можно установить и использовать. Есть и другие интересные расширения, например Emmet, но я им не пользуюсь, поэтому ничего о нем сказать не могу. В целом, при достаточной настройке, Atom превращается практически в полноценную среду разработки. А какие плагины и возможности Atom используете вы? Напишите в комментариях!
Настройка Atom (full version)
Полная инструкция по установке, настройке, работе с FAQ.
21.09.2016 37 комментариев 170 514 просмотров
Свершилось! Наконец-то в Atom появилась проверка орфографии русского и английского языка! Так что опять возвращаюсь к теме Atom.
Содержание
Введение
Некоторое время назад, я пытался перейти с Notepad++ на Atom, а до этого на Sublime Text. Но всякий раз попытки были безуспешными, так как некоторых привычных инструментов из Notepad++ не хватало. Для Atom самым главным минусом для меня было отсутствие проверки орфографии русского языка.
Но проверка орфографии появилась! Поэтому попытаюсь еще раз перейти на этот продукт. И в данной статье я сведу все настройки, установки, советы по Atom, что буду использовать. В общем, вперед!
Установка
Скачиваем либо официальную последнюю версию с сайта, либо текущую последнюю версию y в GitHub.
Запускаем скаченный файл, и он автоматически запустит установку без всяких диалоговых окон.
После установки откроется редактор.
Снимаем галочку, чтобы при каждом старте не показывалось приветственное окно.
Первоначальная настройка
Также в разделе Core можно указать папку ваши основных проектов.
В этом же разделе можно указать сколько пробелов будет ставиться при нажатии на табуляцию.
Открытие файлов и каталогов через контекстное меню
В разделе System добавляем в контекстном меню возможность открывать файлы и папки с помощью Atom.
Но, у меня почему-то не при последней установке данные команды не сработали. И никакие шаманства не помогли. Пришлось вручную добавлять соответствующие команды в реестр Windows 10.
Везде текст C:\\Users\\sensor\\AppData\\Local\\atom\\app-1.11.0-beta5\\atom.exe поменяйте на путь к программе на вашем компьютере. Он будет обязательно другой у вас. И обратите внимание, что в пути у вас должны быть двойные слэши.
После этого запустите сохраненный файл и внесите изменения в реестр. После этого у вас в контекстном меню у файлов и папок появятся такие подобные пункты.
Выбор темы оформления (Material Design)
Там можно выбрать тему для оформления интерфейса Atom, а также для отображения непосредственно текста в документах.
Вот не люблю я темные темы для текстовых редакторов. Поэтому выбирал светлые темы.
Вот так будет выглядеть редактор с такими темами.
Если вы хотите найти и установить другие темы, то перейдите в раздел установки, а там выберете Themes для перехода в поиск тем.
Выбранные темы можно установить.
И они потом появятся в выборе тем:
Темы также имеют варианты настроек:
Я поменял основной цвет темы.
Сделал компактный вид панели вкладок.
Сделал компактным дерево папок.
После этих настроек редактор выглядит так:
Проверка орфографии на английском и русском языках
И в пакете spell-ckecker переходим в настройки.
После этого появится проверка орфографии одновременно английского и русского языка в документах. Обратите внимание, что в Windows должны быть установлены соответствующие языки, так как базу Atom берет оттуда.
Копируем этот тип и закрываем уведомление. Потом идем в настройки нашего пакета проверки орфографии.
И в разделе Grammars дописываем наш тип файлов.
Теперь проверка орфографии появилась и в LaTeX файлах.
Как могли заметить выше на моей светлой теме подсказки появляются с темным фоном. Исправим это.