Как открыть atom на компьютере

Как пользоваться редактором Atom

Как открыть atom на компьютере

Atom – это многофункциональный текстовый редактор от разработчиков GitHub. Он поддерживает огромное количество различных расширений, благодаря которым его можно сравнить с настоящей средой разработки. Другая особенность – платформа Electron, на которой держится Atom. Она включает в себя Node.js и движок от Chrome – такой инструментарий позволяет разрабатывать приложения для рабочего стола на основе веб-технологий.

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

Установка Atom

Скачать текстовый редактор для ОС Windows мы можем напрямую из GitHub. Переходим по этой ссылке, пролистываем вниз страницы и находим там файл AtomSetup-x64.exe.

Как открыть atom на компьютере

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

Как открыть atom на компьютере

Как только инсталляция будет завершена, откроется новое окно – главный экран самой программы. С него мы и будем начинать взаимодействие с редактором, но об этом уже в следующем разделе.

Как открыть atom на компьютере

Если вы пользователь операционной системы Linux, то для нее вы также можете скачать установщик из того же репозитория. Там доступны deb- и rpm-пакеты, а также есть возможность собрать программу из исходников.

Установка выполняется с помощью следующей команды:

Для Ubuntu мы также можем воспользоваться менеджером пакетов snap:

Как пользоваться Atom

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

Устанавливаем пакеты

Пакеты – это одна из ключевых особенностей, с помощью которых можно расширять функционал программы. Их установка проста: достаточно открыть поисковое меню, найти нужный пакет и нажать на кнопку установки.

Выглядит это следующим образом:

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

Русифицируем Atom

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

Для русификации у нас уже все установлено, достаточно нажать пару кнопок:

Обратите внимание на то, что основные кнопки для начала работы не были переведены, но если открыть настройки или посмотреть на меню, то там все будет на русском.

Изменяем тему оформления

Не совсем обязательные действия в виде выбора оформления темы, но иногда хочется изменить стиль программы. Для это необходимо выполнить следующее:

Подсветка синтаксиса и ошибок

Изначально в Atom подсветка синтаксиса доступна для всех популярных языков: PHP, HTML, Json, SQL, XML, CSS, CoffeeScript, JavaScript, Java, C/C++, Go. При необходимости мы можем добавить подсветку и для других языков.

Если вы пользуетесь шаблонизатором twig, то в Linux его можно добавить через пакет:

Для улучшения вида файлов можно установить пакет:

Также вы можете установить пакет Linter для подсветки ошибок. Например, чтобы добавить Linter для PHP, CSS, JSON и HTML, следует установить расширения:

Теперь, если вы допустите ошибку в PHP или другом поддерживаемом языке, то текстовый редактор сразу же об этом сообщит.

Поддержка GIT

Думаю, не нужно объяснять, что такое система контроля версий. Сегодня она используется практически везде. Чтобы синхронизировать Atom и GIT, достаточно установить пакет git-plus. Если в папке проекта есть Git-репозиторий, то вы будете видеть измененные и новые файлы, а также их текущее состояние.

Как открыть atom на компьютере

При необходимости мы можем сделать и коммит – для этого необходимо в нижнем правом углу нажать на кнопку Git. Затем указать измененные файлы, ввести описание коммита и нажать на кнопку «Commit to имя_ветки». Возле кнопки Git мы также можем найти другие кнопки, предназначенные для переключения между ветками и публикации изменений в удаленный репозиторий.

Автоматическое форматирование

Без автоматического форматирования кода сегодня практически никуда. Всего в один клик можно отформатировать нужный фрагмент кода – для этого достаточно установить дополнительные расширения. Например, чтобы подключить форматирование для PHP, то следует скачать atom-beautify и php-cs-fixer.

После установки вы можете перейти в меню «Расширения» и увидеть все доступные плагины.

Как открыть atom на компьютере

Редактор в стиле VIM

Если вы привыкли работать с редактором Vim, то в Atom можно подключить все возможности Vim. Для этого следует установить два дополнительных расширения:

С помощью него мы можем перемещаться по тексту с помощью клавиш h, j, k, l, выделять его с помощью v, использовать y, x и p для копирования и вставки, / для поиска, а также команды vim, например :w, для сохранения документа.

Префиксы в CSS

Как открыть atom на компьютере

В отобразившейся поисковой строке вводим запрос «Autoprefixer» и кликаем по первой строке.

Как открыть atom на компьютере

Таким образом, в CSS произойдет автоматическая расстановка префиксов.

Как открыть atom на компьютере

Отладка в PHP Atom

Если вы планируете работать с крупными проектами, то без отладки не обойтись никак. Для PHP в этом может помочь специальный отладчик Xdebug. В Ubuntu для его установки следует выполнить команду:

После этого открыть файл xdebug.ini командой:

В файл прописать следующие параметры:

Обратите внимание на значение параметра xdebug.remote_autostart – оно должно быть false. В противном случае отладчик будет запускаться для всех скриптов, что требуется далеко не всегда. Чтобы применить внесенные изменения, необходимо перезапустить веб-сервер командой:

Дополнительно нужно установить еще один пакет php-debug – в нем также следует прописать все зависимости, которые предлагает среда:

Как открыть atom на компьютере

Также рекомендую отключить показ надписи « 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». Достаточно их раскрыть и выбрать «Never enabled».

Как открыть atom на компьютере

Теперь можно включить отладку – для этого следует кликнуть напротив строчки, на которой нужно поставить точку остановки.

Как открыть atom на компьютере

Теперь следует поработать с браузером, так как по умолчанию отладка там отключена. Потребуется скачать дополнительное расширение Xdebug helper. Загружаем его, затем в верхней части активируем и жмем «Debug».

Как открыть atom на компьютере

Осталось перезапустить страницу – в результате в Atom должен запустить отладчик.

Работа с проектами в Atom

Вот и подходит к концу мое руководство по использованию редактора Atom. Осталось рассказать еще о такой особенности, как проекты. Мы можем не просто открывать css-, html- и php-файлы, но и загружать целые проекты. Это удобно, когда в разработке задействуется большой набор файлов. Для этого необходимо выбрать «Добавить папку с проектом».

Как открыть atom на компьютере

Теперь мы увидим проект в виде дерева:

Как открыть atom на компьютере

Горячие клавиши

Горячие клавиши – это то, с чем нужно дружить. Использование различных комбинаций ускорит вашу работу в разы, поэтому рекомендую ознакомиться с ними поближе. Не нужно их заучивать, просто время от времени используйте, и они сами запомнятся.

Сегодня мы поговорили о мощном текстовом редакторе Atom, который отлично подойдет как для начинающих, так и для опытных веб-разработчиков. Надеюсь, что статья была для вас полезной, и теперь работа с этим редактором кода для вас не страшна. Спасибо за внимание!

Источник

Как открыть ATOM файлы? 4 простых метода решения таких проблем

Когда вы сталкиваетесь с проблемой с неизвестным файлом ATOM и не знаете, как открыть такой файл, первый шаг, который вы должны сделать, это определить причину данной проблемы. Мы покажем вам, как решить наиболее распространенные проблемы с файлами ATOM и как их решить, в 4 простых шага.

ATOM расширение файла

Как открыть файл ATOM?

В некоторых случаях проблемы могут возникнуть при попытке открыть файлы ATOM. Приведенные ниже шаги могут быть полезны для решения таких проблем.

Шаг 1 – Убедитесь, что файл правильно связан с выбранным программным обеспечением

Первое, что пользователь должен сделать, это связать приложение с файлами ATOM. Может случиться так, что даже если в системе установлено приложение, поддерживающее файлы ATOM, оно не будет правильно связано с этим форматом файла. Это можно легко исправить, связав программу с файлами ATOM. Чтобы связать такие файлы с данным приложением, пользователь должен открыть меню файлов (щелкнув правой кнопкой мыши по файлу) и выбрав «Открыть с помощью». Список предлагаемых приложений будет отображаться в верхней части меню. Затем выберите приложение и подтвердите свой выбор, установив флажок «Всегда использовать выбранное приложение для открытия файлов такого типа». Подтвердите свой выбор, нажав ОК.

Чтобы открыть ATOM файл, сфокусируйтесь на шагах 1 и 2

В большинстве случаев для открытия файлов с расширением ATOM должно быть достаточно следующих инструкций на шаге 1 и 2. Прежде чем предпринимать следующие шаги, протестируйте все программы, перечисленные ниже.

Шаг 2 – Установите программу, которая поддерживает ATOM файлы

Если случится так, что раздел с предлагаемыми программами будет пустым, наиболее вероятно, что в системе не будет установлена программа, поддерживающая файлы ATOM. Выберите программу из следующего списка и установите ее:

Источник

Atom в Python – как установить и запустить код

Общеизвестно, что время ни для кого не останавливается, и нам постоянно приходится обновлять инструменты, чтобы идти в ногу с этой неизмеримо быстрой эпохой. Разработка программного обеспечения – одна из основных профессий, в которых программистам нужна наиболее изобретательная среда для написания кода и эффективного создания программного обеспечения. Таким образом, возникает потребность в эффективном текстовом редакторе и IDE(интегрированной среде разработки).

Что касается языка программирования Python, лучше всего подходит Atom с точки зрения IDE.

Что такое Atom в Python?

Atom в Python – это бесплатная интегрированная среда разработки с открытым исходным кодом, специально созданная для разработчиков Python.

Значение Atom

С другой стороны, мы можем использовать IDLE Integrated Development and Learning Environment of Python), приложение по умолчанию для выполнения кода Python. Однако для того, чтобы получить что-то продуктивное, эти два основных варианта не кажутся хорошим выбором. Нам потребуется что-то более производительное и надежное. Таким образом, когда вам пригодится Atom Python IDE. Atom не содержит каких-либо особенностей в традиционном понимании; вместо этого он создает пакеты, которые хранятся в его взломанном ядре. Эти пакеты включают такие функции, как строки кода, автозаполнение и выделение кода.

Теперь давайте перейдем к замечательному текстовому редактору Atom.

Использование текстового редактора Atom

Atom – это бесплатный многоплатформенный текстовый редактор или IDE с открытым исходным кодом, который поддерживает пакеты, разработанные NodeJS, и встроенный элемент управления Git. Большинство расширяемых пакетов находятся в свободном доступе и разрабатываются сообществами с открытым исходным кодом. Atom IDE основана на Electron Framework(ранее называвшейся Atom Shell).

Электронная структура позволяет разработчикам использовать настольное приложение на нескольких платформах, таких как Linux, MacOS и Windows, с помощью NodeJS и Chromium. Atom IDE написана на Less и CoffeeScript, разработана и поддерживается GitHub.

Теперь давайте посмотрим, как загрузить и установить текстовый редактор Atom.

Загрузка и установка текстового редактора Atom Python

Мы можем скачать текстовый редактор Atom Python с официального сайта: https://atom.io. Он автоматически определит текущую конфигурацию операционной системы и отобразит соответствующий файл установки для загрузки.

Как открыть atom на компьютере

Чтобы загрузить установочный файл, нажмите «Загрузить». После завершения процесса загрузки откройте установочный файл, чтобы установить приложение в Системе. Поскольку процесс установки автоматический, нет необходимости в каком-либо руководстве. После успешной установки Atom автоматически откроется в каталоге по умолчанию, а в меню «Пуск» также будет создан ярлык приложения.

Теперь нам нужно установить необходимые плагины и пакеты для выполнения кода Python.

Давайте теперь разберемся с конфигурацией Atom Python для доступа к нему из каталога по выбору пользователя стандартным методом. Atom также предоставляет такие функции, как установка темы или пакета с помощью приветственного руководства. Сейчас мы закрываем приветственное руководство и снимаем флажок «Показывать приветственное руководство при открытии Atom». В результате оно не появится в следующий раз, когда мы запустим приложение Atom.

Как открыть atom на компьютере

Теперь мы можем перейти в каталог, щелкнуть правой кнопкой мыши папку или файл и выбрать опцию «Открыть с помощью Atom».

Если опция недоступна в контекстном меню, мы можем запустить ее из программ. Все, что нам нужно сделать, это перейти в меню «Файл» в Atom, затем перейти к настройкам. Мы также можем использовать комбинацию клавиш: Ctrl + Comma(Ctrl +,), чтобы открыть настройки в Atom.

В настройках мы должны нажать на вкладку «Система» и проверить следующие параметры:

После этого в контекстном меню появится опция «Открыть с помощью Atom». Теперь мы можем открыть выбранный файл или папку прямо в Atom.

Когда мы открываем приложение Atom, мы видим дерево слева. Однако, если представление в виде дерева не отображается, мы можем перейти к просмотру в строке меню и щелкнуть «Переключить представление дерева». Мы также можем использовать ярлык: Ctrl + K Ctrl + B. Это древовидное представление содержит файлы, присутствующие в связанной папке, из которой мы можем дважды щелкнуть любой файл python, чтобы увидеть его содержимое.

Выполнение кода в Atom

Обычно мы используем командную строку или терминал для выполнения программ Python. Однако Atom предоставляет плагин, известный как platformio-ide-terminal, для выполнения кода Python. Мы можем настроить этот плагин, перейдя к файлу в строке меню. Затем нужно перейти к настройкам и щелкнуть вкладку «Установить». Теперь в строке поиска найдите и установите плагин platformio-ide-terminal. Мы можем использовать описанный выше метод для установки других пакетов, плагинов, а также тем.

Как открыть atom на компьютере

После успешной установки плагина терминал будет интегрирован в текстовый редактор Atom. Мы можем переключать этот терминал с помощью значка +, доступного в нижнем левом углу редактора.

Мы можем открыть несколько файлов в Atom и разделить окно, выбрав «Просмотр» в строке меню. Перейдите в Panes и выберите опцию Split Right, чтобы отправить текущий файл в правую половину окна. Это поможет повысить производительность при работе с более чем одним файлом.

Тематика

Atom предоставляет два типа тем: темы синтаксиса и темы пользовательского интерфейса. Темы синтаксиса используются для определения цвета кода и выделения деталей синтаксиса. В отличие от этого, темы пользовательского интерфейса используются для изменения стиля раскрывающихся списков, кнопок и многого другого.

Мы можем проверить все установленные темы, перейдя в Настройки в меню «Файл» и щелкнув вкладку «Темы». На вкладке «Тема» отобразится соответствующий результат. Мы также можем загрузить множество новых тем, доступных на рынке, щелкнув вкладку + Установить в Настройках и выполнив поиск нужной темы.

Мы также можем изменить настройки шрифта по умолчанию, снова перейдя в «Настройки» и щелкнув вкладку «Редактор». На следующей вкладке мы можем найти множество параметров, связанных со стилем редактора, который включает размер шрифта, стиль шрифта и многое другое. Мы можем изменить шрифт, используя Font Family, чтобы придать ему стиль по нашему выбору.

Atom Python: эксперименты

Есть разные вещи, с которыми мы также можем поэкспериментировать, используя следующие параметры:

Высота строки обычно определяется как расстояние между двумя строками. Мы также можем изменить высоту строки, перейдя на вкладку «Редактор» и изменив ее в соответствии с требованиями.

Как правило, мы можем прокручивать код только до последней строки, которая также называется нижней частью экрана. Обычно мы не можем прокручивать дальше этого предела. Однако, если мы включим пакет Scroll Past End, мы сможем увидеть нижнюю строку вверху экрана. Этот пакет предоставляет пустое пространство внизу, чтобы пользователи могли удобно работать со своими кодами.

Направляющая для отступов используется для отображения вертикальных линий, которые означают, что должны появиться отступы. Мы можем включить «Показать руководство по отступу» на вкладке «Редактор» в настройках.

Есть и другие варианты, с которыми мы можем поэкспериментировать. Но пока давайте приступим к пониманию некоторых конфигураций, определенных Python.

Специальные конфигурации Python

Вот некоторые из чрезвычайно полезных плагинов для повышения производительности Python:

Пакет Script предназначен для отображения документа, связанного со всеми деталями других пакетов, такими как ярлыки, команды и многое другое. Мы всегда можем изменить эти ярлыки по умолчанию, если нам неудобно, перейдя на вкладку кода просмотра, в которой хранится папка раскладок. Затем мы должны открыть файл script.cson и обновить его в соответствии с настройками.

Как открыть atom на компьютере

Например, мы изменили ярлык на Ctrl + R. После завершения обработки обновления закройте все окна и перезапустите Atom IDE. После перезапуска мы можем использовать скрипт Python, используя настроенный ярлык, и внизу также появится окно вывода. Но мы также можем настроить это поле вывода, как показано ниже.

В меню «Файл» выберите «Настройки» и перейдите на вкладку «Темы». Ссылка для настройки таблицы стилей видна вверху. Эта ссылка приведет нас к таблице стилей. После открытия таблицы стилей вставьте следующий фрагмент кода, чтобы увеличить размер шрифта консоли скрипта.

Пакет atom-file-icons используется для вставки значков, ведущих к файлам в древовидной структуре, как показано ниже.

Перед установкой пакета atom-file-icons

Как открыть atom на компьютере

После установки пакета atom-file-icons

Как открыть atom на компьютере

Пакет autocomplete-python отображает окно предложений относительно того, что может произвести впечатление, когда мы достигаем определенной точки при написании кода.

Как открыть atom на компьютере

Flake действует как линтер Python, используемый для поиска ошибок в скрипте и их всех. Мы можем включить пакет flake, установив flake8, используя следующую команду в командной оболочке или терминале:

После завершения установки мы увидим небольшой значок в нижнем левом углу Atom IDE. Этот значок отобразит список ошибок, обнаруженных во время записи.

Пакет python-autopep8 используется для форматирования кода. Мы можем включить его в настройках плагина autopep8, установив флажок «Форматировать» в параметре «Сохранить».

Теперь давайте разберемся с выполнением кода Python в Atom IDE.

Как выполнить и запустить код Python в Atom IDE?

Давайте разберемся с выполнением кода Python в Atom IDE, написав простой код для абстрактного класса.

Когда мы закончим писать код, он будет выглядеть, как на следующем изображении:

Как открыть atom на компьютере

Теперь перейдем к выполнению кода с помощью установленного ранее терминала. Чтобы использовать терминал, щелкните значок +, расположенный в левом нижнем углу. Теперь введите следующую команду, чтобы запустить программу:

То же самое можно увидеть на следующем изображении:

Как открыть atom на компьютере

Теперь давайте разберемся с кодом.

В приведенном выше примере мы определили два абстрактных класса: Marine_Animals и Aerial_Animals соответственно. Мы также определили абстрактный метод, а именно Breathe(), для этих классов. Мы также определили два дочерних класса, а именно Fish и Bird, которые наследуют атрибуты и методы вышеуказанных абстрактных классов.

Наконец, мы создали экземпляры обоих классов, используя объекты goldie и birdy соответственно, и используем функцию isinstance(), чтобы проверить, является ли объект экземпляром класса.

Источник

Как пользоваться Atom

В этой статье мы разберёмся, как пользоваться редактором Atom для веб-разработки, какие плагины нужно установить, а также как правильно всё настроить, чтобы получить удобное рабочее окружение.

Установка Atom

Для операционной системы Windows или MacOS редактор Atom можно загрузить с GitHub репозитория проекта. Затем надо распаковать полученный архив и запустить atom.exe. Программа портативная, поэтому установки не требует.

Как открыть atom на компьютере

Версию для Linux можно скачать там же. Доступны deb- и rpm-пакеты, а также есть возможность собрать программу из исходников. Для установки загруженного deb-пакета в Ubuntu или Debian выполните команду:

Также в Ubuntu можно установить программу через менеджер пакетов snap. Для этого выполните такую команду:

После завершения установки вы можете найти программу в главном меню системы:

Как открыть atom на компьютере

Как пользоваться редактором Atom

1. Установка пакетов Atom

Как открыть atom на компьютере

Как открыть atom на компьютере

Далее для установки пакета нужно выбрать пакет из списка найденных и нажать кнопку Install.

Как открыть atom на компьютере

Когда установка завершится, вы сможете открыть его настройки кнопкой Settings или деактивироивать его кнопкой Disable. Также вы можете устанавливать пакеты atom из командой строки. Для этого выполните в терминале:

apm install имя_пакета

2. Русификация Atom

Я не рекомендую русифицировать программу. Если вы разработчик, то английский вам обязательно понадобится и не нужно избегать возможности его практиковать. К тому же ничего сложного в меню нет, а в интернете есть множество инструкций на русском. Но если очень хотите, то можно. Для этого установите пакет atom-i18n. Это не просто русификатор Atom, пакет содержит поддержку огромного количества языков.

Когда пакет будет установлен, нажмите кнопку Settings под именем пакета и в поле Language выберите Русский:

Как открыть atom на компьютере

Затем вам останется перезагрузить редактор. Теперь главное меню и контекстное меню будут на русском:

Как открыть atom на компьютере

Как видите, получить русский язык в Atom не так сложно. Дальше в этой инструкции я буду предполагать, что русификацию вы не ставили и все названия кнопок будут на английском языке. Уже сейчас редактор кода Atom готов к использованию, но мы можем сделать его ещё лучше.

3. Выбор темы оформления

Как открыть atom на компьютере

Здесь можно выбрать тему интерфейса Theme UI и тему подсветки синтаксиса Theme Syntax:

Как открыть atom на компьютере

Доступна светлая тема и тёмная:

Как открыть atom на компьютере

Тем синтаксиса тоже доступно несколько, выберите то, что вам нравится. Также можно устанавливать темы из сети.

4. Подсветка синтаксиса и ошибок

По умолчанию редактор подсвечивает синтаксис для большинства языков, потому что пакеты их поддержки установлены по умолчанию. Это PHP, HTML, Json, SQL, XML, CSS, CoffeeScript, JavaScript, Java, C/C++, Go и многие другие. Но если вы хотите подсветку для дополнительных языков, их надо установить. Добавьте поддержку twig, если пользуетесь этим шаблонизатором, установив пакет:

Также для улучшения вида файлов можно установить пакет, который добавляет для каждого типа файла иконки:

В Atom для подсветки ошибок на лету используется интерфейс линтеров. Есть общий пакет Linter, а также реализации проверки для разных языков. Чтобы добавить подсветку ошибок в PHP, CSS, JSON и HTML, надо установить эти пакеты:

После установки этих пакетов, если вы допустите ошибку в PHP или другом поддерживаемом языке, то сразу же текстовый редактор покажет вам сообщение об этом:

Как открыть atom на компьютере

5. Поддержка Git

Системы контроля версий используются сейчас практически везде. Чтобы добавить поддержку Git в Atom, нужно установить пакет git-plus. После этого в среде появится интеграция с Git. Если в папке проекта есть Git-репозиторий, то вы будете видеть файлы, которые были изменены, новые файлы, а также текущую ветку. Кроме того, прямо из интерфейса программы можно выполнять коммиты:

Как открыть atom на компьютере

Чтобы сделать коммит, нажмите на кнопку 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

Как открыть atom на компьютере

7. Редактор в стиле Vim

Если вам нравится философия редактора Vim, как мне, то вы захотите, чтобы в других реакторах можно было использовать все возможности vim. В Atom это возможно, достаточно установить:

Теперь вы можете перемещаться по тексту, используя клавиши h j k l, выделять с помощью v, использовать y x и p для копирования и вставки, / для поиска, а также команды vim, например :w для сохранения документа.

8. Префиксы в CSS

Как открыть atom на компьютере

Далее наберите Autoprefixer и нажмите Enter. После этого префиксы производителя в css atom будут автоматически установлены:

Как открыть 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, также установите его зависимости, которые предлагает установить среда:

Как открыть atom на компьютере

Чтобы при каждом запуске не показывалось сообщение «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:

Как открыть atom на компьютере

После установки вы можете запускать отладку. Для этого просто кликните напротив строчки, на которой нужно установить точку останова, чтобы появилась синяя точка:

Как открыть atom на компьютере

Как открыть atom на компьютере

Дальше займёмся браузером. По умолчанию отладка будет отключена. Чтобы её включить, установите это расширение. Затем кликните по его значку и выберите Debug:

Как открыть atom на компьютере

После этого можно перезагрузить страницу и в Atom автоматически запустится отладчик, где вы можете выполнять программу пошагово и смотреть значения переменных. Когда программа спросит соответствие удалённого пути к локальному файлу, укажите в обоих полях одинаковый путь, если проект находится на локальной машине:

Как открыть atom на компьютере

Затем вам станет доступна отладка:

Как открыть atom на компьютере

А инструкция, как пользоваться Atom для отладки, уже выходит за рамки данной статьи, но я думаю, что вы разберётесь.

10. Работа с проектами в Atom

Как открыть atom на компьютере

Выводы

В этой статье мы рассмотрели, как пользоваться Atom для веб-разработки, а также основные полезные плагины, которые можно установить и использовать. Есть и другие интересные расширения, например Emmet, но я им не пользуюсь, поэтому ничего о нем сказать не могу. В целом, при достаточной настройке, Atom превращается практически в полноценную среду разработки. А какие плагины и возможности Atom используете вы? Напишите в комментариях!

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *