Где работать сложнее бэкенд или фронтенд. Простыми словами о «фронтенде» и «бэкенде»: что это такое и как они взаимодействуют
Современное IT приобрело своё лицо с момента появления жесткой конкуренции в интернете. Если раньше в приличную студию набирали людей, которые имеют знания в каждой сфере: будь это html и css (создание макета сайта) или php (программирование, создание баз данных). Сейчас же все изменилось. Начинают цениться узконаправленные специалисты. Один занимается только дизайном, другой только программист…
Мир поменялся, конкуренция в интернете настолько большая, что сайтом визиткой теперь никого не удивишь. Люди «гуляют» по сайтам, как по улице. Человека теперь нужно заманивать в нужные разделы, направлять взгляд, заставить сделать что-то.
Когда вы попадаете на сайт, на качественной сделанный сайт, что вы видите в первую очередь? Правильно: красивый дизайн, удобную навигацию (меню), читабельный и уникальный текст, адаптацию под мобильные устройства, в конце концов!
Все это работа фронтенд-специалиста. Его цель сделать максимально удобный дизайн для пользователя. Он не только его рисует, но верстает (собирает) и адаптирует. Продумывается все до последней мелочи. Вот видите социальные сети в низу сайта? Это все неспроста. Это несёт определенную цель, допустим, избежать потери клиента. Он ведь может просто покинуть страницу, ничего не сделав. А так, он лишний раз перейдет в группу, и увидит там то, что задумал фронтенд-специалист и маркетолог.
Все фронтенды придерживаются правил UX дизайна. На английском языке — Users experience, на русском — «опыт пользователя». Если сказать «что это» и подытожить вышесказанное: фрондент-специалист разрабатывает пользовательский интерфейс, не просто красивый дизайн, но и функциональный. Это и есть UX дизайн.
Бекэнд
В отличие от своих коллег по цеху, бекэнд-специалист чаще всего не может похвастаться своей работой так просто. Он не сможет вам показать тривиально переливающийся текст, сделанный с помощью java script, а вы такие: «Вау, круто, оно меняет цвет».
Нет. Бекэнд – это работа для суровых бородатых дядек- хардкорщиков. Они получают истинное наслаждение от классной созданной архитектуры базы данных, от того, что они качественно настроили производительность серверного кода.
Проще говоря, эти ребята работают с серверной частью сайта (с невидимой), с хранилищем данных. Частые случаи, когда такая работа остается слабо оцененной, потому что «на глаз» результата нет. Хотя от этих ребят зависит работа серверного кода, баз данных и безопасность сайта.
Full stack
Напоследок, мы говорили, что раньше было по-другому: молодые программисты хорошо разбирались во всем, не уходя глубоко в одну специализацию. Раньше было важно иметь «масштабные» знания, чтобы понимать все процессы. Но интернет поменялся, а такие ребята до сих пор остаются. Называется это Full stack (фул стэк), когда человек хорошо разбирается и в пользовательской части и в серверной.
Вот мы и пришли к сути. Фронтенд и бекэнд не исключающие друг друга элементы, а вполне гармоничные, дополняющие друг друга. Конечно, иногда одно без другого может обойтись, но все зависит от конкретного случая. Спасибо, что прочли и удачи, друзья.
C уважением, Ваша Суть!
Хей, ты открыл эту статью, так как давно мучил вопрос, чем front-end отличается от просто верстки? Тогда попал по адресу. В статье я вскрою назревающую среди курсов программирования опухоль, обман с курсами front-end, да-да я расскажу это, и конечно многие будут недовольны.
Зачем я делаю это? Это первый вопрос который вы должны задать себе все, во всем есть смысл. Но тут все просто, эти парни доставляют кучу неудобств.
Во первых веб студиям, выпуская кого попало, а я как раз там работаю.
Во вторых, всей отрасли обучения. Заработает деньги конкретная фирма и только один раз, а вот дальше, трудоустроится студент не может, достаток его не растет, в целом на этом он заканчивается как клиент и это очень плохо для всей отрасли обучения, даже для тех, что обучают не ит, и там я тоже работаю.
Когда у большинства людей откроются глаза, больше 50% курсов обанкротятся, так как все наивные уже по разу хотя бы деньги принесут, а второй раз платить им уже будет нечем.
Теперь когда мой интерес вам понятен, надеюсь у нас сложился некоторый уровень доверия. Давайте перейдем к фактам и цифрам, где я попробую объяснить почему цифры именно такие и что же такое front-end в конце концов.
Немного чтоб запутаться, а точнее пример «научного» объяснения термина front-end
Front-end и back-end - термины в программной инженерии, которые различают согласно принципу разделения ответственности между представительским уровнем и уровнем доступа к данным соответственно. Front-end - интерфейс взаимодействия между пользователем и основной программно-аппаратной частью (back-end). Front-end и back-end могут быть распределены между одной или несколькими системами.
В архитектуре программного обеспечения может быть много уровней между аппаратной частью и конечным пользователем, каждый из которых также может иметь front-end и back-end. Front end - это абстракция, которая предоставляет пользовательский интерфейс.
Wikipedia
Эти строчки говорят нам что front-end тоже самое что и верстка, но тем не менее у нас есть верстальщик, а есть фронтендщик, и разница зарплат колоссальна.
В принципе нам неважно что по научному правильно «front-end», нам важно понять за что платят большую зарплату,
Небольшая выборка по требованиям к вакансиям
Сводная таблица самых свежих вакансий с work.ua в одной таблице, вакансии до года опыта.
| Навык | Встречается в вакансиях верстальщик? | Встречается в вакансиях фронтэндщик? |
| WordPress и прочие CMS | 1 | 1 |
| Дизайн | 1 | 0 |
| Photoshop | 3 | 0 |
| Html/css | 5 | 4 |
| JavaScript(jQuery) | 3 | 4 |
| PURE JavaScript(Prototype and etc) | 0 | 4 |
| Angular.js, React.js, Ember.js and ec | 0 | 5 |
| Node.js | 0 | 2 |
| Bootstrap | 2 | 2 |
| SASS / LESS | 0 | 2 |
| Git | 0 | 2 |
В среднем, по просмотренным вакансиям, зп в гривневом эквиваленте
верстальщика от 5 тыс грв
фронтэндщика от 12 тыс грв
Вакансии верстальщиков.
Тут особое сосредоточение на базовых навыках вроде HTML, почти все требуют знания WordPress или чего-то такого, одна из вакансий искала совмещенного верстальщика и дизайнера(кстати это весьма круто и актуально, но именно для вакансии дизайнера а не программиста).
Эти вакансии от небольших веб студий, создающих по большей части шаблонные сайты на CMS, часто из готовых шаблонов, те самые работники-шимпанзе, наиболее низкооплачиваемые работники сферы веб программирования.
Эти ребята когда-то делали первые веб сайты, но сейчас сайты стали на порядок сложнее и функциональное, потому их навыки весьма слабо котируются.
А вот знания PURE JavaScript от таких кандидатов не требуют(вообще ни разу), максимум jQuery или пишут что-то вроде «JS на уровне подключить», прошу обратить внимание на это.
Фронтендщик
На всех вакансиях, тут встречаются почти те же навыки, что и для верстальщика, но посмотрите сколько всего появилось связанного с JavaScript.
Фронтендщик занимается очень похожими с верстальщиком вещами, если очень грубо, то когда в макете JavaScript кода стает в пару раз больше чем HTML, это считают фронтендом, а если уж совсем точно, то:
- верстальщик просто верстает макет, его главная задача чтобы было 100% совпадение верстки и макета что прислал дизайнер.
- фронтендщик создает логику, он конечно умеет верстать, но его главная задача чтобы работали все скрипты на сайте, нажимались все кнопки, действовали все функции что эти кнопки запускают и много другого, но все это так или иначе связано с JavaScript.
Они оба занимаются браузерной частью сайта, вики написала верно, но слишком обобщенно.
Навыки для трудоустройства фронтэндщиком
Давайте разберем список навыков выше и определим с какими из них, для работодателя, вы будете считаться именно фронтэндщиком а не верстальщиком.
PURE JavaScript, PURE значит чистый, это не какой-то там особый JS, это просто значит что вы должны писать простые вещи на JS без применения библиотек.
Angular.js, React.js, Ember.js, это три фреймворка что использует большинство веб студий, достаточно знать одних из них. Кстати хочу обратить внимание, для Angular.js ищут именно первую версию фреймворка, не вторую. Почему так, это потянет на целый доклад, в интернете есть много материалов на эту тему.
SASS/LESS, Git и прочие штуковины, опять же не встречались в вакансиях верстальщика.
Кстати WordPress и все схожее, может сыграть минусом на собеседовании, сложив ложное впечатления для работодателя что вы обычный cms-очник, уровня всего немного выше, чем типовой верстальщик.
1. все тоже что и верстальщик
2. посреди ночи разбуженным, отвечать на любые простые вопросы по PURE JavaScript
3. знать любой из распространенных JS фреймворков (не jQuery)
4. очень желательно знать Git, SASS/LESS, вещи не сложные, но очень распостраненные.
5. Node.js тоже будет плюсом, но еще не так много студий научились с ним работать, не каждая студия посчитает его весомым бонусом, потому желательно на нем научится делать к примеру мобильные приложения или браузерные игры, таким образом вы откроете фирме сразу новую нишу и они с радостью возьмут вас.
А вот чему учат курсы с первой страницы гугла по «курсы front-end киев»
| Навык
| Количество вхождений в программы курсов
|
| HTML\CSS
| 9 |
| bootstrap
| 4 |
| jQuery
| 7 |
| PURE JavaScript (основы)
| 6 |
| PURE JavaScript (продвинуто, ооп и все такое)
| 2 |
| PURE JavaScript (всякие крутые штуки, т. е. супер продвинуто)
| 1 |
| Angular.js, React.js, Ember.js
| 3 |
| SASS / LESS
| 3 |
| Git
| 2 |
Конечно пересекающиеся навыки могут быть в другом курсе, но мы смотрим именно то что в программах курса преподнесенных на сайтах как «курс Front-end».
В среднем все курсы с неплохой программой длятся около 6 месяцев.
- Никто не забыл включить в курс HTML, кроме одной компании, они на курсе Front-end, с какого-то перепугу учат Node.js, минуя браузерный JavaScript.
- Многие учат jQuery, не забывая добавить в программу Git, зато только треть курсов включили в программу фреймворк из списка Angular\React\Ember.
- Ни одна программа не имела полный список навыков, из тех что мы видели в вакансиях.
- Почти все курсы называли программу «курс Front-end» или похожее сочетание со словом «Front-end», но только половина имели в программе JS, в нескольких случаях JS предлагались как «некий продвинутый курс Front-end для гуру», то есть, базовые навыки маскировались под продвинутые. Кстати, 30% курсов не предлагали ничего кроме HTML\CSS, то есть не было даже jQuery.
Беглый обзор по остальным страничкам гугла показал, что самые дорогие курсы одни из худших, не очень дорогие но известные стоят где-то на середнячке, а вот дешевые как повезет, или что надо, или полный развод. Думаю тут прямая зависимость стоимости и известности от вложений в рекламу.
Кстати кому интересны конкретные курсы, шлите ссылку в скайп, проанализирую, опубликую краткое резюме по их программе.
«Трудоустраиваем», серьезно? =)
Этот пункт - самый популярный развод среди известных, можете сразу закрывать страничку курсов если дают 100% гарантии или что такое, он просто вызывает улыбку, поражает количество людей которые в него верят.
Давайте подумаем,
- абстрактный человек окончил курсы с плохими навыками.
- некая веб студия, согласилась взять человека с плохими навыками и платить ему зарплату со своего кармана, потому что какие-то там курсы их попросили.
Можно денежное дерево посадить говорят некоторому Буратино удалось так разбогатеть, или в какой-то финансовой пирамиде удачи попробуйте, шансов однозначно больше.
На работу берут потому что работник принесет деньги фирме, а для этого работник должен иметь некие навыки. Зависимость тут проста, будете иметь хорошие навыки - вас будут искать а не вы умолять их взять к себе, а «тренировочное собеседование», компании тоже «тренируются», таких тренированных у них уже пару сотен побывало, и вы будете сто первыми, отнявших их время.
Нет, безусловно составлять правильно резюме для технических специальностей надо уметь и конечно есть пару практичных советов на собеседовании, но все они нацелены на то чтобы вы показали свои навыки а не обманули рукрутера, вам нужны навыки в первую очередь, а не хитрость. Хитрость будет раскрыта, вы вылетите с работы, а при должном усердии еще и попадете в черный список, после этого вы вообще никогда не устроитесь больше на нормальную работу в ИТ фирму.
Все что вам светит с плохими навыками - третьесортная веб студия, с низкой зарплатой, так как вы там будете верстальщиком и не факт что хорошим, а верстка это то что умеет любой начинающий специалист в веб программировании, сумасшедшая конкуренция за каждое вакантное место, у них будет с кого выбрать.
«Заплатить за некоторое эфемерное трудоустройство стоимостью курса», я пишу об этом и меня снова тянет на смех. Вы можете позвонить родственнику и попросить пристроить сына, такое часто бывает, кумовство в нашей стране весьма распространено, но мы говорим про курсы, где это происходит массово, так что давайте еще раз подумаем....
Некий абстрактный дядя, раз в 3 месяца способен пристроить от 20 человек без навыков на огромную зарплату в фирму которая скорее всего будет даже не украинской? Да если такие идиоты и встретятся, сори за лексику, фирма оплачивая таких «специалистов» разорится.
Давайте еще немного посчитаем, представьте что таких курсов больше 20 в одном только Киеве, и все обещают трудоустроить. 400 человек трудоустроить на хотя бы 500 долл, это 200 тыс. долл. в месяц минимум, и каждые 3 месяца сума растет еще на 200 тыс долл. Минимум. В год выйдет 15 600 000 долларов, а на следующий год уже будет около 600 000 000 долларов, так как прогрессия геометрическая.
Представили? Теперь скажите насколько это реально может быть правдой, ни насколько, это просто обман.
Как тогда так выходит?
Даже на плохих курсах, всегда в группе есть 1-2 человека что занимались сами, выучились что называется не благодаря а вопреки, трудоустроились, за счет навыков. Заключив договор с курсами, они разрешили написать курсам что этих 2 человека выучились благодаря им, хотя это и обман.
Потому еще раз, будут навыки, будет и трудоустройство, ничего тут больше не надо. Все элементарно, куча конкурентов для вас не проблема, если вы будете уметь все что надо, потому что они этого уметь не будут, и их просто не возьмут, а вас возьмут.
У вас тоже трудоустраивают?
Кто-то зоркий явно заметит что при нашей веб студии тоже есть курсы, но как же тогда трудоустройство? Объясняю, наши курсы при веб студии, мы готовим специалистов для себя а не на общий рынок трудоустройства. Это выгодно так как даже опытного специалиста приходится доучивать\переучивать под особенности работы конкретных веб студий.
Практика распространенная, вы можете найти много таких студий с курсами , на правах рекламы я тут размещу и курсы при нашей студии , сайт доделывают, но самое главное - программы курсов, там есть. Вернемся к теме, собственно низкая квалификация от типовых курсов и заставляет создавать веб студиям свои курсы, но в рекламу сильно возможности вкладываться у таких курсов нет. Почему? Вот например, вступительный курс стоит 1800 в месяц, максимально 15 человек, итого 22500 в месяц, деньжищи! =D шучу. Только зарплата преподавателя это 7200, аренда 32 тысячи(для курсов пришлось расширить офис до 200 квадратов), амортизация, бесплатный коворкинг для студентов, с рекламой иногда идет в минус даже, и деньги берутся уже с бюджета студии а не курсов.
Курсы\интернатура при крупных компаниях
Где-то тут на доу была тема с этими курсами, в комментариях подскажут если кого заинтересует, но я бы не рекомендовал. Особенность этих курсов в массовости, у них большой поток, а как я говорил, на одну группу, хотя бы 1-2 человек учатся самостоятельно, этих людей им достаточно за счет большого количества групп вообще, тут та ситуация когда просто просеивают кучу народу в поисках уже состоявшегося специалиста(который этого не знает, а потому и чувство собственной важности у него не так высоко, умные компании любят платить меньше, чем работа того стоит).
Почему нельзя сделать по нормальному?
Ведь логично, с точки зрения курсов, им безразлично преподавать хорошо или плохо, для них, клиент должен быть довольным и нести деньги. Но, почему тогда не попытаться сделать нормально?
В двух словах - Дефицит кадров.
Так уж вышло, что большая часть из существующих языков программирования C подобные. То есть когда-то давно был изобретен такой язык как C, а большинство современных языков было написано на нем. Иногда бывало на C писался язык, а на этом языке писался еще один язык, но в предках все равно значился C. Даже когда писали языки не на основе C, то зачастую использовали C подобный синтаксис, так как программисты писавшие, помимо прочего владели несколькими C подобными, а следовательно переносили наработки оттуда. Рассказывать в чем фундаментальность этого языка долго, материалов на эту тему в интернете достаточно много, но так вышло, что практически все из существующих современных яп, очень похожи друг на друга и отличаются в основном мелкими деталями и списком возможностей, по этой причине программисту изучив один яп, легко уже изучить второй, так как второй он по сути на 50-80% уже знает.
А теперь JS. Так сложилась судьба, что JS был создан за 10 дней.
Когда вы что-то делаете, вы начинаете потом это улучшать, улучшать и тянуть на это удачные решения что вы видели где-то раньше. Но у автора было всего 10 дней, времени на все эти улучшалки просто не было, потому JS родился таким, каким его задумал автор изначально, а не очередным C подобным братом. Он конечно имеет схожий синтаксис и еще очень много чего подобного, да и история JS начисляет много лет, он обрастал функциями которые писались уже не 10 дней, но основные принципы всегда были неизменными, потому JS оставался белой вороной среди языков.
Я не хочу сказать что он использует какие-то особо хитрые закорючки, придуманные за 10 непрерывной пьянки или приема каких либо запрещенных веществ, но такое мнение раньше было очень распространено, я даже разделал его, но это не так, все совсем по другому.
Давайте посмотрите на графики развития популярности JS
В 2011 году, JS находился, где-то в глубине популярности, я сказал глубине а не конце списка популярности не просто так, думаю вы поняли о чем я. Он существовал только потому, что все аналоги были еще хуже, но при этом все его жутко ненавидели и старались избегать любых сложных функций.
Почему? В целом кучу народу среди программистов с наскоку пытались изучить JS, у них ничего не выходило, потому что как говорил ранее, они пытались его изучить с наскоку, как очередной C даже не читая документацию. Они использовали те же приемы что в других языках, те же операторы и конечно у них это все не работало вообще или работало но не так как хотелось бы. Не разобравшись, эти люди считали JS некой эзотерической штукой, а все баги списывали на производителей браузеров, а вот открыли документацию единицы, ведь не нубы, опытные программисты, можно не читать, ведь на первый взгляд, все так похоже на то что они учили раньше.
Такая антиреклама браузеров порождала то что браузеры начали ослаблять контроль ошибок над JS, ведь пользователям сайта не объяснишь что это у программистов руки не оттуда, они просто сменят браузер на тот, где любимый сайт работает корректно, в итоге все снова было списано на баганутось самого JS, хотя багов не было.
Так продолжалось весьма долгое время и нормальных JS программистов, по современному фронтэндщиков просто не появлялось, они в принципе никому небыли нужны.
Но маркетинг развивался и требовал нового! То здесь, то там, проскакивали разные классные штуки сделанные на JS и бизнес начал давить на программистов, ответы вроде «нормально сделать нельзя» встречали достойные «а вон там сделали, и говорят за 15 минут, без багов». В целом с 2011 года примерно, интерес к JS начал расти в геометрической прогрессии, а все потому что некоторых программистов таки заставили почитать документацию, они прочитали, прониклись и обалдели. Кстати я был среди них.
Итак, изучение JS остается сложной задачей для любого уже состоявшегося программиста, по прежнему существует мнение «JS баганутая, эзотерическая штука», и около 15 лет новые специалисты по JS появлялись очень редко, что у нас в результате? Кадровый голод.
Да это тот самый бум что вы сейчас наблюдаете, это очень большой, гигантский взрыв вакансий, всем резко понадобились фронтэндщики, для реализации их супер-пупер интерфейсов, а их не то что не было, существует дефицит старших специалистов, а среди тех что есть, только небольшой процент способен адекватно учить молодняк. И я говорю о больших компаниях, а вы надеетесь что банальные курсы где-то резко откопают адекватного преподавателя по JS, понятное дело эти преподаватели в огромном дефиците и в основном на тех самых курсах при веб студиях.
Часто мне приходилось слышать оба этих термина, причём люди, которые ими оперировали, порой даже близко не понимали их сути. Front-end (фронтенд ) и back-end (бекенд ) используются во многих сферах и отраслях, однако мы поговорим именно об IT, или, даже более конкретно, о Web-разработке.
Фронтненд - браузер, бекенд - сервер
Говоря я фронтенде и бекенде, программисты обычно подразумевают разделение интерфейсной части пользователя от программной логики. В этом случае front-end - это интерфейсная часть, которая выполняется, например, в браузере, а back-end - это серверная часть.
В Web-разработке, например, в качестве фронтенда выступают HTML-вёрстка, стили CSS и JavaScript, а в качестве бекенда - серверная часть, которую обычно программируют на PHP или ASP.net. Грубо говоря, всё то, что исполняется на стороне клиента - front-end , а то, что на стороне сервера – back-end . Кстати, поскольку пользователи не видят бекенд, то программисты могут поменять его «втихую». Twitter, например, в качестве бекенда некоторое время использовал Ruby on Rails, но в 2011 году перешел на Java. Готов поспорить, большинство даже и не заметило этого!
Фронтненд - статика, бекенд - программный код
В среде разработчиков высоконагруженных систем (highload-разработчиков) термином front-end называют ту программную часть, которая непосредственно «отдаёт» контент. Например, на больших проектах часто программную серверную часть представляют 2 веб-сервера - Apache и nginx. Nginx принимает запросы и, в случае статического файла, (изображение, файл css, js или xml) сразу же отдаёт его содержимое, а в случае PHP-скрипта, отправляет его к серверу Apache, который уже умеет обрабатывать PHP. Тут nginx - это фронтенд , а Apache - бекенд . Конечно, высоконагруженные системы имеют сложную инфраструктуру, и порой представляют собой много серверов, разнесённых по разным континентам, но общую суть вы уловили.
Фронтненд - открытые данные, бекенд - админка
Также, когда говорят об CMS, административную часть называют back-end , а «лицевую» часть сайта - front-end . С такой трактовкой термина я сталкивался реже всего, однако многие его применяют повсеместно.
Так что же такое фронтенд и бекенд?
Если вы не лишены логического мышления, то поймёте в чём нюанс: в одной сфере один и тот же термин имеет 3 (!) различных значения:
- Браузерная / серверная часть (самый популярный вариант);
- Серверная часть, отдающая статику / серверная часть, выполняющая код (highload);
- Часть сайта для пользователей / часть сайта для администраторов и модераторов.
Редактор «Нетологии» Светлана Шаповалова разбирается в том, кто такой фронтенд-разработчик, что он должен уметь (или не должен), и за что ему платят прекрасную зарплату (или не очень).
Кто такой фронтенд-разработчик
Согласно ежегодному исследованию StackOverflow, самая популярная профессия среди пользователей сервиса в 2017 году - это Web developer. Именно в эту категорию входят все фронтенд-разработчики.
Данные StackOverflow
Если зайти на первый попавшийся сайт по поиску работы, например, на hh.ru, создастся впечатление, что - это специалист-хамелеон.
Начинается все с путаницы в названиях вакансий: можно встретить и «front-end developer», и «front end разработчик», и «фронтендщик», и «фронтенд девелопер», и «web developer», и «фронтенд-разработчик». Иногда даже можно увидеть какого-нибудь «веб-верстальщика» с требованиями под фулстак-разработчика. Реакция на это одна: WTF?!
Беда в том, что часть работодателей не отличают (или не хотят отличать) верстальщика от фронтенд-разработчика, - это понятно по описанию вакансий. Разберемся, какие умения отделяют фронтенд-разработчика от «верстака» (верстальщики, не обижайтесь, вы тоже хорошие).
Верстальщик - боец узкого фронта. Его задача - сверстать полученный от дизайнера макет, используя HTML+CSS. Он, возможно, немного умеет в JavaScript, но чаще ограничивается умением прикрутить какой-нибудь плагин jQuery.
Фронтенд-разработчик не просто верстает макеты. Он хорошо знает JavaScript, разбирается во фреймворках и библиотеках (и активно юзает часть из них), понимает, что находится «под капотом» на серверной стороне. Его не пугают препроцессоры и сборщики LESS, SASS, GRUNT, GULP, он умеет работать с DOM, API, SVG-объектами, AJAX и CORS, может составлять SQL-запросы и копаться в данных. Получается сборная солянка навыков, к которым добавляется понимание принципов UI/UX-проектирования, адаптивной и отзывчивой верстки, кросс-браузерности и кросс-платформенности, а иногда и навыков мобильной разработки.
Фронтендщик в обязательном порядке умеет работать с контролем версий (Git, GitHub, CVS и т. д.), использовать графические редакторы, «играть» с шаблонами различных CMS.
Еще крайне желательно знать английский язык, чтобы не переводить спецификацию в Гугл-переводчике, уметь работать в команде, иногда мультиязычной, разбираться в веб-шрифтах, ну и понимать тестировщиков и сам процесс тестирования.
Итак, какие технологии должен освоить фронтенд-разработчик:
- HTML и CSS (в том числе сетки и CSS-фреймворки, спецификации W3C и WHATWG, HTML5/CSS3 Polyfills)
- Препроцессоры CSS (Sass, Less, Stylus и т. д.)
- JavaScript
- Популярные фреймворки и библиотеки: jQuery, Angular.JS, React.JS, Backbone.js и т. д.)
- OOCSS / BEM / SMACSS
- HTML5 API
- ECMAScript 6
- Популярные CMS (WordPress, Drupal, Joomla и т.д.)
- Понимать и разбираться в серверных технологиях (Node.js, PHP, Ruby, .NET и т. д.)
- Инструменты дебаггинга (Chrome Dev Tools, Firebug и прочие)
- JavaScript транспайлеры (Babel)
- Инструменты контроля версий (Git, GitHub, CVS и т. д.)
- Базы данных и языки запросов (SQL, MySql, NoSQL, MongoDB и т. д.)
- Графические редакторы (Photoshop, Illustrator и т. д.)
- кросс-браузерная и кросс-платформенная разработка;
- прогрессивное улучшение и изящная деградация;
- мобильная разработка;
- адаптивная и отзывчивая верстка;
- веб-шрифты;
- принципы SEO-оптимизации.
Что говорит статистика
Какие технологии и инструменты чаще всего используют фронтенд-разработчики? Во-первых, трудно представить фронтендщика, не умеющего в JavaScript. Это подтверждают опросы:- по данным StackOverflow, JavaScript в списке инструментов фронтенда лидирует с огромным отрывом (90,5%)
- исследование компании O"Reilly, проведенное среди европейских программистов в конце 2016 года, тоже ставит JavaScript на первое месте.
Данные StackOverflow
Если сгруппировать самые популярные инструменты в стеки, то получим такую ситуацию:
Данные StackOverflow
А набор самых популярных фреймворков и библиотек всех разработчиков выглядит следующим образом (см. иллюстрацию). Приятно видеть среди этого списка инструменты фронтенда:
Данные StackOverflow
Карьерный путь и зарплата фронтенд-разработчика
Карьерный путь фронтендера обычно начинается с верстальщика - это самый логичный и общепринятый вариант. Сначала изучается связка , затем на нее «наслаиваются» знания , библиотек и фреймворков. Будущий специалист также изучает ключевые понятия построения серверной части, добавляет сюда инструменты, необходимые для выбранной специализации. Затем все это шлифуется умением работать с контролем версий, графическими редакторами и пониманием принципов .Бывают и иные варианты. Если начинающий программист изначально знает, в какой сфере планирует развиваться, ничто не мешает ему изучать ключевой стек технологий сразу, а не по частям. Все зависит от целей и времени, которыми располагает будущий фронтендщик. Любой вариант приемлем, лишь бы на выходе получился толковый специалист.
У готового фронтенд-разработчика в целом есть три основных варианта развития:
- горизонтальный (совершенствоваться как специалист, тем самым постоянно повышая свою стоимость на рынке труда);
- вертикальный (расти по карьерной лестнице);
- диверсификационный (освоение смежных специальностей, превращение в фулстака и переквалификация).
Какой из них выбрать - зависит лишь от самого специалиста и его пожеланий/навыков.
Касаемо зарплат фронтенд-разработчиков: здесь, как и во всей IT-индустрии, нет единого стандарта оплаты. Все зависит от навыков и умения подать себя. Ну, и от везения иногда:)
Средняя зарплата фронтенд-специалиста по России, рублей/месяц
Средняя зарплата фронтенд-специалиста по Москве, рублей/месяц
По данным «Моего круга»
Традиционно годовая зарплата фронтенд-разработчиков в США чуть выше, чем по России. Однако, если вы работаете в филиале иностранной компании - вам такой разрыв, скорее всего, не страшен.
По данным PayScale
Как стать фронтенд-разработчиком
Для начала снять розовые очки. Обучение - это труд и самодисциплина. Большинство начинающих айтишников отсеиваются на этапе «хочу стать программистом и получать зарплату в долларах, но не думал, что придется так много учиться». Уникальность программирования и вообще любой айтишной специальности в постоянном самообучении. В этом и сложность, и прелесть IT-сферы. Если вас это не пугает - круто! У вас есть все шансы стать отличным специалистом.Главное правило будущего специалиста - ставить реальные цели в процессе обучения. В этом поможет планирование. Составьте список инструментов, которые планируете изучить, и держите его перед глазами.
Тем, кто стартует с нуля, надо начинать с и освоить их на уровне идеальной верстки PSD-макетов. На этом этапе также надо научиться работать с текстовыми и графическими редакторами и знать основные принципы дизайна (как плюс). Затем взяться за JavaScript: синтаксис, архитектура и возможности языка. Освоить популярные фреймворки и библиотеки, параллельно полюбить системы контроля версий и какой-нибудь из популярных таскраннеров. Добавить препроцессоры и фреймворки CSS, разобраться в серверных технологиях. А дальше можно пить смузи на Бали шлифовать полученные знания до бесконечности.
Примерный путь начинающего фронтенд-разработчика.
У вас он будет свой.
Пройти этот путь можно как в одиночку, так и с наставниками (вузы, курсы). Вот какие самые популярные форматы обучения разработчиков по версии StackOverflow:
Данные StackOverflow
На первом месте находятся онлайн-курсы, за них проголосовали 64,7% опрошенных разработчиков, затем идут: самообучение по книгам, офлайн-курсы, опенсорс-разработка и лагери программирования. Интересно, что высшее образование (Master’s degree) стоит практически на последнем месте.
Вывод
- это универсальный солдат. Он и макет заверстает, и веб-приложение построит, и серверную часть, если надо, освоит. Знать надо немало: HTML, CSS, JavaScript, библиотеки и фреймворки JS, препроцессоры и фреймворки CSS, системы контроля версий и таскраннеры, технологии бэкенда, юнит-тестирование и многое другое.Кроме того, нелишними будут soft skills: взаимодействие с людьми и работа в команде, умение наладить эффективный workflow и решать поставленные задачи наиболее оптимальным способом. Не обойтись без уверенных знаний английского языка.
Оплата труда фронтенд-специалиста вполне себе достойная, и чем больше навыков - тем выше шансы получить «жирный» оклад.
Стать фронтенд-разработчиком может каждый, кто не пасует перед самообучением: как мы выяснили, полагаться на вузовское образование сложно. Идеальный вариант - различные онлайн и офлайн-курсы + литература по теме, практика и великий Гугл.
«Нетология» запускает полноценную программу подготовки фронтенд-специалистов - . Это 6-месячный курс, посвященный базовым технологиям фронтенд-разработки: HTML и CSS, JavaScript, Web API, AJAX, веб-сокеты, библиотека React.
По итогу курса студенты создадут собственное одностраничное веб-приложение. Обучение ведут 10 практикующих фронтенд-специалистов - это позволяет получить всестороннее понимание инструментов и задач фронтенд-разработки. В течение всего обучения студенты получат не менее 100 практических заданий, максимально близких к «боевым», и реализуют 3 проекта среднего объема и 1 полноценный проект в качестве дипломной работы.
Все студенты, успешно окончившие курс, получают удостоверение о повышении квалификации установленного образца и фирменный диплом «Нетологии».
P.S. Как вы считаете, какие знания жизненно необходимы фронтенд-разработчику, а какие можно осваивать по мере надобности?
Backend — это программно-административная часть разработки сайта или другого ресурса. Именно здесь проходит процесс программирования и наполнения функционалом, создаётся ядро, разрабатывается платформа, выделяется административная зона. Backend разработчик создаёт серверную часть для интеграции базы данных и обеспечения обмена информацией с пользовательской стороной.
Чем отличается backend разработка
Современная методика разработки подразумевает выделение бэкенд и фронтенд частей. Ко второй относится пользовательский интерфейс и всё, что необходимо для работы с сайтом обычному посетителю. К backend разработке причисляют инструменты обработки поступающих от пользователя команд, бекенд является внутренней частью, работать с которой потом может только администратор.
Виды backend разработки
Своё применение backend разработка находит в разных областях создания информационных продуктов. Целью применения деления стало упрощение работы, актуальность метода по мере развития технологий лишь возрастает. Серверная и клиентская части обладают разной спецификой, поэтому разделение способствует увеличению эффективности. Работая в одной области, специалист может глубже изучить её особенности.
Качественный backend сайта отвечает за хранение данных и обработку сигналов, которые приходят от пользователя при использовании веб интерфейса. Серверная часть обеспечивает контроль за вводимыми посетителями данными, в том числе, для осуществления авторизации. Обеспечение безопасности играет тут немаловажную роль, большинство уязвимостей оказывается именно на стороне сервера.
Схожую задачу выполняет backend приложения, где присутствует сервер с базой данных, умеющий выдавать необходимую информацию согласно поступающих запросов. Такую структуру имеет процесс создания всех сайтов, приложений и программного обеспечения. От качества разработки серверной стороны зависит скорость взаимодействия и правильность управления контентом.
Что нужно знать backend разработчику?
Вызывает много споров вопрос, что нужно знать backend разработчику, ведь инструментарий для достижения поставленной цели может быть совершенно разным. Одну и ту же задачу можно решить различными способами, при этом каждый может оказаться по-своему эффективным. Главным является понимание, в чём заключается отличие backend разработки от frontend. Говоря об инструментах, нужно понимать, зачем надо инсталлировать Ruby и почему установка Javascript не требуется.
В качестве схемы работы ресурса применяется концепция MVC, что переводится на русский как «модель-представление-контроллер». Пользователь работает с последними двумя, видит «представление» и с помощью «контроллера» управляет им. Запрос через «контроллер» отправляется в «модель», где происходит обработка сигнала, вследствие чего меняется «представление». Можно сказать, что «модель» является серверной частью, а «представление» и «контроллер» — клиентской.
Для создания серверной части разработчик должен владеть такими backend языками программирования:
- javascript;
- java;
- python.
Для удобства разработчики пользуются фреймворками, представляющими собой программную платформу, набор инструментов и библиотек, это позволяет не тратить лишнее время на решение типовых задач.
Среди backend фреймворков наиболее популярны следующие:
- yii2;
- node js.
Данный набор инструментов не является исчерпывающим, в процессе работы и получения новых знаний backend разработчик может вносить изменения в свою деятельности, развитие технологий тоже не стоит на месте и предлагает новые варианты решения задач. Изучение основы необходимо, чтобы как можно глубже понимать специфику своей деятельности.
Как Qualcomm испортила смартфоны LG, HTC и Sony
Управление с андроида по wifi
Лаборатория информационной безопасности