Видео: Обзор редактора Atom (от создателя Linux и GitHub) (Май 2023)
Вы когда-нибудь хотели попробовать и изучить веб-разработку? Первый шаг, конечно, получить текстовый редактор. Тем не менее, это может быть трудно выбрать только один, так как существует множество различных вариантов. Некоторые из наиболее известных доступных редакторов включают Sublime Text, Vim, Notepad ++, Atom и Emacs. Само собой разумеется, есть из чего выбирать, но мы проведем вас через всего один — Atom — и покажем, что это такое.
Основы атома
Atom в своей основной форме, как и любой другой текстовый редактор: код, который вы пишете, выделяется разными цветами, есть несколько функций автозаполнения и так далее. Но ядро Atom отличается от других текстовых редакторов тем, что его «можно взломать до самого ядра».
Обзор редактора Atom (от создателя Linux и GitHub)
Благодаря этому редактор кода — это инструмент, который можно настроить практически на все. На самом деле, есть даже встроенный менеджер пакетов для загрузки разработанных сообществом дополнений (доступно множество полезных пакетов, которые делают кодирование более гибким в Atom). Вы можете найти список доступных пакетов здесь.
В редакторе кода есть много других полезных аспектов. Вы можете разделить свои проекты на несколько панелей, что позволит вам быстро сравнивать и получать доступ к различным файлам кода.
Он также имеет браузер файловой системы, который позволяет открывать проект или несколько проектов в одном окне. Браузер файловой системы также позволяет создавать новые файлы без необходимости покидать редактор кода. Как мы упоминали ранее, в Atom также есть несколько удобных функций автозаполнения, которые помогают вам писать код намного быстрее. Атом также кроссплатформенный. Он совместим с Windows, OS X (теперь macOS) и Linux.
Атом лучше остальных?
У Atom есть много чего. Это лучше, чем остальные? Ну, это сложный вызов, потому что в конечном итоге все сводится к предпочтениям и тому, что вы предпочитаете использовать. Atom — мой текстовый редактор, потому что он гибок и функционален. Из-за этого мне одинаково нравится Sublime Text, но я предпочитаю Atom из-за лучшего интерфейса.
Но текстовых редакторов гораздо больше, чем просто Atom и Sublime Text. Тем не менее, вы действительно должны попробовать какое-то время и посмотреть, что лучше всего соответствует вашим предпочтениям. В моем случае Atom может удовлетворить все мои потребности в веб-разработке, а также может удовлетворить и ваши. Ссылка для скачивания Atom
Источник: rus.sync-computers.com
Браузер атом это вирус Почему стоит его удалить новый браузер от mail это вирус
Установить редактор Atom
Следуйте за нами на нашей фан-странице, чтобы получать уведомления каждый раз, когда появляются новые статьи. 
Facebook
1- Что такое программное обеспечение Atom?
Atom это бесплатный текстовый редактор (и исходный код), открытый исходный код, поддерживающий операционные системы Linux, Mac OS, Windows. Он поддерживает plugin (плагины) для программирования с NodeJS и встроения Git-Control, данное программное обеспечение развито с помощью GitHub.
Atom оценивается как текстовый редактор (и исходный) с современным интерфейсом, легко исползуемый и имеющий особые свойства по сравнению с индентичными программными обеспечениями.
Языки поддерживаемые с помощью Atom:
- C/C++, C#, Clojure, CSS, CoffeeScript, GitHub Flavored Markdown, Go, Git, HTML, JavaScript, Java, JSON, Julia, Less, Make, Mustache, Objective-C, PHP, Perl, Property List (Apple), Python, Ruby on Rails, Ruby, Sass, Shell script, Scala, SQL, TOML, XML, YAML
2- Download Atom
Чтобы скачать Atom пройдите в главную страницу по ссылке ниже, заметьте что Atom поддерживает все 3 операционные системы Windows, Mac OS, Linux. Если вы используете Windows, удостоверьтесь что ваша операционная система является Windows 7 64bit или новее.
После того, как вы успешно скачали, у вас будет файл объемом примерно 150MB.
OK после скачивания и завершения установки Atom, это изображение интерфейса Atom:
View more Tutorials:
- Программное обеспечение и утилиты
- Pуководства NodeJS
- Pуководства HTML
Maybe you are interested
Это онлайн курс вне вебсайта o7planning, который мы представляем, он включает бесплатные курсы или курсы со скидкой.
Projects in HTML5- * * Write quicker HTML5 and CSS 3; productivity hacks with emmet
- ChatBots: Messenger ChatBot — DialogFlow and nodejs
- All about NodeJS
- HTML5, CSS3 CSS3: Beginner Web Development
- Learn To Build Beautiful HTML5 And CSS3 Websites In 1 Month
- The Complete NodeJS Course: Build a Full Business Rating App
- Core HTML How to get online quickly HTML to HTML5
- HTML5 Mobile Game Development with Phaser
- HTML5 24-hr Trainer
- Learn Construct 2: Creating a Puzzle Platformer in HTML5!
- * * Beginner Photoshop to HTML5 and CSS3
Источник: betacode.net
Русские Блоги
Сначала свяжитесь с этим редактором и обнаружите, что им легче пользоваться, чем возвышенным. Бросать все утро из-за разного рода недоразумений, особенно установки плагинов, потраченных впустую долгое время, на самом деле все очень просто. Не много ерунды, просто начни. (Надеюсь помочь вам)
1. скачать
После загрузки дважды щелкните файл AtomSetup-x64.exe
Это немного медленно, подожди немного. После отображения этого интерфейса
2. Настройте переменные среды
Установка Atom слишком проста. Ничего не нужно, немного паники, где установка?
Поскольку нам нужно использовать команду apm для установки плагина, нам нужно добавить его в переменные среды, как показано на рисунке.
На значке Atom на рабочем столе → щелкните правой кнопкой мыши → Свойства → Просмотреть расположение установки. Мое место установки: C: Users erdou AppData Local atom.
Теперь настройте переменные среды: добавьте после PATH
;C:UserserdouAppDataLocalatombin
Обратите внимание, что перед ним стоит английская точка с запятой.
Затем вы можете использовать команду apm.
Откройте командное окно, чтобы увидеть, если вы можете использовать APM
Win+R → cmd → apm ls
Посмотрите, какие пакеты установлены:
apm ls
Если плагин не установлен, он будет отображать:
Community Packages (0)
Позже было обнаружено, что переменная окружения apm не может быть настроена. Просто нпм в порядке. Я не знаю, окажет ли это влияние (если есть проблема, она будет улучшена позже).
Панель меню
| Edit | Операции редактирования файлов, форматы кодирования файлов, переходы строк и т. Д. |
| View | Перезагрузка страниц, полный экран, масштабирование размера шрифта и т. Д. |
| Find | Это все о запросах, это очень похоже на Sublime текст, и сочетания клавиш в основном те же |
| Package | Пакет является точкой сбора списка плагинов |
| Help | Справочная документация, обновления программного обеспечения, протоколы и т. Д. |
3. Изменить тему атома
Загрузка: В установочной странице для поиска seti_ui темы, таких как имя, (автор темы seti_ui: jesseweed)
Установка плагинов 4.atom
1. Способ один,
Это самая простая установка плагинов, но она может быть медленной. (Если установка происходит особенно медленно, используйте второй метод напрямую)
2. Способ два,
Возьмите плагин emmet в качестве примера:
- Ctrl + Shift + P: открыть панель
- Enter: установить пакеты Выбрать установить пакеты Темы
- Введите название плагина, который вы хотите установить emmet
- Нажмите на введение плагин, чтобы найти адрес GitHub
- Откройте git и переключитесь на C: Users erdou.atom packages
- git clone https://github.com/emmetio/emmet-atom
- Перейти в папку установленных плагинов cd emmet-atom
- npm install
- Перезапустите Атом
cd ~/.atom/packages git clone https://github.com/emmetio/emmet-atom cd emmet-atom npm install
Требуемые плагины 3.Front-end
- atom-html-preview — эффект предварительного просмотра браузера в реальном времени
- color-picker — подборщик цветов, отлично, есть дерево, оно лучше возвышенного, карты нет, старт супер быстрый
- emmet — быстрый инструмент для написания HTML и CSS, официальный веб-сайт emmet и видео
- atom-ternjs — плагин автозаполнения JavaScript также может настраивать языковую версию и библиотеку скриптов
- docblockr — инструмент комментирования кода с шаблонами для комментариев кода
- jQuery-сниппеты — фрагмент кода JQuery
- фрагменты javascript — фрагмент кода JavaScript
- atom-ternjs — плагин автозаполнения JavaScript также может настраивать языковые версии и библиотеки скриптов
- atom-beautify — форматирование кода
- autocomplete-paths — завершение пути, например, место, где находится изображение
- autocomplete-sass — автозаполнение синтаксиса sass
- atom-bootstrap3 — подсказки кода Bootstrap3
- autocomplete-plus — завершить плагин автозавершения автозавершения кода
- autoprefixer — автоматически добавлять вендорные префиксы к атрибутам в css файлах
- project-manager — мощный, быстрый плагин для открытия проектов, очень полезный
- запустить в браузере — открыть текущий HTML в браузере
- open-in-browser — открыть текущий HTML в браузере
- linter — плагин проверки кода (интерфейс может использовать следующее)
- linter-jshint, for JavaScript and JSON, using jshint
- linter-coffeelint, for CoffeeScript, using coffeelint
- linter-scss-lint, for SASS/SCSS, using scss-lint
- linter-less, for LESS, using less
- linter-csslint, for CSS, using csslint
Плагин отображения эффектов
- реагировать — поддержка подсветки синтаксиса в реакции с завершением
- file-icons — добавить соответствующий логотип перед файлами в древовидной структуре дерева каталогов
- highlight-column — выделить столбец под текущим курсором
- highlight-line — выделить строку, в которой находится текущий курсор
- выделено — выделить все подходящие слова в редактируемом файле
- пигменты — выделять цвета в ответ на цвета, используемые в файлах CSS
- миникарта — каждый, кто использовал Sublime Text, знает, что есть очень полезная функция, то есть небольшая карта кода для внутреннего редактирования. Этот продукт предназначен для выполнения функции атома и поддерживает выделение кода
- file-icons — добавить много значков, значок перед синим именем файла сбоку, отлично
- filetype-color — удивительно, отображать заголовки разных цветов в разных форматах файлов на панели вкладок, поддержка настройки второй степени
- Color-Picker — цветовая палитра, вы можете выбрать свой любимый цвет, а также вы можете настроить прозрачность на панели
плагин инструмента для уценки
- markdown-scroll-sync — запись markdown может быть прокручена в реальном времени в соответствии с записанной частью
- markdown-table-formatter — форматировать таблицу, нарисованную с помощью синтаксиса markdown
Сотрудничество статей плагин
- git-plus — в основном та же функциональность, что и Sublimegit для Sublime Text
(Есть хорошие плагины, буду продолжать обновлять и добавлять)
5. Как изменить ярлыки Atom
1. Откройте файл keymap.cson:
2. Напишите клавиши быстрого доступа внизу и добавьте их по порядку.
‘atom-text-editor’: # F12 Предварительный просмотр HTML-страницы в браузере ‘f12′:’rib:run-in-browser’ # Правый столбец быстрого вызова браузера в реальном времени ‘ctrl-F12′:’atom-html-preview:toggle’
6. Сочетания клавиш
| New Window | Новое окно интерфейса | Ctrl + Shift + N | Как на китайском |
| New File | Новый файл | Ctrl + N | Как на китайском |
| Open File | Открыть файл | Ctrl + O | Как на китайском |
| Open Folder | Открыть папку | Ctrl + Shift + O | Как на китайском |
| Add Project Folder | Загрузить каталог проекта | Ctrl + Alt + O | Как на китайском |
| Reopen Last Item | Перезагрузить последний проект | Ctrl + Shift + T | Как на китайском |
| Save | Сохранить файл | Ctrl + S | Как на китайском |
| Save As | Сохранить как | Ctrl + Shift +S | Как на китайском |
| Close Tab | Закрыть текущий отредактированный документ | Ctrl + W | Как на китайском |
| Close Window | Закрыть редактор | Ctrl + Shift + W | Как на китайском |
| Undo | Отменить | Ctrl + Z | Как на китайском |
| Redo | Redo | Ctrl + Y | Как на китайском |
| Cut | ножницы | Shift + Delete | Как на китайском |
| Copy | копия | Ctrl + Insert | Как на китайском |
| Copy Path | Копировать путь документа | Ctrl + Shift + C | Как на китайском |
| Paste | ручка | Shift + Insert | Как на китайском |
| Select All | Выбрать все | Ctrl + A | Как на китайском |
| Select Encoding | Выберите кодировку | Ctrl + Shift +U | Это установить кодировку файла |
| Go to Line | Перейти на линию | Ctrl + G | Поддержка поиска строк и столбцов, Row: Column |
| Slect Grammar | Грамматический выбор | Ctrl + Shift + L | То же, что настройки Synlim в Sublime |
| Reload | перегрузка | Ctrl+ Alt +R | Перезагрузите текущий отредактированный документ |
| Toggle Full Screen | Полный экран | F11 | Как на китайском |
| Increase Font Size | Увеличить шрифт | Ctrl + Shift + “+” | Sublime’s Ctrl + также работает |
| Decrease Font Size | Уменьшить шрифт | Ctrl + Shift + “-“ | Возвышенный Ctrl-также работает |
| Toggle Tree View | Показать скрытое дерево каталогов | Ctrl + | Возвышенные Ctrl + K, + B также могут вступить в силу здесь |
| Toggle Commadn palette | Панель глобального поиска | Ctrl + Shift + P | Похож на возвышенный |
| Select Line | Выберите строку | Ctrl + L | Как на китайском |
| Select First Character of Line | Выберите курсор в начале строки | Shift + Home | Как на китайском |
| Slect End of Line | Выберите курсор до конца строки | Shift + End | Как на китайском |
| Select to Top | Выделите курсор на первую строку документа | Ctrl + Shift + Home | Если курсор находится на разделительной линии, возьмите верхнюю часть документа |
| Select to Bottom | Выделите курсор в конец документа | Ctrl + Shfit + End | Является ли разделительная линия у курсора, возьмите нижнюю часть документа |
| Find in Buffer | Поиск из буфера | Ctrl + F | В соответствии с возвышенным |
| Replace in Buffer | Расширенная замена | Ctrl + Shift + F | В соответствии с возвышенным |
| Select Next | Матч выбран следующий | Ctrl + D | Точно так же, как Sublime |
| Select All | Сопоставить все | Alt + F3 | Точно так же, как Sublime |
| Find File | Файл запроса, выберите, чтобы открыть | Ctrl + P | Не то же самое, что Sublime |
| Delte End of Word | Удалить курсор до конца слова | Ctrl + Del | Как на китайском |
| Duplicate Line | Скопировать текущую строку для добавления | Ctrl + Shift + D | Как на китайском |
| Delete Line | Удалить строку | Ctrl + Shift + K | Как на китайском |
| Toggle Comment | Включить аннотации | Ctrl + / | В соответствии с возвышенным |
| Toggle developer tools | Отладчик Open Chrome | Ctrl + Alt + I | Магия ах |
| Indent | Увеличить отступ | Ctrl + [ | Отступ вправо |
| Outdent | Уменьшить отступ | Ctrl + ] | Отступ слева |
| Move Line Up | Ряд двигаться вверх | Ctrl + up | Как буквально |
| Move Line Down | Ряд вниз | Ctrl + Down | Как буквально |
| Join Lines | Ссылка на строку | Ctrl + J | дополнительный |
| newline-below | Добавьте строку под курсором | Ctrl + Enter | В согласии с возвышенным |
| editor:newline-above | Добавьте строку над курсором | Ctrl + Shift + Enter | В согласии с возвышенным |
| pane:show-next-item | Переключить вкладку редактирования | Ctrl + Tab | Как на китайском |
| Fuzzy Finder | Панель перехода на файл | Ctrl + T | Как буквально |
| Select Line Move above | Переместить выбранные строки вверх | Ctrl + up | Как на китайском |
| Select Line Move below | Переместить выбранную строку вниз | Ctrl + down | Как на китайском |
| Symbol-view | Введите переменную и функцию панели перехода. | Ctrl + R | Как на китайском |
Источник: russianblogs.com