Нужен ли linux frontend разработчик

Инструментарий для front-end разработки под Linux

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

Чего мы добиваемся:
Просматриваем страницу в браузере и правим в текстовом редакторе HTML и CSS/SASS. Код извлекаем напрямую из PSD, попутно корректируя до PixelPerfect прямо в браузере. При сохранении SASS автоматически преобразуется в CSS и загружается на сервер. Необходимые картинки из PSD шаблона вырезаем в два клика, после чего они так-же автоматически загружаются на сервер. Как этого добиться менее чем за пол часа? Я расскажу вам!

Сразу хочу предупредить вас, если ваш опыт работы более нескольких лет и вы являетесь достаточно опытным front-end’ером, то ничего нового вы в этой статье не найдете. Она предназначена для людей, которые относительно недавно присоединились к GNU/Linux сообществу или только решили к нему примкнуть.

Краткое содержание

Большинство хороших программистов делают свою работу не потому, что ожидают оплаты или признания, а потому что получают удовольствие от программирования.
— Linus Torvalds

Выбираем браузер

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

Для этих целей отлично подойдет Firefox Developer Edition, который, как утверждают его разработчики собран «для тех, кто строит Интернет»Почему именно он, а не полюбившийся всем Google Chrome, например? А вот почему:

Плюсы

Полностью бесплатен

Мы же стремимся к свободе программного обеспечения, верно? Да и зачем переплачивать за некоторые вещи, если мы имеем достойную бесплатную альтернативу?!

Встроенные инструменты разработчика

По нажатию волшебной кнопки F12, браузер трансформируется переходит в режим разработки, в котором доступно редактирование CSS-стилей страницы, изменение HTML и отладка JavaScript прямо на странице, режим адаптивного дизайна, а так же мониторинг скорости загрузки страницы.
Подробнее вы можете почитать на официальной странице.

Мультипроцессорность без шаманства

Расширения для Firefox

Pixel Perfect

Безусловно, Pixel Perfect верстка стала стандартом, а этот плагин позволяет накладывать макеты сайта оверлеем, что существенно облегчает разработку.

Advanced Cookie Manager

Иногда возникает необходимость просмотреть, изменить либо удалить некоторые cookies, и этот плагин — отличное решение для этих целей. Так же он позволяет добавлять свои cookies.

User-Agent Switcher

Отличное решение для изменения User-Agent, как понятно из названия. Нажали кнопку, выбрали браузер, операционную систему и устройство. Готово! Вы восхитительны.

User-Agent Switcher

Аддон от автора предыдущего расширения. Позволяет добавлять кастомные User-Agent’ы, что тоже, собственно, видно из названия

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

Выбираем текстовый редактор

Расширения для Sublime Text 3

Emmet и Emmet Css Snippets

На первом месте, конечно же Emmet, знакомый многим. Плагин, позволяющий ускорить написание HTML-кода в считанные разы. Подробнее о нем вы можете почитать тут, а Emmet Css Snippets позволяют творить такую же магию и с вашими CSS файлами.

Color Highlighter

Подсвечивание всех цветов в CSS (таких как «#FFFFFF», «rgb(255,255,255)», «white», и т.д.)
Существенно ускоряет разработку при совместном использовании с пипеткой.

Поддержка Sass синтаксиса для Sublime. Если вы еще не используете препроцессоры — рекомендую начать. А работу именно с Sass мы рассмотрим ниже.

Оптимизация системы

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

Браузер есть, текстовый редактор тоже готов к работе. Что остается? Просмотр PSD файлов и нарезка изображений. Под Linux. Серьезно?

Этот процесс может проходить с удовольствием, и в этом нам поможет замечательная программа Avocode, которая будто бы создана специально для нас. И пусть вас не смущает её цена за подписку, ее триал для одного email длится две недели, а нам никто не мешает иметь БОЛЬШОЕ количество e-mail адресов.

Программа позволяет просматривать PSD файлы, извлекать CSS-свойства объектов подобно Adobe Extract, но гораздо удобнее, а так же сохранять необходимые слои прямо в отдельный файл.

Как же нам автоматизировать преобразование SASS в CSS и склейку спрайтов из изображений? В этом поможет Node.js и Gulp.

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

Устанавливаем NVM — это менеджер версий Node.js, который устанавливается при помощи обычного bash-скрипта. Открываем эмулятор терминала и прописываем следующее:

Либо при помощи Wget:

Перезапускаем окно терминала и проверяем установку при помощи:

Если все установилось верно, вы увидите надпись «nvm» в консоли. Теперь мы готовы к установке Node.js и Gulp. Устанавливаем Node.js при помощи терминала:

Дожидаемся конца установки и ставим Gulp, последовательно выполняя следующие команды:

После чего переходим в папку проекта и прописываем:

Осталось только настроить Gulp-файл для корректной работы всего, что мы установили выше. Создаем документ gulpfile.js и кладем в корень проекта. Прикрепляю свое содержание gulpfile.js ниже:

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

Оптимизация системы

Небольшие советы по оптимизации вашей работы:

• Все программы, установленные выше, и, в частности, Firefox требуют большого объема оперативной памяти, с чем нам поможет справится zRam или zSwap.
• Удобную работу с терминалом обеспечит Guake
• Вместо Sublime и Avocode можно использовать Adobe Brackets с его встроенным Extract, но, говоря честно, поддержка шрифтов в Debian и Ubuntu оставляет желать лучшего.
• Выбор между SFTP и VinylFTP предоставляю вам, я же использую оба инструмента по мере надобности

Источник

Frontend и Linux — стоит ли ставить линукс?

Слышал, что учиться чему-то (с чем планируешь далее работать) нужно в среде, максимально приближенной к той, в которой будет все работать.

Я хочу учиться Frontend-у, соответственно мне и работать нужно в среде, максимально приближенной к интернету. Соответственно — к линукс, так как большинство серверов на линуксе работает.
Да и на разных видео слышал, что идеально работать на Маке, но денег на него пока что нет. А максимально близко к Маку — Линукс.
И при необходимости, установить сервер свой на линуксе вроде как проще, чем на винде.

Ранее уже немного сталкивался с линуксом и умею ставить саму систему.

Вопрос: Стоит ли мне ставить операционную систему Линукс (хочу Debian или KDE Neon) для того, чтобы заниматься изучением Frontend.

Всем спасибо за ответы.

Линух/юних для разработки удобен тем что ее инструменты работают нативно (отпадает потребность в портированных сборках, а также гитбаше/cygwin’e/тормозном WSL), этот софт удобнее ставится и управляется, занимает чуть меньше дискового пространства и имеет меньше проблем кофликтов (за счет того что шаред либы установлены в системе, а не пихаются куда попало каждой портсборкой).
А яблочное, удобнее для пидорасиков — ну это и так общеизвестный факт.
В остальном, вообще без разницы, винда или невинда.

Если ты не юзаешь утилиты типа sed, большинство задач стремишься выполнять мышкой, и у тебя пока что не бомбит от уебищности форточек — то оставайся на них, это будет разумнее.

Источник

Какой дистрибутив Linux выбрать для front-end?

Sanes, так разница будет в начертании, хинтинге, субпиксельной отрисовки и т.д. То есть если я выставлю:

То оно так будет везде. А детали будут отличаться от многих вещей: версии ОС, версии браузера, браузера, монитора, настроек самого юзера и т.д. Всё не учтёшь.

. разница будет в начертании, хинтинге, субпиксельной отрисовки и т.д

Но при этом ничего сметрельного не происходит 🙂

Сейчас же инструменты типа Avocode, Figma и т.д. отдают всё касаемо шрифтов: И угадывать ничего ненужно.

то что 90% условных пользователей сидят на винде как-то отменяет факт, что фронтом можно заниматься на других системах?

то, что тестировать нужно под все (хотя бы под ЦА) — это факт.

Собираюсь попробовать использовать линукс под фронт енд разработку.

Зачем? Есть серьезная причина или просто «что-то в #опе зачесалось. » ?

Это существенное изменение инструментария. Например gimp вместо фото#опы.
Это существенное изменение приемов работы — в любом DE (если только уже не используете кроссплатформенные инструменты) все не так

В линухе концепция другая — принципиально.

Поставьте VB, подымите в нем бубунту например — как самый «виндообразный» дистриб — и посмотрите, как оно.

Собираюсь попробовать использовать линукс под фронт енд разработку.

Во первых — желание познакомится с семейством Linux.

Во вторых — 10 раз переустанавливал винду с полным форматированием, но мой комп не вывозит связку photoshop + препроцессор + окно браузера (что очень странно, но это уже другой вопрос).

Аналогичный софт под Линукс будет работать также или хуже.

Для того, чтобы софт бегал, надо либо комп помощнее, либо программы попроще. например не фотошоп, а GIMP (есть и под виндовс и под линукс, освоив его можно будет проще переключаться между системами) или Krita. В общем аналоги можно погуглить и некоторые попробовать и без перехода на Линукс
Если в браузере полно плагинов, повыкидывать.
Или банально докупить оперативки.

Изучать Линукс для перехода на MacOs нет смысла. Набор софта разный, GUI вообще разный.

Имеет смысл познакомиться с серверным линуксом, с работой в командной строке. И немного разобраться с файловой системой и правами доступа.
Например в Windows нельзя в одной папке сделать index.html и INDEX.html, а в линукс это будет два разных файла.

Но опять таки, основной момент не в ОС, а в прикладных программах, в которых вам удобно работать.

Непосредственно бэкенд, который генерит фронтенд, обычно работает не на десктопных линуксах, а на серверных, которые обычно стоят где-то в датацентрах и у них даже мониторов нет. Поэтому для того, чтобы запустить ваш сайт, нужно просто уметь подключаться к удаленному линуксу, работать в командной строке (базовые вещи — копировать файлы туда-сюда, редактировать что-то на месте, гит, базовые команды чтобы посмотреть состояние системы, свободное место, запустить остановить веб-сервер.
В идеале конечно научиться настраивать все с нуля, типа поставить Линукс (базовая установка через next-next-finish), поставить веб-сервер а добавить его автозагрузку, скопировать файлы сайта/приложения или настроить автоматическое разворачивание каким-либо способом. Как-то так.

Фронтент ведь работает не в ОС, а в браузере. Поэтому не так важна ОС, как ваш личный комфорт при работе с паком программ.

Это не так, одни и те же программы немного по разному работают в разных ОС, а шрифты? В семействе Linux совсем другие шрифты и смотрятся они на экране монитора гораздо хуже, сам страдал подобной «ерундой», front делайте на Win, это очень важно!

Источник

Возможен ли переход с Windows на Linux для Front-end’a?

Хочу узнать о возможности перехода с Виндовс на Линукс для фронт-энд разработчика.
В основном я пользуюсь Firefox, Phpstorm, Photoshop.
Будут ли с ними проблемы?
И вообще, трудно ли с окон пересаживаться на Линукс? Это как с Grunt на Gulp или похуже?
Основная причина — хочу уметь работать с Линуксом.
Что скажите?

• Вопрос задан более трёх лет назад
• 1324 просмотра

Это как с Grunt на Gulp или похуже?

Это как с gulp на grunt.
Возможно, но сложно и нецелесообразно.

Если хочется куда-то перейти, то смотрите в сторону OS X.

Основная проблема — Photoshop-а нет под Linux нативного. Только wine, виртуалки и прочее. А это уже черевато проблемами, костылями или еще чем то — заранее сказать нельзя.
Плюс в линуксе субъективно будут по другому выглядеть шрифты — там своя система сглаживания и рендера шрифтов.

Короче, стандартный совет — начните с виртуалки. А там сами решите — надо оно вам или нет.

Возможно, только зачем?

Основная причина — хочу уметь работать с Линуксом.

Ну так работайте, кто мешает?
Умение работать с системой, и постоянное использование системы на десктопе несколько разные вещи.
Можно уметь работать не используя на десктопе, можно сидеть на линуксе и не уметь с ним работать.
Чисто мое мнение — линукс на десктопе смотрится откровенно слабо, на фоне виндовс и макоси.
Хотите научится — ставьте в виртуалку и учитесь.

Разумнее всего, самому работать в удобной и привычной среде.

Источник