Что такое frontend?

Стань программистом в LOFTSCHOOL
Промокод на скидку AZBUKA Бесплатный видеокурс "АЗБУКА ПРОГРАММИСТА" от Насти:
Всем привет, меня зовут Анастасия Редченкова, я frontend разработчик с 5 летним стажем. Работаю в датской компании Kraftvaerk, пишу интерфейсы на VueJs. Сегодня мы разберем один из первых терминов, с которым вам придется столкнуться, как только вы попытаетесь разобраться в веб разработке - и это Frontend. Традиционно веб разработку делят на 2 большие сферы - Frontend и Backend. Эти направления появились неслучайно, ведь сегодня веб уже далеко не такой простой, каким был раньше. Сейчас вас на сайтах встречают красивые анимации, реклама подобрана под ваши запросы, а что-то непонятное можно уточнить у онлайн консультантов. Все это потребовало разделить процесс разработки на две части, тот самый Frontend и Backend, что-то вроде сцены и закулисья. К Frontendу относится всё, что видит пользователь, то есть мы с вами, когда открываем веб-страницу. Это и сам интерфейс и функций, которые работают на клиентской стороне веб-сайта или приложения. Что значит работают на клиентской стороне? Открываем сайт Loftschool, кликаем правой кнопкой мышки, выбираем “Исходный код страницы” и вуаля, мы видим код, из которого на самом деле состоит наша страница. Браузер - это и есть клиентская сторона, то есть код, относящийся к frontendу есть у нашего браузера и мы можем его посмотреть. С backendом такой фокус не пройдет. Теперь немного о технологиях. В основе фронтенда лежат HTML — язык разметки, отвечающий за содержимое страницы. Это заголовки, абзацы, списки, картинки и многое другое. CSS — язык для описания внешнего вида страницы. Именно благодаря CSS-коду браузер понимает, как именно выглядит тот или иной элемент, какой у него цвет, фон, шрифт, как он расположен относительно других элементов. JavaScript — это язык, который создавался, чтобы оживить веб-страницы. Его задача — реагировать на действия пользователя - клики мышкой, перемещения курсора, нажатия клавиш. Кроме использования вышеперечисленных технологий, Frontend-разработчику также приходится тесно сотрудничать с дизайнерами, чтобы создать удобный и востребованный продукт. Так как чем понятней будет интерфейс, чем более подходящим способом будут структурированы данные, тем больше времени пользователь уделит сайту. Frontend и Backend тесно связаны друг с другом, их взаимодействие происходит по кругу. Frontend отправляет информацию в backend. Там она обрабатывается и возвращается обратно. Frontend придает этому ответу понятную форму. Пример, мы хотим войти на сайте в личный кабинет. Вводим свои данные и нажимаем кнопку войти - вплоть до этого момента все происходило на стороне frontendа. Теперь же frontend отправляет наши данные в backend. Он их обрабатывает и проверяет, и либо посылает нам данные для страницы личного кабинета или возвращает ошибку, что мы также увидим на экране. Обычно этими работами занимаются разные специалисты, но каждый из них должен хотя бы в общих чертах представлять, что происходит на противоположной стороне. Также есть специалисты, которые уверенно чувствуют себя как во frontend, так и в backend части и могут совмещать их. Их называют full-stack разработчики. Границы frontendа и backendа все больше размываются. Оба направления постоянно развиваются и заимствуют черты друг друга. Так, например, появился автономный фронтенд, который позволяет хранить логику приложения и данные в самом браузере. В этом есть как свои плюсы, так и минусы. На данный момент рынок труда заинтересован во Frontend специалистах и в будущем спрос на них будет только расти, ведь использование интернета за последние десять лет выросло практически в геометрической прогрессии. Почти каждая фирма, организация, предприятие имеют свой сайт и нуждаются в специалистах обеспечивающих их работу. Если вы в душе дизайнер, но любите программирование - эта специальность для вас, так как она часто требует не только глубокой практической подготовки по web-программированию, но и творческих способностей. Ну а начать свой путь в веб-разработке можно на сайте loftschool.com. Здесь вы найдёте качественные бесплатные курсы по всем самым востребованным веб-технологиям, а также дизайну и мобайл разработке. В том числе мой бесплатный курс “Азбука программиста”, в котором я простыми словами знакомлю вас с такими понятиями, как: фреймворк, cms, git, php и так далее.

Смотрите также