Простыми словами о «фронтенде» и «бэкенде»: что это такое и как они взаимодействуют. Frontend- и backend-разработка: принципы и отличия Что должен знать backend разработчик

По пунктам: что нужно знать о бэкенде новичку в веб-разработке

  1. Запоминающая предыдущее состояние - реализуется с помощью сессий. Пользователь авторизуется один раз, а затем получает возможность свободно передвигаться по приложению и доступ к защищенным ресурсам (таким, как банковские транзакции или селфи в Snapchat), не отправляя данные, которые подтверждают его вход повторно.
  2. Не запоминающая предыдущее состояние - реализуется с помощью токенов. Пользователи делают все то же самое, но при выполнении каждого HTTP-запроса пользователю нужно отправлять идентификационные данные. Так обычно поступают с REST API. Сейчас золотой стандарт, не запоминающей состояние аутентификации с токенами, - JWT .

Есть и более продвинутый сценарий - многофакторная аутентификация. Она повышает безопасность приложения, добавляя дополнительные уровни защиты к логину и паролю. Хорошие примеры реализации есть у Google и Amazon .

Прим. перев. А у нас есть про двухфакторную аутентификацию и протокол FIDO U2F.

Заметьте, что для задач CRUD вам также нужно будет научиться проверять входящие данные и сверяться с разрешениями, прежде чем вы сделаете что-то с этими данными.

4. REST

Чтобы обеспечить управление ресурсами в вашем приложении (такими, как книги или аккаунты), нужно реализовать программный слой, принимающий запросы и формирующий ответы. Здесь вам доведется поработать с маршрутами (routes) и контроллерами (controllers). Они обеспечивают соблюдение ограничений, накладываемых REST - стилем архитектуры программного обеспечения для распределенных систем.

В типичном приложении на Ruby маршрут выглядит так:

Get "/photos/:id", to: "photos#show"

Что в это время происходит в системе:

  1. Приходит запрос на фото с этим маршрутом и передается контроллеру с помощью метода show .
  2. Этот метод, обращаясь к ресурсу из базы данных или к другому API, формирует и передает ответ в формате HTML или JSON.
  3. Клиент (в данном случае браузер компьютера) получает ответ и выводит фото на экран.

Запросы могут приходить из многих источников (их называют клиентами). Чаще всего запросы для веб-приложения формируются в форме ввода браузера. Но, если вы пишете бэкенд для мобильного приложения, то клиент - это API приложения, и он посылает запросы GET, POST, PUT, DELETE из приложения.

5. Формы и состояния

Формы - это самый распространенный способ общения пользователей с приложением. В основном через них пользователи и вводят все данные.

Вам надо создать формы для взаимодействия с бэкендом: если пользователь заказывает билет на концерт, то форма должна выглядеть, как сетка мест:

Когда пользователь начинает взаимодействовать с формой, вам надо сделать следующее:

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

6. API

Чтобы ваше приложение стало по-настоящему популярным, вам надо начать делиться данными с другими приложениями. Например, вы - музыкальная компания, и вы хотите, чтобы стриминговые сервисы типа SoundCloud поставляли ваш контент, а пользователи могли покупать вашу музыку напрямую из их приложения. Здесь и нужен API.

17. Командная строка

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

Бэк-энд разработчик (с англ. back-end (оборотная сторона) developer) это специалист, который занимается программно-административной частью веб-приложения, внутренним содержанием системы, серверными технологиями — базой данных, архитектурой, программной логикой. Профессия подходит тем, кого интересует информатика (см. выбор профессии по интересу к школьным предметам).

Бэк-энд разработчик — боец невидимого фронта.

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

Говоря образно, бэк-энд разработка — это создание двигателя автомобиля, в то время как фронт-энд разработка — это создание дизайна и функций управления машины. Бэк-энд разработчик работает в тесной связи с фронт-энд разработчиком , получая от него пользовательскую информацию и возвращая ему обработанный результат.

Основные инструменты бэк-енд разработчика - серверные языки программирования: такие как PHP, Python, Ruby, Java, Perl, Node JS (программная платформа). Дополнительно к Node JS полезно изучить Express (библиотека для взаимодействия платформы Node JS с сервером) и Mongo DB (базу данных для получения и хранения информации).

В качестве дополнительных средств применяются фреймворки Symfony, Codeigniter, Yii, Zend Framework, Kohana и др. С целью хранения данных используются MySQL/SQLite.

Особенности профессии

Современным разработчикам недостаточно только писать код для программ. Так работали программисты 10-15 лет назад. В настоящее время такой термин неуместен, потому что в работе часто можно обойтись без написания кода, просто соединяя между собой готовые части в единую конфигурацию. И программистов сейчас называют «разработчик» или «инженер».

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

Таким образом, функционал бэк-энд разработчика выглядит следующим образом:

  • проектирование архитектуры сервиса;
  • создание ядра сайта;
  • разработка платформы и основного функционала;
  • работа с архитектурой кода;
  • разработка приложений, поддерживающих пользовательский интерфейс и безопасность;
  • контроль за состоянием серверов (боевого, тестового и рабочего);
  • контроль версий, базы данных, непрерывной интеграции.

Плюсы и минусы профессии

Высокооплачиваемая и востребованная профессия.

Место работы

Компании по разработке сайтов, веб-приложений, мобильных приложений.

Важные качества

  • аналитический склад ума
  • логическое мышление
  • инициативность
  • способность планировать и следовать планам
  • умение работать в команде
  • гибкость мышления
  • ответственность, упорство, целеустремлённость
  • нацеленность на результат и качество
  • стремление к постоянному изучению нового и его применению в своей работе

Профессиональные знания и навыки

Знание хотя бы одного языка программирования: Go, C, C++, Perl, Python, PHP, Ruby, Java.

  • умение писать быстрый, красивый и правильный код;
  • знание популярных веб-фрейморков (Django, Flask, Spring);
  • умение проектировать базы данных и оптимизировать запросы;
  • знание современных парадигм программирования;
  • знание паттернов проектирования;
  • понимание устройств веб-сервисов, интерфейсов;
  • английский язык для чтения технической документации.

Где учиться на Бэк-энд разработчика

Обучает (Очно, Москва). Международное учебное заведение, специализирующееся на компьютерном образовании. Работает с 1999 года. 42 филиала в 16 странах мира. Крупнейший авторизованный учебный центр Microsoft, Cisco, Autodesk. Студенты получают международные сертификаты и международный диплом. Главная цель – трудоустройство каждого выпускника.

Высшее образование:

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

Но при этом важно помнить, что вузовское фундаментальное образование закладывает основу образования, но недостаточно для актуальных знаний о современных технологиях. Поэтому в этой сфере важно самообразование, чтобы быть в курсе всех новых технологий и инструментов. Но, в свою очередь, отсутствие профильного образования сказывается в тот момент, когда что-то перестаёт работать и человек не понимает — по какой причине. Специалист с фундаментальным образованием, конечно, всего не знает, но у него есть главный навык — где найти и как использовать необходимые знания.

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

Оплата труда (сколько зарабатывает Бэк-энд разработчик)

Зарплата на 16.09.2019

Россия 40000—100000 ₽

Москва 80000—300000 ₽

Ступеньки карьеры и перспективы

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

Backend-разработчику нужно иметь хорошее фундаментальное техническое образование. Качественное образование дают МФТИ, МГТУ, МГУ, ИТМО или МИФИ. Но многое зависит от человека, от его желания и интереса. При наличии желания хорошее образование можно получить и в менее престижных вузах.

Профильные факультеты

Отсутствие профильного образования приведет к тому, что, когда у человека что-то не заработает, он просто не поймет, почему. Специализация очень важна: есть алгоритмы, структуры данных, понятие конечного автомата. Люди без специального образования не знают этого, и у них возникает много вопросов. Для разработчика важен особый навык — не знать всё подряд (это априори невозможно), а знать о существовании определенных вещей, о том, где их найти и как использовать.

Mail.Ru Group запустила программу бесплатного дополнительного образования «Технопарк » для студентов МГТУ им. Баумана, в рамках которой можно получить все необходимые для backend-разработчика теоретические знания и практические навыки.

Книги

Совершенный код. Мастер-класс

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

Приемы объектно-ориентированного проектирования. Паттерны проектирования

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

Веб-разработчик

Вы наверняка уже слышали эти модные в сфере программирования слова «фронтенд» и «бэкенд», но что за ними стоит? Предлагаю в этом разобраться.

Давайте начнем с определений.

Фронтенд - все, что браузер может читать, выводить на экран и / или запускать. То есть это HTML, CSS и JavaScript.

HTML (H yperT ext M arkup L anguage) говорит браузеру, каково содержание страницы, например, «заголовок», «параграф», «список», «элемент списка».

CSS (C ascading S tyle S heets) говорит браузеру, как отображать элементы, например, «после первого параграфа отступ в 20 пикселей» или «весь текст в элементе body должен быть темно-серым и написан шрифтом Verdana».

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

Бэкенд - все, что работает на сервере, то есть «не в браузере» или «на компьютере, подсоединенном к сети (обычно к Интернету), который отвечает на сообщения от других компьютеров».

Для бэкенда вы можете использовать любые инструменты, доступные на вашем сервере (который, по сути, является просто компьютером, настроенным для ответов на сообщения). Это означает, что вы можете использовать любой универсальный язык программирования: Ruby, PHP, Python, Java, JavaScript / Node, bash. Это также означает, что вы можете использовать системы управления базами данных, такие как MySQL, PostgreSQL, MongoDB, Cassandra, Redis, Memcached.

Структура взаимодействия бэкенда и фронтенда

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

Серверные приложения

В этом случае HTTP-запросы отправляются напрямую на сервер приложения, а сервер отвечает HTML-страницей.

Между получением запроса и ответом сервер обычно ищет по запросу информацию в базе данных и встраивает ее в шаблон (ERB, Blade, EJS, Handlebars).

Когда страница загружена в браузере, HTML определяет, что будет показано, CSS - как это будет выглядеть, а JS - всякие особые взаимодействия.

Связь с использованием AJAX

Другой тип архитектуры использует для связи AJAX (A synchronous J avaS cript and X ML). Это означает, что JavaScript, загруженный в браузере, отправляет HTTP-запрос (XHR, XML HTTP Request) изнутри страницы и (так сложилось исторически) получает XML-ответ. Сейчас для ответов также можно использовать формат JSON.

Это значит, что у вашего сервера должна быть конечная точка, которая отвечает на запросы JSON- или XML-кодом. Два примера протоколов, используемых для этого - REST и SOAP.

Клиентские (одностраничные) приложения

AJAX позволяет вам загружать данные без обновления страницы. Больше всего это используется в таких фреймворках, как Angular и Ember. После сборки такие приложения отправляются в браузер, и любой последующий рендеринг выполняется на стороне клиента (в браузере).

Такой фронтенд общается с бэкендом через HTTP, используя JSON- или XML-ответы.

Универсальные/изоморфные приложения

Некоторые библиотеки и фреймворки, например, React и Ember, позволяют вам исполнять приложения как на сервере, так и в клиенте.

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

Вне фронтенда и бэкенда

Автономный фронтенд

Веб-приложениям, которые вы собираетесь создавать, подключение к Сети будет требоваться всё меньше и меньше.

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

Легкий бэкенд

Бэкенд, в свою очередь, становится легче и легче. Такие технологии, как хранилища документов и графовые базы данных, приводят к сокращению количества обращений к бэкенду для повторного агрегирования данных. Задача клиента - уточнить, какие данные ему нужны (базы данных графов), или извлечь все различные фрагменты данных, которые ему нужны (REST API).

Сейчас можно создавать бэкенд-сервисы, которые работают не постоянно, а только тогда, когда они нужны, благодаря бессерверным архитектурам, таким как AWS Lambda.

Размытые границы

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

Каждый из вариантов имеет свои плюсы и минусы. Сервер - среда более стабильная, имеет меньше неизвестных, но ему постоянно нужно подключение к Сети. Некоторые пользователи используют последние версии браузеров, и им выгоднее использовать клиентские приложения, которые и делают большую часть работы, и могут похвастаться красивым интерфейсом, но тогда вы оттолкнёте пользователей, которые не используют новейшие браузеры и высокоскоростное подключение к Интернету.

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

– людях, которые создают современное интернет пространство, мы уже рассказывали в блоге. Сегодня углубимся в их профессию и поговорим подробнее про специализации веб-разработчиков – front-end, back-end и fullstack.

Frontend-разработчик

Front-end – «лицевая» часть сайта: всё, что видит пользователь. Меню, текст, картинки, раздражающие (или, если сделано хорошо, не раздражающие) рекламные баннеры – всем этим занимается frontend-разработчик. В разработке дизайна он тоже участвует: «рисует» всё, конечно, но контролирует его работу именно фронтенд.

Задачи frontend-разработчика

В конечном итоге, бэкенд-разработчик отвечает за всё, что не относится к «фронтальной» части сайта.

Инструменты бэкенд-разработчика: Java, SQL, C#, Python.

У backend-разработчиков в «арсенале» десятки языков. У каждого есть какие-то плюсы и минусы: одни хорошо подходят для больших проектов, другие для маленьких. Так что способ реализации back-end выбирает сам, исходя из пожеланий заказчика и задач.

Full-stack-разработчик

По данным «Мой круг» full-stack и back-end разработчики в 2018 году получают до 140 тысяч рублей. Front-end – до 125 тысяч.

Может ли один и тот же человек заниматься и фронтенд, и бэкенд разработкой? Если он разбирается и в том, и в другом – почему нет: такой разработчик называется Full Stack.

Он умеет решать любые задачи по разработке веб-сервисов и сайтов: знает серверные языки, JavaScript, HTML и CSS, может оптимизировать сайт под поисковики и превратить сделанный в Photoshop макет дизайна в рабочий интерфейсный код (вы же помните, что интерфейс сайта рисует дизайнер, но на самом сайте всё будет описано кодом?).

Как правило, fullstack-разработчика нанимают для небольших проектов, с которыми может справиться один человек. Такие программисты, как правило, не становятся экспертами ни во фронтенде, ни в бэкенде, зато неплохо разбираются в общей логике работы сайта и взаимодействии пользовательской части с серверной. Это, кстати, очень важно: многие front-end и back-end разработчики просто не понимают друг друга и ставят невыполнимые задачи, а full-stack специалист как раз может стать связующим звеном.

Учиться сразу на fullstack нет смысла: обычно программист сперва осваивает одну часть работы – frontend или backend – и уже потом добавляет к багажу знаний навыки по смежному направлению.

С чего начать?

Чтобы стать полноценным front-end, back-end или full-stack разработчиком требуются годы практики и десятки проектов. Но начать путь к этой профессии можно даже если ты еще не закончил школу: изучать HTML, CSS, JavaScript, практиковаться и оттачивать навыки с помощью .

mob_info