Что такое frontend?

Стань программистом в 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 и так далее.

Пікірлер: 92

  • @viktorriabiy
    @viktorriabiy2 жыл бұрын

    Спасибо, краткое и нужное видео! Лайк 100%

  • @Kai_mir
    @Kai_mir2 жыл бұрын

    Спасибо большое все четко и ясно 🔥🔥🔥😍😍👍🏼👍🏼

  • @user-qe5xe4jt5s
    @user-qe5xe4jt5s2 жыл бұрын

    Прекрасно, понятно и жестикуляция уместна👍

  • @vitdem8987
    @vitdem8987 Жыл бұрын

    Все по фактам и все понятно! спасибо и успехов!

  • @DenchikPrama
    @DenchikPrama2 ай бұрын

    Офигенное видео все понятно и кратко лайк одназначно❤

  • @talevnin
    @talevnin Жыл бұрын

    Спасибо, очень классно 🔥

  • @SARGTITAN
    @SARGTITAN3 жыл бұрын

    Спасибо очень очень!

  • @vitaliykiryushin4542
    @vitaliykiryushin45422 жыл бұрын

    Хорошо объяснила 😎

  • @clickabelno
    @clickabelno4 жыл бұрын

    Ставлю свой царский лайк этой умнице и красатоше!!)

  • @user-dw6zh6ye1v

    @user-dw6zh6ye1v

    3 жыл бұрын

    Читает текст

  • @user-pr3qj2dj3m
    @user-pr3qj2dj3m2 жыл бұрын

    за 20 лет интернета столько всего придумали что и целой жизни не хватить выучить все ваши фраймвурки

  • @nartov34

    @nartov34

    2 жыл бұрын

    Что такое фраймвурки🤯

  • @ivanlitovchenko1840

    @ivanlitovchenko1840

    2 жыл бұрын

    Самых ходовых - 3, на остальные можно не обращать вниминие.

  • @user-wf3mx1wk7v

    @user-wf3mx1wk7v

    2 жыл бұрын

    @@ivanlitovchenko1840 какие?

  • @fannylife2661

    @fannylife2661

    2 жыл бұрын

    Да вроде 30+ лет

  • @ivanlitovchenko1840

    @ivanlitovchenko1840

    2 жыл бұрын

    @@user-wf3mx1wk7v angular, vue, react

  • @user-pz6ki3ws8m
    @user-pz6ki3ws8m4 жыл бұрын

    спасибо!

  • @fity6020

    @fity6020

    Жыл бұрын

    Вы стали Фронтенд-разработчиком??

  • @vyachislove2502
    @vyachislove25024 жыл бұрын

    Вот они ваши делепоперы, смотрим видос что такое фронт энд

  • @DevMagazineChannel
    @DevMagazineChannel4 жыл бұрын

    с приходом serverless границ между BE и FE будто совсем не стало

  • @veneradzhunusalieva4027
    @veneradzhunusalieva40272 жыл бұрын

    Спасибо

  • @orxanali005
    @orxanali0053 жыл бұрын

    Спасибо тебе Красавица за такое же инфо

  • @keeper6859

    @keeper6859

    3 жыл бұрын

    она тебя сожрееет хахаха

  • @user-ml3gu9er9k
    @user-ml3gu9er9k2 жыл бұрын

    Хочеш узнать что такое fron end а тебе дохрена рассказывають про фирму, куда кликать, какие цены

  • @user-sj6bs3di7b
    @user-sj6bs3di7b4 ай бұрын

    Классно

  • @vellouki
    @vellouki3 жыл бұрын

    Из-за комментариев я не понимаю, верить ли этой информации или нет.

  • @hook_off

    @hook_off

    2 жыл бұрын

    так всегда и везде)

  • @KayoKayf
    @KayoKayf9 ай бұрын

    Класс

  • @sacred767
    @sacred767 Жыл бұрын

    Какая красотка ))

  • @Lucky-ce4dp
    @Lucky-ce4dp2 жыл бұрын

    Просвітили)

  • @forgiveness_denied
    @forgiveness_denied4 жыл бұрын

    после того как она сказала аш-ти-ем-ель, ждал что скажет це-ес-ес 😹

  • @user-yq3rz6ug7f

    @user-yq3rz6ug7f

    2 жыл бұрын

    Ксс

  • @NoName-js9xm

    @NoName-js9xm

    2 жыл бұрын

    У меня так друг умер

  • @arhamfon7009

    @arhamfon7009

    2 жыл бұрын

    @@NoName-js9xm памянем

  • @hook_off

    @hook_off

    2 жыл бұрын

    @@NoName-js9xm здоровья погибшим

  • @Goja123
    @Goja1232 жыл бұрын

    Девушка красотка

  • @max_dos1434
    @max_dos1434 Жыл бұрын

    Я не шарю в математике, возможно ли стать фронт енд специалистом? Фобия небольшая говорят мат нужен программистам, дайте совет пожалуйста.

  • @justcouse8671

    @justcouse8671

    Жыл бұрын

    Да

  • @astkh4381

    @astkh4381

    Жыл бұрын

    Зачем тебе фронтенд сейчас их очень много

  • @n1nja847

    @n1nja847

    Жыл бұрын

    @@astkh4381 а что же по вашему мнению сейчас актуально?

  • @IroquoisPliskin-gu9ro

    @IroquoisPliskin-gu9ro

    Жыл бұрын

    Без матеши будет очень сложно. Да и фронтендеры никому не нужны в 2023 году

  • @astkh4381

    @astkh4381

    Жыл бұрын

    @@IroquoisPliskin-gu9ro ты смешной

  • @ZeusZeus-cq6qt
    @ZeusZeus-cq6qt Жыл бұрын

    вы такая приятная

  • @user-oi7nu1qz8v
    @user-oi7nu1qz8v2 жыл бұрын

    Вообще ничего не понимаю, я понял что такое бэк-енд, а вот фронт-енд, вообще нифига!

  • @KG-tp1tf
    @KG-tp1tf2 жыл бұрын

    классная девушка

  • @dagaz7960
    @dagaz79604 жыл бұрын

    Интересно я когда продвинюсь дальше основ и что такое фронтенд и бакэнд? 😂😂😂 Когда я типа начал учить нынешние прогеры в школу ходили. Нормальных курсов нет.

  • @manofsteppe179

    @manofsteppe179

    4 жыл бұрын

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

  • @dagaz7960

    @dagaz7960

    4 жыл бұрын

    @@manofsteppe179 а какие курсы посоветуешь? Я думаю между джава и пхп. 😀 Хочу создавать сайты но работы в джава думаю больше. Какой курс выбрать чтоб не ошибиться и научиться больше основ а уже что-то делать стоящее.

  • @user-dw6zh6ye1v

    @user-dw6zh6ye1v

    3 жыл бұрын

    @@manofsteppe179 ему хоть бы русский выучить для начала ,

  • @SeoquickUa
    @SeoquickUa4 жыл бұрын

    Кто не может разобраться в чем-то сам - ему никакие курсы не помогут. Ленивый программист - погромист.

  • @Vladdy89

    @Vladdy89

    Жыл бұрын

    Правильно! Лучшие хирурги - это самоучки. Те, кто самостоятельно изучает литературу и практикуется на бомжах за гаражами.

  • @easyman801

    @easyman801

    11 ай бұрын

    ​@@Vladdy89надеюсь бомжи после этого выживают

  • @fliblomlaslojor
    @fliblomlaslojor4 жыл бұрын

    1:50 не путать с HTML и CSS иначе выходит говнокодные сайты (коих больше 80%) которые не способны ни на что кроме пожиралова ресурсов. Отключение JS приводит к тому, что сайт не только не может отобраить данные но и обработать их. Хотя задача сайта зачастую иметь пару кнопок и обычную древнюю

  • @fantom4ik_kg165
    @fantom4ik_kg16511 ай бұрын

    4:14

  • @user-vd6eg5ke7i
    @user-vd6eg5ke7i4 жыл бұрын

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

  • @user-ex2dp7br7d

    @user-ex2dp7br7d

    Жыл бұрын

    Гарний продавець,дуже гарно повинен знати,що він продає.

  • @vanya_hrynkiv
    @vanya_hrynkiv4 жыл бұрын

    мне как-то логику делать проще чем верстать интерфейс,

  • @user-dw6zh6ye1v

    @user-dw6zh6ye1v

    3 жыл бұрын

    BackEND

  • @NoName-js9xm

    @NoName-js9xm

    2 жыл бұрын

    Каждому свое

  • @alexali3992
    @alexali3992 Жыл бұрын

    фронт енд это полупрограммирование. тоесть Javascript это просто обращалка к DOM. другое дело если Typescript. но это отдельная большая тема

  • @vangog8595

    @vangog8595

    Жыл бұрын

    а если JS с TS

  • @qrefwqdnpl7457
    @qrefwqdnpl74572 жыл бұрын

    в 36 лет реально стать фронтенд разработчиком ?

  • @saniyau

    @saniyau

    2 жыл бұрын

    Конечно

  • @slimakovskiy

    @slimakovskiy

    Жыл бұрын

    Привет старик) как твои успехи? Я тут тоже решил поучиться, интересно за историю других и результат

  • @sergeikot2560
    @sergeikot25604 жыл бұрын

    все вы ноль 0 без цысковедов. к ногам! )))

  • @NB-uo6mp

    @NB-uo6mp

    3 жыл бұрын

    Ха-ха-ха, сказали электрики.

  • @vanya_hrynkiv
    @vanya_hrynkiv4 жыл бұрын

    4 минуты воды, ради рекламы курсов

  • @vanya_hrynkiv

    @vanya_hrynkiv

    4 жыл бұрын

    @@emantsal здесь скорее вопрос зачем создавать же видео длиной в 4 мин?

  • @Tunec_s_hlebom
    @Tunec_s_hlebom2 жыл бұрын

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

  • @katyafrolik

    @katyafrolik

    2 жыл бұрын

    Расскажи что изучал , чтобы стать фронтендером

  • @Tunec_s_hlebom

    @Tunec_s_hlebom

    2 жыл бұрын

    @@katyafrolik Начал с обычного js и jquery. Пытался делать какие-то прикольные приложухи чисто для себя. Потом решил попробовать устроиться на работу. Для этого я освоил React и подноверстал основы js (чтобы пройти собеседование). Когда нашёл работу пришлось освоить Angular так как мы на работе работаем именно с ним ну и с Vue3 так же довелось поработать

  • @Starina_Ti

    @Starina_Ti

    Жыл бұрын

    @@Tunec_s_hlebom а ты во сколько лет этим начал заниматься и сколько времени у тебя ушло на изучение всех этих программ?

  • @amz2mov
    @amz2mov3 жыл бұрын

    Надо говорить короче и по-существу, а не эзоповским языком с тоннами воды.

  • @L_ink_S
    @L_ink_S3 жыл бұрын

    набрала вес по сравнению с видосами 2019г, печалька

  • @marchmushroom6452

    @marchmushroom6452

    Жыл бұрын

    с вами всё в порядке?следите за собой и не лезьте в чужую жизнь. позорище

  • @L_ink_S

    @L_ink_S

    Жыл бұрын

    @@marchmushroom6452 позоришься тут только ты, который лезет к чужим людям со своим мнением 🤦🏻

  • @marchmushroom6452

    @marchmushroom6452

    Жыл бұрын

    ​@@L_ink_S мда, всё понятно с вами, желаю почаще смотреть в зеркало и хотя бы иногда задумываться, прежде чем оставлять подобные комментарии

  • @L_ink_S

    @L_ink_S

    Жыл бұрын

    @@marchmushroom6452 🤦🏻 пока пока

  • @shiglhf9894

    @shiglhf9894

    Жыл бұрын

    @@L_ink_S а вы разве сами не лезете к чужим людям со своим мнением?)

  • @user-bu6qe4ci9l
    @user-bu6qe4ci9l3 жыл бұрын

    мне одному кидается в глаза зуб в помаде ?

  • @Kisslovq
    @Kisslovq4 жыл бұрын

    Пожалуйста, избавьтесь от этой странной и отвлекающей жестикуляции руками!) Ну правда