Что такое frontend?
Вставка
- Опубліковано 30 кві 2020
- Стань программистом в LOFTSCHOOL bit.ly/3n5W7bu
Промокод на скидку AZBUKA
Бесплатный видеокурс "АЗБУКА ПРОГРАММИСТА" от Насти: loftschool.com/modules/212-az...
Всем привет, меня зовут Анастасия Редченкова, я 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 и так далее.
Спасибо, краткое и нужное видео! Лайк 100%
Спасибо большое все четко и ясно 🔥🔥🔥😍😍👍🏼👍🏼
Все по фактам и все понятно! спасибо и успехов!
Прекрасно, понятно и жестикуляция уместна👍
Офигенное видео все понятно и кратко лайк одназначно❤
Спасибо, очень классно 🔥
за 20 лет интернета столько всего придумали что и целой жизни не хватить выучить все ваши фраймвурки
Что такое фраймвурки🤯
Самых ходовых - 3, на остальные можно не обращать вниминие.
@@ivanlitovchenko1840 какие?
Да вроде 30+ лет
@@user-wf3mx1wk7v angular, vue, react
Спасибо очень очень!
Хорошо объяснила 😎
Ставлю свой царский лайк этой умнице и красатоше!!)
Читает текст
Спасибо
с приходом serverless границ между BE и FE будто совсем не стало
спасибо！
Вы стали Фронтенд-разработчиком??
Вот они ваши делепоперы, смотрим видос что такое фронт энд
Хочеш узнать что такое fron end а тебе дохрена рассказывають про фирму, куда кликать, какие цены
Из-за комментариев я не понимаю, верить ли этой информации или нет.
так всегда и везде)
Классно
Класс
Я не шарю в математике, возможно ли стать фронт енд специалистом? Фобия небольшая говорят мат нужен программистам, дайте совет пожалуйста.
Да
Зачем тебе фронтенд сейчас их очень много
@@astkh4381 а что же по вашему мнению сейчас актуально?
Без матеши будет очень сложно. Да и фронтендеры никому не нужны в 2023 году
@@IroquoisPliskin-gu9ro ты смешной
Спасибо тебе Красавица за такое же инфо
она тебя сожрееет хахаха
Просвітили)
Какая красотка ))
вы такая приятная
Девушка красотка
после того как она сказала аш-ти-ем-ель, ждал что скажет це-ес-ес 😹
Ксс
У меня так друг умер
@@NoName-js9xm памянем
@@NoName-js9xm здоровья погибшим
Вообще ничего не понимаю, я понял что такое бэк-енд, а вот фронт-енд, вообще нифига!
4:14
Кто не может разобраться в чем-то сам - ему никакие курсы не помогут. Ленивый программист - погромист.
Правильно! Лучшие хирурги - это самоучки. Те, кто самостоятельно изучает литературу и практикуется на бомжах за гаражами.
@@Vladdy89надеюсь бомжи после этого выживают
классная девушка
Интересно я когда продвинюсь дальше основ и что такое фронтенд и бакэнд? 😂😂😂 Когда я типа начал учить нынешние прогеры в школу ходили. Нормальных курсов нет.
есть такая тема, могу посоветовать поискать курсы на udemy, если конечно имеются начальные знания англ. языка, не знаю кому как, но на англ. мне заходит куда проще чем на русском, это учитывая что я пользуюсь переводчиком во время обучения, хех.
@@manofsteppe179 а какие курсы посоветуешь? Я думаю между джава и пхп. 😀 Хочу создавать сайты но работы в джава думаю больше. Какой курс выбрать чтоб не ошибиться и научиться больше основ а уже что-то делать стоящее.
@@manofsteppe179 ему хоть бы русский выучить для начала ,
1:50 не путать с HTML и CSS иначе выходит говнокодные сайты (коих больше 80%) которые не способны ни на что кроме пожиралова ресурсов. Отключение JS приводит к тому, что сайт не только не может отобраить данные но и обработать их. Хотя задача сайта зачастую иметь пару кнопок и обычную древнюю
Я понимаю что продавцам в принципе не нужно хорошо разбираться в том что они впаривают. Но вы хоть википедию чтоль посмотрите. Вы похожи на того специалиста директора который мне объяснял то верстка это все то что идет после дизайна)))) Хотя я рад что вы даете ложную информацию, у нормальных работников больше работы будет)
Гарний продавець,дуже гарно повинен знати,що він продає.
мне как-то логику делать проще чем верстать интерфейс,
BackEND
Каждому свое
в 36 лет реально стать фронтенд разработчиком ?
Конечно
Привет старик) как твои успехи? Я тут тоже решил поучиться, интересно за историю других и результат
фронт енд это полупрограммирование. тоесть Javascript это просто обращалка к DOM. другое дело если Typescript. но это отдельная большая тема
а если JS с TS
4 минуты воды, ради рекламы курсов
@@emantsal здесь скорее вопрос зачем создавать же видео длиной в 4 мин?
все вы ноль 0 без цысковедов. к ногам! )))
Ха-ха-ха, сказали электрики.
Ставь лайк если ты фронтендер и и так всё знаешь, но всё равно посмотрел видос чтобы поглазеть на девчонку
Расскажи что изучал , чтобы стать фронтендером
@@katyafrolik Начал с обычного js и jquery. Пытался делать какие-то прикольные приложухи чисто для себя. Потом решил попробовать устроиться на работу. Для этого я освоил React и подноверстал основы js (чтобы пройти собеседование). Когда нашёл работу пришлось освоить Angular так как мы на работе работаем именно с ним ну и с Vue3 так же довелось поработать
@@Tunec_s_hlebom а ты во сколько лет этим начал заниматься и сколько времени у тебя ушло на изучение всех этих программ?
Надо говорить короче и по-существу, а не эзоповским языком с тоннами воды.
мне одному кидается в глаза зуб в помаде ?
набрала вес по сравнению с видосами 2019г, печалька
с вами всё в порядке?следите за собой и не лезьте в чужую жизнь. позорище
@@marchmushroom6452 позоришься тут только ты, который лезет к чужим людям со своим мнением 🤦🏻
@@L_ink_S мда, всё понятно с вами, желаю почаще смотреть в зеркало и хотя бы иногда задумываться, прежде чем оставлять подобные комментарии
@@marchmushroom6452 🤦🏻 пока пока
@@L_ink_S а вы разве сами не лезете к чужим людям со своим мнением?)
Пожалуйста, избавьтесь от этой странной и отвлекающей жестикуляции руками!) Ну правда