Вскоре после того, как вы окунетесь в воду разработки программного обеспечения, вы гарантированно столкнетесь с терминами «интерфейс» и «бэкенд». Есть еще фронтенд- и бэкенд-разработчики, но в чем разница? Что означают фронтенд и бэкэнд?
Как выясняется, и фронтенд, и бэкенд разработка, и системы включают в себя кодирование, и обе они являются важными частями разработки программных продуктов, будь то веб-сайт, настольное приложение или мобильное приложение.
Внешний интерфейс программы — это то, что видит пользователь. Если вы посмотрите на веб-сайт, даже такой простой, как страница входа, все, что вы видите на странице, считается внешним интерфейсом. Код внешнего интерфейса определяет стиль и макет страницы.
Бэкэнд программного обеспечения существует за кулисами. После того, как вы ввели свое имя пользователя и пароль, приложение должно проверить правильность информации. Ваш профиль и пароль сохраняются на сервере, а серверная часть отвечает за проверку вашего входа в систему и сообщает клиентской части об успешном входе.
Что такое Фронтенд?
Без фронтенда практически невозможно разработать интерактивный и удобный продукт. Без серверной части не было бы постоянства данных или бизнес-логики. И интерфейс, и сервер необходимы для создания интерактивных программных продуктов.
Внешний интерфейс подобен рабочему окну для проезда. Это часть процесса доставки, с которой пользователи напрямую взаимодействуют. Проездной работник может принять заказ пользователя по интеркому, передать готовую еду пользователю через окно, сообщить окончательную цену и принять деньги к оплате.
Фронтенд, или сквозной воркер, в этом случае не несет ответственности за:
- Измельчение лука
- Жарка картофеля фри
- Приготовление котлеты для бургера на гриле
- Сборка бургера
- Внесение денег в банк
Оконный работник, т. е. интерфейс, несет единоличную ответственность за взаимодействие с клиентом и предоставление пользователю обновлений, таких как передача приготовленной еды и прием оплаты.
Теперь давайте применим эту аналогию к веб-сайту. Внешний интерфейс отвечает за пользовательский интерфейс, логику на стороне клиента, форматирование и отправку запросов на серверную часть, получение ответов от серверной части, а также обработку и обновление пользовательского интерфейса на основе ответов серверной части.
Когда вы заходите на любой веб-сайт, внешний интерфейс отвечает за определение общего макета страницы, поведения прокрутки, кнопок и общего стиля. Пользовательский интерфейс также должен быть интерактивным. Внешний интерфейс не только определяет, какого цвета кнопка и где она появляется на странице, но и каковы последствия нажатия на кнопку.
В своем путешествии по изучению внешнего интерфейса вы столкнетесь с такими терминами, как «логика на стороне клиента». Логика на стороне клиента в этом случае относится к легким вычислениям или обработке информации или взаимодействиям, которые выполняет внешний интерфейс перед отправкой запроса на серверную часть. В нашей аналогии со сквозным проездом это похоже на то, как если бы вы отдали работнику неправильную сдачу. Она может быстро посчитать, сказать вам, что вы переплатили, и вернуть вам сдачу без участия бэкэнда.
Например, на странице входа внешний интерфейс, вероятно, проверит форматирование вашего адреса электронной почты, чтобы убедиться, что он имеет @, включает точку во второй половине адреса и что он соответствует остальным правилам форматирования адреса электронной почты.
Фронтенд также отвечает за форматирование и отправку запросов на бэкэнд. Как только внешний интерфейс проверит формат электронной почты, он отформатирует запрос на вход и отправит его на серверную часть. Распространенным протоколом, используемым для связи между интерфейсом и сервером, является HTTP (или HTTPS), который вы, вероятно, знаете как префикс для многих URL-адресов веб-сайтов, таких как https://boot.dev.
Отличным курсом для изучения того, как правильно настраивать и настраивать HTTP-запросы для подключения внешнего и внутреннего интерфейса, является HTTP-курс Boot.dev.
Бэкенд будет отвечать на запрос, а фронтенд отвечает за получение этих ответов, их обработку и обновление пользовательского интерфейса на их основе. Как только сервер ответит об успешном входе в систему, внешний интерфейс должен обновить страницу, чтобы отобразить домашнюю страницу вместо экрана входа в систему.
Лучшие языки программирования внешнего интерфейса 🔗
Наиболее распространенные языки внешнего интерфейса включают HTML и CSS. Это классические (и почти необходимые) языки программирования внешнего интерфейса, и они использовались для создания пользовательских интерфейсов почти 30 лет. Он настолько вездесущ, потому что браузеры изначально понимают HTML и CSS. Практически невозможно создать интерфейс, который работает в веб-браузере без HTML и CSS.
В последние годы JavaScript стал очень популярным языком программирования для фронтенд-разработки, потому что с его помощью очень легко создавать анимированный пользовательский интерфейс. Многие из более современных поведений внешнего интерфейса, такие как эффекты смахивания, кнопки, которые выглядят так, как будто они проталкиваются глубже, когда вы нажимаете на них, и многое другое, благодаря JavaScript.
TypeScript очень похож на JavaScript и используется по многим тем же причинам, и у каждого программиста есть свои предпочтения между ними. TypeScript приобрел большую популярность благодаря среде разработки интерфейса Facebook React.
Лучшие интерфейсные фреймворки 🔗
Фреймворки значительно упрощают разработку программного обеспечения, учитывая структуру и готовые функциональные возможности, с которыми они поставляются. Некоторые распространенные интерфейсные фреймворки включают React, Vue и Svelte. MonoCubed составил исчерпывающий список самых популярных интерфейсных фреймворков с указанием их плюсов и минусов. Вот сжатая версия:
Где научиться программированию на фронтенде 🔗
Фронтенд-программирование имеет множество аспектов, но, к счастью, существует множество вариантов изучения того, как разрабатывать интерфейсы для программ. У Scrimba есть Руководство по фронтенд-разработке для начинающих. FreeCodeCamp содержит около 200 статей и руководств, которые помогут вам освоить интерфейсную разработку. На Boot.dev есть курсы JavaScript и HTTP, которые научат вас базовым концепциям, которые помогут вам быстро разрабатывать надежные интерфейсы.
Существует множество учебных курсов по программированию и онлайн-руководств, которые помогут вам научиться разрабатывать интерфейсы. Одним из моих любимых для начинающих является Руководство по React, так как оно очень хорошо документировано и настолько популярно, что практически гарантированно всегда будет обновляться. Если вы это сделаете, вы сразу же почувствуете себя профессионалом.
Мы рассмотрели интерфейс. Теперь заглянем за кулисы.
Что такое бэкэнд?
Серверная часть программного приложения обрабатывает задачи, которые пользователь не видит напрямую. В обязанности бэкенда входит хранение и систематизация данных, настройка связи между сервером, базой данных и приложением, а также выполнение сервисов бизнес-логики. Бэкэнд-разработчик также будет отвечать за написание и поддержку API.
Это звучит как бессмысленные модные словечки, не так ли? Давайте представим себе бэкэнд Facebook в качестве примера. Серверная часть отвечает за хранение и организацию данных, которые отслеживают ваших друзей на Facebook. Когда бэкэнд настраивает связь, это означает, что он делает ваш сохраненный профиль пользователя доступным для внешнего интерфейса, который является мобильным приложением и веб-сайтом Facebook.
Давайте рассмотрим еще один пример, чтобы понять службы бизнес-логики, которые являются общим термином, охватывающим процессы, уникальные для этого продукта или бизнеса.
Например, предположим, что вы находитесь на веб-сайте банка и вошли в свою учетную запись. Вы хотите запросить перевод средств.
После того, как вы нажмете кнопку «перевести», интерфейс отформатирует и отправит запрос API с предоставленной вами информацией, такой как номер счета получателя и сумма, которую вы хотите перевести. Бэкенд-сервер получает этот запрос и начинает действовать.
Вероятно, на этом этапе происходит довольно много разных серверных служб, одна из которых будет отвечать за фактическое выполнение логики, которая удаляет деньги с вашего счета и добавляет их к счету получателя. Эти различные процессы являются службами бизнес-логики. Они специфичны для процесса банковского перевода средств и не будут полезны для другого продукта.
Лучшие языки программирования бэкенда 🔗
Большинство людей согласны с тем, что при принятии решения сначала изучить интерфейс или серверную часть вашей основой должен быть серверный. (Кроме того, бэкенд-инженеры зарабатывают больше, чем фронтенд.) Фронтенд может быть довольно привередливым, чтобы полностью освоить его, и достаточно легко добраться до точки, где вы можете получить метод для вывода того, что вы хотите.
По этой причине большинство классических компьютерных программ обучают своих студентов сначала Java. Благодаря своему универсальному признанию и классическому дизайну Java остается очень популярным языком программирования серверной части. Некоторые из других лучших языков программирования для серверной части включают Go, Python, JavaScript и Rust.
Таблица из нашей статьи о лучших языках программирования для серверной части.
У каждого языка программирования есть свои плюсы и минусы, поэтому выбор языка для разработки серверной части зависит от ограничений и целей.
Общие бэкэнд-технологии и фреймворки 🔗
Фреймворки — важная часть разработки поддерживаемых, современных и практичных серверных технологий. Неудивительно, что так много компаний и сообществ с открытым исходным кодом прилагают согласованные усилия для разработки мощных и полезных серверных фреймворков.
Некоторые из самых популярных серверных фреймворков включают Laravel, .NET, NodeJS, Django и Flask. Статика и данные собрали крутую анимационную графику, показывающую изменения популярности серверных фреймворков за последние десять лет.
Бэкенд-технологии разнообразны и многочисленны. Kubernetes, Docker, Apache, TensorFlow, Apache Hadoop и многие другие — это поразительные серверные технологии, которые чрезвычайно полезны и специализируются на том, что они делают. Если вы не внедряете машинное обучение в свою серверную часть, TensorFlow, вероятно, вам не нужен. Тем не менее, есть куча крутых инструментов. Некоторые из них бесплатны, а некоторые нет. Есть даже компании, которые предлагают бэкэнд как услугу, поэтому вам нужно будет только заняться внешним интерфейсом и подключить его к предоставленному бэкэнду.
Общие базы данных, используемые в бэкенд-разработке 🔗
Базы данных и управление ими являются неотъемлемой частью серверной части. Приложение, которое не имеет постоянства, не очень полезно. Если бы ваш Google Диск не сохранял документы после того, как вы их закрыли, это не принесло бы много пользы.
Наиболее распространенными базами данных, используемыми в бэкэнде, являются MySQL, PostgreSQL, DynamoDB и MongoDB. Boot.dev составил руководство по лучшим бэкэнд-технологиям, чтобы понять, какая база данных лучше всего подходит для каждого сценария, и если вы заинтересованы в более глубоком погружении в SQL, вы можете ознакомиться с их курсом изучения SQL.
Где научиться бэкенд-разработке 🔗
Если вам интересно научиться разрабатывать бэкенды и вы хотите знать, что происходит за кулисами программного приложения, есть много отличных способов научиться этому!
Если вы хотите подписаться на учебный курс по бэкенду или начать с изучения некоторых руководств, существует множество вариантов. Boot.dev — отличный вариант, если вы хотите учиться в своем собственном темпе и не платить высокую плату за курс. Nucamp предлагает больше ручного захвата, но стоит значительно дороже. Nashua Community College более доступен по цене, чем Nucamp, но предлагает меньше прямого взаимодействия с преподавателями.
Если вы хотите выбрать более дешевый вариант, чем учебные курсы по кодированию, учебные пособия — отличный способ. Они почти всегда бесплатны, но это самый экстремальный маршрут для самоучки, который может быть разочаровывающим и медленным.
FreeCodeCamp.org составил отличное руководство для начинающих по написанию вашего первого серверного приложения. Поскольку JavaScript — такой универсальный и популярный язык, я думаю, что это руководство по созданию бэкенда на JavaScript также заслуживает внимания.
Что означают фронтенд и бэкенд?
Противопоставлять их друг другу — ложная дихотомия. Бэкенд и фронтенд — две стороны одной медали. Оба они включают в себя написание кода, запуск процессов, прием входных данных и создание выходных данных, и оба они необходимы для создания потрясающих программных продуктов.
Каждая компания или даже команда может провести границу между ними немного по-разному. Кто-то должен нести ответственность за связь между фронтендом и бэкендом, и даже если вы назначите разработчиков строго бэкендом или фронтендом, им необходимо координировать и общаться, чтобы создать бесшовную интеграцию между ними.
Овладев этими двумя техническими стеками, вы сможете начать солидную карьеру, зарабатывать реальные деньги и делать что-то веселое и приносящее удовлетворение своей работой.
Изучите бэкенд, не тратя 10 000 долларов
- Пишите современный код на JavaScript, Python и Go
- Создавайте и развертывайте реальные серверные проекты в своем личном портфолио
- Конкурировать на рынке труда, освоив основы компьютерных наук
Нашли проблему в этой статье?
Первоначально опубликовано на https://blog.boot.dev 13 декабря 2022 г.
