Подготовка к собеседованию на Frontend Developer
Менторы
Специалисты своей области, которые смогут помочь вам
Middle .Net Developer
Senior Product Manager
Middle Python Developer
Ведущий программист
Backend Software Engineer (PHP)
Senior .NET/C# developer
Middle DevOps Engineer | Tbilisi, Georgia
Middle C# .NET
Senior PHP-разработчик
Middle python developer
Каналы
Полезные Telegram каналы и чаты
Транскрипция видео:
по документации лучше всего учиться это не поверишь как много людей с тобой не согласиться ребята которые пользуются с контейнером на тебя посмотрели с большие надо осуждением он прикончены и шрифты зла не используйте конечные shift и ставь лайк если используешь иконочки шрифт всем привет на девятом от собеседование сегодня меня зовут владислав рядом смыслов сегодня над себе силы не у нас дмитрий дмитрий а расскажи себя но я айти самой сферой занимался уже достаточно давно я уже такой немолодая
00:00:00 - 00:01:23
техник скажем так по возрасту и техников 235 лет мне сейчас уже и в то же время я не имел опыта такого коммерческой разработки именно работы в компании я фрилансил козел для себя и для своих друзей и в плане программирования я достаточно широко ну пошел я изучал ну там in a paid они некоторый скрипт и писал я учился на курсе по java но вот последние полтора года я так плотно занимался именно java скриптов вот и писал проектом для жены интернет магазин и днем окунулся backend и фред а из какого то города я из беларуси из небольшого
00:00:43 - 00:02:32
города может знаете воздав создал тех кто хочет узнать просто были запросы что мы не спрашиваем с какого города приходят хорошо расскажи как ты вообще изучал frontend ты вот сказала что ты на пойти не писал какой-то момент начал делать интернет магазина как тапочек fontaine ду пришел интересно получилось потому что изначально я все-таки больше углублялся в бэг-энд ну во первых я учился на курсы java где в принципе да backend такой причем кровавый enterprise учили да там все такое но в то же время он решил как по
00:01:37 - 00:03:07
этот проект написать интернет-магазина своей жене она там работала на интернет магазин я решил переписать им сделать толковый и я писал бег на джаве а frontend мне помогал мой друг на java скрипте вот но потом со временем так получилось что друг как-то отпал потихоньку от этого проекта и на меня лег и front-end и back-end и вот пришлось так основательно углубиться чтобы исследовать эту сферу и по итогу но java script мне очень понравился как язык на самом деле как бы его там не все некоторые нелестно
00:02:23 - 00:03:39
отзываются но все таки классный язык на самом деле я бы кто же переписанный java-script конечно это не будет то есть те прямо джос клип понравился ну в принципе да какой это был год переписывает этот магазин то есть там теплый джек вере или и чтобы по библиотекам джек вере там не было значит ну когда на java script имена да пошел бег был сначала на ноги и экспресс потом все-таки он стал на наш вес за счет его хороший архитектуры такое достаточно привлекательной и кстати похоже на spring над жаловаться который я перешел
00:03:01 - 00:04:24
frontend изначально был реакциям и на реакция его практически полностью сделал но потом познакомился с ангулярным и вот как nist мне понравился за свою архитектуру angular мне тоже понравился вот именно за его чай который шел из коробки зархи тектон и подход достаточно не плохой но и в принципе там уже все было структурировано и в сообществе лучше чем вот were акте больше такое каждый придумывает что-то от себя не вносит так в итоге значит ты начал именно не из простую джесса и нас реактор да я начал
00:03:46 - 00:05:07
с реактор но в итоге ну изучать framework это не самый лучший путь изучать когда ты изучаешь язык и начинаешь сразу учить фреймворк райха молод и понимаешь да поэтому я поставил цель все-таки понять во первых как работает этот фреймворк внутри вот и с другой стороны что можно было бы сделать без фреймворка вот начала углубляться в java script начал разбираться в том в каком он в текущем состоянии потому что ознакомился с джо скриптом я и раньше когда фрилансер ну там были такие пи-пи-пи шины и сайты
00:04:27 - 00:05:50
где то там же вот скриптом для динамики вот а тут но это было давно это было в начале двухтысячных годов сейчас конечно чего скрипт уже вырос получишь муки и хорошо я понял у тебя целом опыт опыт в целом получается сколько лет то есть ты говоришь о ты фрилансер дает то есть вообще сколько лет ты уже занимаешься дайте в целом если брать эти школ где-то с 2004 года я достаточно плотно и стал заниматься ну как плотно я работал обычно параллельно где-то вне эти сферы по большей части был мебельщикам
00:05:08 - 00:06:30
и вот последний год я был на удаленке менеджером в интернет магазине но в то же время программирования меня всегда интересовала захватывала где-то или подрабатывал вот фрилансил или для себя что-то делал на фрилансе ты что примерно делал там не знаю печки какие-то сайты правила или что это была работа до в основном так в основном либо что-то допилить кому-то там какие то скрипт и некоторые сайты полностью но опять-таки они были достаточно простые начинал я вообще cms ок там джумла drupal и все такое вот потом
00:05:48 - 00:07:11
понял что лучше написать что-то свое потому что оно будет более гибкая но опять таки это было на печке html java script где-то был но вот так поверхность а почему кстати вот получился такой переход получается очень очень поздно то есть ты там не знаю 2014 2004 года ты говоришь что ты вот там немножко фриланс и фрилансеры вот не знаем буквально получается последний там полтора два года ты вот прям сильно ударился программирование так далее то есть почему вот этот переход произошел ну с одной стороны мне интересно было
00:06:30 - 00:07:59
программирование все время но потом я поставил цель именно работать в этой сфере полностью стать но я просто понял что это моё скажем так и всегда хочется заниматься именно тем что ближе тебе что тебе нравится хочется найти работу которые ты любишь и с другой стороны войти в эти школы без опыта и без коммерческого опыта порой сложно и в то же время у меня была цель работать именно удаленно я как то не очень склонялся к офис ну-ка офисной работой и поэтому но были проблемы потом я как-то разочаровался думал у меня
00:07:15 - 00:08:37
ничего не получится и был период когда я практически не занимался программированием вот поэтому еще много времени прошло вот но потом вот я написал достаточно интересную приложений на python для себя для ведения бюджета там для разных моментов это было десктопное приложение вот и я поставил цель думаю надо попасть на какие-то курсы потянуть себя хорошо и войти в эту сферу вот но попал на курсы java изначально вот как-то как-то мне этот язык сначала лег она душу скажем так вот ну универсальность его достаточно неплохую
00:07:56 - 00:09:45
же поддерживаем масть много было информации документации на эту тему вот но вот по итогу все-таки перешел java-script вот потому что но этого сном было связано с моим под проектом вот потому что этот проект мне нужен был для портфолио то есть я понимал чтобы найти работу нужно братвою нужно пример своего хорошего кода вот но в итоге вот так как начал заниматься такие где мы поняли хорошо расскажем вот и какую-то задачу считаешь самой сложной что не приходилось решать рассказал что интернет магазин какие-то
00:08:50 - 00:10:15
подпроекты на фрилансе что-то делал что за это было самое сложное и самое интересное вот интересный и достаточно сложная задача у меня именно на вот последним под проекте было потому что он как раз был достаточно серьезным проектом и она была связана одна из задач это когда я хотел запилить хорошую безопасную авторизацию и аутентификацию и для этого я хотел использовать токены ну с обновлением токи на то что был access token refresh . причем начал именно уб хотел именно не использовать готовые библиотеки а
00:09:34 - 00:11:11
сделать все таки что то свое потому что в готовых видел все равно какие-то но чего-то мне не хватало на то есть например там безопасности там какой то какая то дырка например да то есть можно угнать это можно но какая какая проблема нового на гитхабе есть интересные и шью на эту тему как раз там описывается каким образом было наиболее безопасно использовать в 2 tone токена где их хранить ну и каким образом обезопасить допустим вот если угоняют не один а два атаки на то есть чтобы все-таки человек не сломал
00:10:22 - 00:11:50
безопасность либо получил доступ ненадолго хорошо и как ты решил в итоге где ряде штуки ну на на фронте получается access token я гоняю через https заголовок авторизационный токен у меня в cookie но кукиш т.п. only и на щеки урны cookies вот но кроме того у меня есть еще одна кука в который прописывается текущей индикатор скажем так уникальный идентификатор этого пользователя вот чтобы допустим если кто-то другой гонит xs refresh а у него нет 3 cookies соответственно ой нет эти cookies а вот этой поздравляют изобрел сессии ну да я
00:11:06 - 00:13:09
вот потом понял что соседи можно было тоже в этот момент потом ну именно вот и и айдишник рельефу хороша ли я не жду пользователя создать скажем как ты решил проблему на валидации этих таким вот в этом плане тоже это достаточно было интересный момент потому что на при разводе не во-первых пользователь мог зайти из нескольких устройств и ну нужно разлогиниться уничтожить все поэтому у меня соответственно в веке хранились токены access токены и refresh токены вот и ну соответственно с одной стороны
00:12:07 - 00:13:49
проверялась их актуальность периодически чистила видел чтобы не хранились на к со стаканом учащиеся создается вот с другой стороны если допустим неправильно ну какой то если прочитывается access token и он не проходит ну то там просто не не проходила авторизация но если допустим кто-то пытается разрешить и в то же время у него refresh неправильный либо нет и вот этой второй купе с идиш ником пользователя то токины сбрасывались они в этой рампе как раз в которой хранились удалялись вот ну получается с одной
00:13:00 - 00:14:33
стороны юзеру не очень удобно что ему придется перелогиниться но в то же время если кто-то угонит ведь и токены и попробуют их как-то воспользоваться то ну потеряет доступ скажем так вот то есть они у меня хранились и соответственно ну а при разводе не они удалялись именно вот в сервисе было прописано что должны найтись все refresh и все access и но они там папе как раз были сохранены по одежке пользователя и хорошо не понял давай договоримся просто пытаться сокращать ответа иначе мы сможем так это часа три
00:13:46 - 00:15:15
вести беседу пересказывать то что его мы уже спросили не нужно у меня есть один вопрос на-ка вот мы еще не приступили к самому соседа вот на последней мы с тобой договорились что мы будем на джонас тебя спрашивать то есть сначала вот мы еще метались немножко не знали джунгли middle то что у тебя все-таки опыт большой вот но в итоге все таки решили нужно попробовать и соответственно у нас к тебе вопрос вообще твои ожидания собеседования что ты ждешь что будет ну с одной стороны хотелось бы понять
00:14:30 - 00:15:49
действительно свой уровень потому что я самый сейчас на тоже сложно порой себя оценить джон ты или middle когда ты уже давно что ты делаешь но в то же время не имел коммерческого опыта и ну не делал много там именно больших проектов от начала до конца вот поэтому хочется понять свой уровень найти может быть какие то свои пробелы что потянуть чтобы стать настоящими дeлoм вот со временем но и понять еще может быть какие то свои пробелы может быть и как джун а вот потому что на данный момент я оцениваю
00:15:11 - 00:16:35
может быть как junior plus свой уровень именно за счет того что у меня не было за мной кого-то кто бы меня контролировал ты научил скажем так вот но здесь мы с тобой не будем конечно проверять твои навыки кодинга для этого уже есть знаю из разработчики которые могут куда ради провести или знаю если тебе нужно он горит мы там всякие легко да вот здесь мы будем все таки проверять чисто твое знание и понимание насколько ты глубоко вообще интересуешься разработка наверное так вот и я думаю мы наверно можно уже
00:15:53 - 00:17:02
начинать в принципе очень много уже узнали от пар тебя теперь будем узнавать твои знания по технологиям я начнем ноги и вопросик уточнил что мешало раньше начать получать коммерческий то есть устроиться разработчикам ведь база была достаточно с одной стороны и то что у меня не было опыта мне было сложно устроиться удаленно но джуном именно устроиться удаленно раньше было сложно вот когда к вид и появилось много удаленщиков сейчас вот у меня кстати появился буквально недавно offer предложениями на вот
00:16:28 - 00:17:55
младшему разработчикам вот а раньше это было препятствием но с другой стороны все таки мне например имея семью было сложнее просто кинуть все и попробовать долго искать работу вот может быть это было нерешительность может неуверенность в своих знаниях где-то но вот последнее время как раз упора сделал больше на все это но что тогда начнем секции джесса и у нас с тобой будут здесь такие базы и совсем штуки вот надеюсь все пройдет нас хорошо я думаю что ты уже это все знаешь вот раб игорь с тобой первую очередь про
00:17:11 - 00:18:39
функции то есть для чего мы вообще функции используется в скрипте и какие у нас функции вообще существуют функции но если их разбить по типам то это стрелочная функцию и по определению не стрелочных слова за забуду до но которое определяется именно как фанкшн вот соответственно это типы функций до которые мы можем выделить ну и ничего не используются с одной стороны реализации определенной функциональности то есть обработка каких-то данных выдача результата либо обработка но также и для создания
00:17:56 - 00:19:43
объектов именно такого прототипирования то есть java script есть возможность не только создавать объекты как объект этого классного через функция но в это такие более конкретными например и привел то есть там создание объектов стану функцию то у нас просто созданы для того чтобы какую-то логику себе инкапсулировать мы держим какой-то кусок логики и запихивая функцию принципе функция занимается чисто вот каким то операциями какой-то логикой что-то может делать мутировать возвращать вот и она сделана как раз для того чтобы это
00:18:50 - 00:20:08
лежало в каком-то одном обособленном месте и мы можем их эту логику выделять функцию вот ее основная задача как раз понижать сложность в программы то есть если мы функцию берем у нас будет просто одна большая портянка из алгоритмов которые будут повторяться через функция мы можем читабельность повышать и используясь композицию и так далее так далее окей давай поговорим про faction экспрешены faction declaration что это такое и в чем будет разница function шенги конечно это как раз вот стрелочные
00:19:31 - 00:20:50
не стрелочные функции сразу все поправлен нет это это срочно функция вообще не имеет отношения это про то как мы объявляем функция да да да точно в словах иногда в терминах бывает могу выпутаться это минус но function expressions то есть мы объявляем то что должна непосредственно делать так function declaration мы объявляем то что она должна делать убив ее логику соответственно описываемые a function expression это когда мы ее вызываем из помещение куда выбор но ты я понимаю что ты примерно понимаешь чем дело но здесь надо
00:20:10 - 00:21:51
все-таки четче сказать в чем разница именно вот почему мы используем например где-то фарш express шина где-то мы используем фанкшн declaration почему они и вообще разные штуки почему не везде франком declaration почему не везде faction экспресс почему нам нужно вот эти две разные сущности ну с одной стороны если я не ошибаюсь если правильно помню это еще связано с контекстом функции то есть что для нее является контекстом и соответственно так ну и кроме того создается ли по моему отдельный объект
00:21:06 - 00:22:49
вот пробел в этом отношении конечно может быть может я это помню но ну слова express and тебя наводит может быть на какие-то мысли то что там написано expression как ты понимаешь вот expression что это же такое это не специфично к функциям вообще это просто в целом и выражением в скрипте как выражение вообще работают ну то есть экспресс вот то есть мы описываем выражение которое что-то делает вот то есть чего там я не знаю а равно и какая-то операция вот какая вообще есть фишку выражение то есть ключевая особенность каждого
00:22:04 - 00:23:39
выражения что делает вообще абсолютно каждое выражение в java скрипте независимо от того что это за выражение но она обрабатывает какую-то информацию и заносит информацию в переменную вот результат скажем такой обработки но смотри два плюс два это у меня нет ни одной переменной это будет выражение ну да это будет вера жене но единственное что результат этого выражения уже но вот ключевое слово здесь как раз результат то есть любое выражение жесткая все должно вернуть результат даже когда ты вызываешь
00:22:55 - 00:24:10
функцию это тоже будет выражением и она тоже возвращает результат поэтому любая функцию тебя должна что-то вернуть поэтому здесь можно логически подвизаться к этому express и ну то есть function экспрешены такое выражение которое возвращает функцию ты пишешь function что-то это выражение вернет вот эту самую функцию поэтому ты можешь очень удобно прямо вместе куда нужно передать callback объявить эту функцию и том же до в тех же методов массива там map ты прям на месте объявляешь эту функцию через машин экспресс использующий это
00:23:32 - 00:24:40
очень удобно function declaration это примерно то же самое если ты эту функцию присвоил к переменной только у тебя в качестве переменной выступает само название функции пишешь function какое-то название и вот оно будет объявлено в области видимости вот ну вот такая разница окей давай вот и затрону тему контекста вот про контекста поговорим как он нас возникает откуда берется контекстом берется либо из окружения то есть например если функция если функция стрелочная то в принципе она не имеет своего контекста и она берет контекст
00:24:06 - 00:25:38
выше вот в то же время функция которая стрелочная она имеет контекст либо объектов которым она создана либо глобальный контекст ну а контекст откуда оно вызвано ну тогда окей да откуда вызвано согласен хорошо мы не будем сейчас прям глубоко погружаться в целом да правильно но еще на 40 текст что его можно менять ну то есть с одной стороны он может быть приобретен с другой стороны его можно изменить но микро сейчас поговорим как раз давай пока мы с тобой на функциях разберем еще чистый функция вот что
00:24:51 - 00:26:34
такое чистая функция в том понимании чистая функция это функция которая если получает определенные данные на вход то на определенные данные и выдаст она конечно может и не получать определенные данные нового мы всегда получаем ожидаемый результат от ее работы то есть у нее нет каких-то сайт эффектов которые зависят от меняющегося мира на там или к примеру каких-то асинхронных операций но этот таки 2 немножко независимой штуки то есть ты сначала назвал как раз детерминированность что мы знаем что
00:25:44 - 00:27:09
вернет функция при определенных аргументах и вторая штука side effect действительно us чистый функции side effect of не должна таких быть вот она занимается только своим внутренним состоянием каким-то да и давай еще тогда про вот этот вот изменение контекста то есть как мы можем контекст функции переопределить какой-то другой контекст поставить с помощью чего мы можем функции назначить контекст через wine мы можем передать объект контекста вот кроме того мы можем но при этом оно мы сохраняем функцию и когда мы будем ее
00:26:26 - 00:28:03
зеленую переменную вызвать вызовами и потом и в то же время есть возможность вызвать сразу функцию с каким-то измененным к текстам через кол тёплой был разница между кол оф лайн такая с тем как мы еще передаем аргументы либо тогда уже либо через запятую там уже дает такое не особо важно вот про бинт интересно то есть если убьют какие-то особенности может быть знаешь какие особенности особенности ну например если мы ждем два раза лиц сразу если мобиль два раза применим то есть бен сделаем сначала на
00:27:17 - 00:28:34
один контекст и бен потом на второй контекст перри сможем ли мы переопределить тот контекст который был уже в первый раз привязан интересный вопрос я не задавался таким вопросом как-то не следовало но насколько я понимаю по идее так как бант возвращает нам функцию которую мы со временем можем использовать то мы опять этой функции можем переопределить контекст но единственное будет только последний маску на сколько я понимаю но я не уверен потому что не не знаю точно этот образ ну да тут наверно уже хочешь больше с опытом и
00:28:00 - 00:29:25
такое уже понимаешь 22 раза pink применить не получится то есть первый раз когда-то применил все у тебя жестко контекст быть зафиксирована и дальше уже чтобы ты не делала она будет один тоже контекст ok и вот последним хочу с тобой обсудить это и вал вот наверное слышал про такой реван вообще как он работает и почему все так боятся это воевала почему по им пользоваться чаще всего плохо ну и вал позволяет совершить какую-то операцию выживать из полученную скажем так из текста из то есть ну создайте
00:28:42 - 00:30:12
java-script код на лету скажем так и выполнить его и это небезопасно им пользоваться потому что если мы получаем откуда-то извне например вот то что он должен выполнить либо это можно как-то подменить что ну соответственно это такая дыра появляется в приложении куда может попасть то чего мы не хотели бы да и будет выполнено там какая-то не нужна логика ну в целом да но здесь наверное все таки ты лишь про кейс когда мы и валим что то что от юзеров пришло то есть по юзера написали какой-то код и моего и валим
00:29:28 - 00:30:51
тогда да там они могут написать что угодно вот а если это наш код который мы который мы управляем то в большинстве случаев это будет более менее безопасно но это просто не очень понятно то есть когда мы с тобой пишем просто явно какой-то функцию что она делает там хотя бы это можно как-то прочитать разобраться когда туда первую строчку это это уже сложнее гораздо вот и но есть инструменты типа того же его пока там под капотом ну насколько я знаю покрытыми когда после осмотрел там тоже все его лица но просто потому что другом
00:30:11 - 00:31:17
нельзя там тебе код просто виде строк приходит и лежит проведи строк его лица вот там такое тоже есть но это уже сделано просто потому что по другому никак вот если очень прост когда нельзя обязывало мне кажется еще какую проблему может вызывать это проблема наверное тестирование насколько я вот думаю сейчас стороны тоже но я на такой код сложнее будет тестировать символами если что-то функция сами если он генерирует у скорее всего да и скорее всего будет тоже не очень детерминирован то есть ты будешь
00:30:44 - 00:31:57
каждый раз что-то новое получать ну тоже такое до ночи и хорошо я думаю можно переходить а чем вопросу о кей значит смотри мы поговорили про контекст дальше будут тема у которых больше всего вызывает вопросы чем контекст отличается от области в видимости или даже наоборот и на чем область видимости отличается контекстно интересный вопрос но с одной стороны если брать для функция области видимости она определена вот чем скажем так и в принципе даже даже наверное это сравнивать теплое с мягким даже потому
00:31:20 - 00:33:10
что область видимости больше относится к переменным и когда контекст относится именно к функции к тем к тому что оперирует этими данными понятно что ну это взаимосвязано и где-то понятия но в то же время ну но не к разному применимо по крайней мере насколько я шоу мы хорошо ты справился вопрос был с подвохом ok что-то скажешь про замыкание замыкания но можно сказать с одной стороны это функция то ее способность замыкать себе лексическое окружение с другой стороны это именно скажем так подход да к тому как это
00:32:16 - 00:34:10
реализуется то есть как это технология даст сокрытия например каких-то данных либо именно вот замыкания определенных данных функции чтобы извне нельзя было получить к ним доступ и могла ими оперировать ну и выдавать только этот результат которому можно получить доступ хорошо рассказал я вижу прям проштудировал документацию по документации лучше всего учится в принципе много в лично мне кажется ты не поверил но здесь тобой не согласиться но это их право конечно но это факт по крайней мере самые лучшие знанием
00:33:11 - 00:34:39
получаются из документации дожились она не очень хороший так переходим следующему вопросу давай поговорим с тобой про модуля у нас с тобой есть в этом скрипте модули у которых есть импорта-экспорта вот интересно понять как они вообще работают что происходит допустим когда мы импортируем какой-то модуль или когда мы в какой-то модуль импортируем несколько раз вот как это будет работать ну по итогу все это все равно собирается скажем так то есть импорт и экспорт и это у нас на этапе разработки но в
00:33:57 - 00:35:20
конечном итоге мы уже имеем скажем так на месте того куда импортируется определенные код там функции классы которые мы импортируем и если ты примеру импорт и этих классов и функция не повторяются то они не будут дублироваться в конечном банде скажем так то есть они не будут там десять раз им против по всему коду уже 1 импорт который был он будет использован и дальше переиспользовать следующих модулях либо ну да модулях получается в которой им птицу простых либо какой-то аспект просто пример разберем то есть на 100 га модуль
00:34:39 - 00:36:11
в котором просто опере строчки console.log единичка и мы этот модуль импортируем не знаю в трех других разных местах и они все тоже по ходу выполнения приложения вызывается сколько раз мы должны увидеть консоль лак а экспорте ца консоль он а ничего не он ничего вообще не испортится просто модуль то есть мы его просто импортируем без конкретных каких-то ключей то есть мы из модули ничего конкретно не заберем просто сам модуль импортеры но если оттуда ничего не испортится то он испортится ну то есть те данные
00:35:26 - 00:36:42
которые в нем пройдут у синхронно соответственно console.log произойдет ну и все по сути как он же был один раз за им прочен то больше ничего и не будет ну и если там оттуда ничего не испортится ну да то есть по сути мы один раз увидим console.log единичку да ну так и будет действительно вот скажи тогда немножко про то можем ли мы влиять на переменные которые есть модули которые экспортируются можем ли мы с тобой допустим знаешь как сделать экспортировать какую-то переменную поменять ее в одном модуле чтобы она у
00:36:04 - 00:37:42
нас изменилась другом вот как то так экспортеры столько переменная не функция которая изменяет перемену а чисто сама перемена можем ли мы вот как-то это поменять ну в принципе оно так и будет работать на сколько я понимаю но если это объекта точно будет потому что объекты они вообще передаются по ссылке и соответственно в отношении не переменной на призыв получается если мы x прочим переменную там какой-то результат а еще одном модуле мы тоже им им причем в одном модуле во втором и меняем во втором
00:36:52 - 00:38:19
эту же переменную поменяется ли в первом да ну да потому что будет перри использоваться шкот ну то есть по сути в конечном итоге после того как кот соберется то это будет просто одна переменная которая будет жить в коде и значит она будет меняться но это влияет ли применимо ли это ко всем типам данных то есть объектами да понятно то есть там объекты там все посылки но в этом смысл бы объектов с примитивами это будет работать с примитивами ну вот интересный вопрос наверное наверное все таки нет потому
00:37:39 - 00:39:12
что в принципе мы ее если мы ее импортом но мы им противо при деленное значение дальше мы по сути используем именно это мы им платим именно значения которые она передает если это примитив ну естественно это уже не переменная это ее значение окей ну да так примерно так и будет хорошо и последний вопрос по модулям как можно нам с тобой сделать что то похожее на модуле когда у нас нет возможности вот использовать последние спецификации есть модуль за допустим мы никому не можем с тобой использовать bomber
00:38:25 - 00:39:44
не можем писать по октмо скрипт 6 или даже пять что можно вместо модулей использовать чтобы примерно повторить вот ту же самую логику то есть и рекламу тоже не можем использовать ну допустим мы с тобой можем написать не знаю свой рик флэр но при этом мы хотим разбить на файлы и иметь ну вот что-то подобное в идеале да ну давай даже подумаем и просто без давай без импорта экспорта то есть просто модуля то есть просто какие-то отдельные файлы которые можно не знаю куда то импортировать но нельзя импортируем не знаю конкретные функция
00:39:04 - 00:40:37
туда просто импортер файл он выполняется вот как это можно делать чтобы у нас того не было конфликтов имен чтобы мы в одном файле могли держать переменные которые задаются фу и врагов фулл чтобы у них не было конфликтов и на как бежим против expro так жить но с одной стороны если мы их используем в дальнейшем вождь имели то в принципе мы можем несколько туда же скриптов использовать ну вот в отношении конфликта имен что в эту ситуацию ну да они в принципе будут изолированы но если мы с тобой напишем в одном файле
00:39:51 - 00:41:25
какую мультиварку то он у нас будет лежать уже в windows если мы это скрипт выбранным глобальной области видимости на с тобой перемены могут пролететь мы конечно можем использовать какой-нибудь const или лет и действительно тогда конфликт не будет ну вот если мы с тобой идти два файлика процесс конкатенировать то у нас будет конфликт то есть в одном файле будет написано конт что так он что-то и у нас имена будут конфликтовать как вот можно вообще избежать это в принципе как можно изолировать вот эту
00:40:43 - 00:41:51
область видимости чтобы у нас они были отдельные тоже кстати про это даже сказал до этого немножко ну то есть использовать замыкание получается и а можно использовать же блоки блоки дублей блочно область видимости точке выше своих блоков переменные не существует консулат и товар проскакивает везде вот и по сути ну вот это вот изолирует но это как вариант да действительно можно блок использовать нотами действие что ты не сможешь фаршем declaration применять потому что фаршем declaration она работает как уваров
00:41:17 - 00:42:41
поэтому если ты внутри блока был объявить фаршу declaration во первых по моему ты даже не сможешь потом объявить может быть ну короче говоря он тебя провалиться вот но это да как вариант неплохо то есть можно использовать блок но 2 ты как раз уже начал называть это использовать замыкание просто используйте мидле и 2 что их прошин то есть функция которая сразу на тебя выживает да вот окей ну я думаю здесь мы разобрали все что хотели можем дальше двигаться окей мы поговорили про функции вот скажи ты часто с объекта не
00:42:00 - 00:43:22
встречалась и у которых есть различные свойства которые ты не не задавал сам ну постоянно 1 посмотри на откуда они берутся и вообще как как так бывает что они появляются например длина на массиве но есть прототип в котором уже используются заложенное поведение скажем так некоторые функции которые должны быть у объектов либо у объекта общего обжиг то есть свои возможности но я между если наследует то у него впадаете при тоже есть свои функции определенные ну конкретных объектов как строка или массив у них
00:42:41 - 00:44:23
тоже есть в прототипы прописаны функции своих хорошо с портативным понятно что он именно туда и вперед вопрос другом как нам такие свойства создать мы даже можем добавлять ну использовать прототипа вот и причем при наследовании в принципе мы пользуемся ими не ссылаясь на прототип послать просто на объект они уже ищут вглубь ну по прототипам то есть если нет в объекте ищется в прототипе если нет в прототипе ищется в прототипе прототипа ну и так далее ну туда просто не про прототипа то как нам создавать
00:43:32 - 00:44:54
эти свойства вот если захочешь или называть вот знаю собственным с каким-то способом вот вычисления длины массива то есть и смажу не было бы сейчас текущего прототип пары который делает это сам как бы ты это сделал например что-то вычислял и и ну можно ему добавить в протечек такую функцию то есть чтобы она не была конкретная понятно что добавить но через прототайп и процент ты получаешь доступ к портативу нас нет прототипом назад что с тобой объект на который надо добавить вот несколько свойств которых
00:44:13 - 00:45:46
есть какая-то логика при этом это но это не должно так работать что мы пишем . live и вызываем чтобы мы писали . лэнс и он работал как свойства вот про это скорее вопрос ac3 гетеро использовать в этом плане то есть у него есть свойства и при этом секторе и гетеро у него есть хорошо которая ты назвал два центра гетры что это вообще за уникальные названия но это функции которые определяют доступ ну специфику записи и чтения определенного свойства вот то есть мы устанавливаем допустим мы не хотим просто читать свойства какое-то
00:45:01 - 00:46:51
хотим проводить какую-то дополнительную проверку возможно либо трансформацию данных при записи либо чтение и соответственно мы и прописываем вот в свитерах ноги какие-то еще знаешь кроме сеттеров hydra интересно надо подумать ну то есть чтобы она просто работала как не функция свойства но в то же время вообще это называется дескрипторы может пойти об этом что дочитал недавно кстати так и что ты знаешь по дескрипторы прямо гитарах из этого ноу дескрипторы позволяют ограничивать определенных доступа видим
00:45:57 - 00:47:25
и определенных свойств с одной стороны будет хорошо ты перечислишь но дескриптор райт ограничивать можем ли мы записывать это свойства дескриптор анимировал ограничивает будет ли это свойство перечисляться среди свойств объекта и дескриптор еще есть дескриптор который ограничивает доступ на чтение так right now are able еще 3 может ты путаешься terrible да наверное put a knife игра балда но в принципе то что ты назвала я считаю что то достаточно просты читалкой понимаю зачем это нужно но вот хотелось бы до
00:46:50 - 00:48:56
чтобы поувереннее отвечал в этом то есть знаешь такое дескрипторы нам называть дескриптора my какие-то абстракции окей хорошо наверное дополнение бисквит ну я должна по жесткой в ту по чистому наверно все спросили что хотели давайте перейдем к следующей теме она у нас не такая большая сейчас будет но тоже важно это будет на свой папе вот и ног в баку нас любимый конечно же вопросы и the event лук зачем вот у нам в браузере event лук для чего он используется и как он работает ну и он и вон ту нам нужен для того
00:47:54 - 00:49:30
чтобы если у нас есть какие-то то есть зачем он был придуман скажем так не некоторые операции могут быть долговременными и в то же время их можно отложить выполнять операции дальше например асинхронный какой-то код вот и соответственно и вот звук помогает тоже реализовывать этот функционал когда нам приходит какая-то тоска она имеет допустим она синхронная либо она задана через и тайм-аут вот она откладывается и соответственно выполняются дальше определенные задачи когда подходит время ее выполнить скажем
00:48:45 - 00:50:22
так не не раньше чем через это время она выполняется либо если допустим от асинхронный код когда там уже есть результат она ставится в уже очередь задач на выполнение выполняется благодаря этому мы в одном потоке получаем возможность использовать много разных задач и донат поговорим про вот это время когда функция понимая что ей пора выполняться собственно когда это время наступает что у нас есть какая-то синхронная операция которую мы положили в какую-то очередь вот это очередь ждет и тест на вопрос когда наступит это
00:49:35 - 00:50:48
время что его очередь начнем очищать с ним вызывать то что там есть ну во первых у нас есть задачи которые уже выполняются в стеке как раз тех задач которые делаются уже вот и синхронно когда они выполнены проверяются проверяются задачи которые были отложены если какие-то из них которые там получили данные то есть например загружался откуда-то там асинхронно файл к примеру до или получался какой-то запрос либо стоял с этой mode то есть время как а это было задержки мы проверяем либо прошло ли это время
00:50:11 - 00:51:41
вот либо получены получены иллидан и и дальше уже это задача если свободен стек не переносится туда drop так что у нас с тобой set them out на одну секунду есть то есть мы добавили задачу с тайм-аута в одну секунду и вот у нас кроме этой задачи кроме добавления вот через таймаутов ничего нету то есть не только систему от вызвали все то есть нас получается тобой вот этот курс так очистился и у нас начинает чтобы крутится винт клуб то есть он первый раз когда выйдет задачу все тайм-ауте сравниться сколько прошло времени amer
00:50:56 - 00:52:13
что в 1 секунду еще не прошла чтобы туда дальше происходить дальше он будет смотреть если какие-то задачи еще ну вдруг они потом появятся из кода вот и потом проходит секунда и собственно если он не занят другими задачами то он выполнит эту ну собственно почему с этим от может иногда сработает не через секунду а позже например но ты не очень надежным но ты когда говоришь проходит секунда хочет понять то есть не знаю вот наш ивент лук находит задачу которые нужно подождать секунду и смотрят что задач больше нет то есть он
00:51:35 - 00:53:03
как бы уже сразу заранее понимает что нужно только через секунду будет еще раз суда обратиться или может быть не так так ну то есть вот он получил задачу он знает что через секунду надо ее проверить ну т.е. через секунду оно должно быть готово вот но заберет он и не факт что через секунду но здесь немножко то что здесь про то что иван клуб у нас бесконечно крутятся то есть это бесконечный цикл там файл true написанного крутится постоянно и суть то в чем то есть как только у носков так ощущается обращается
00:52:20 - 00:53:41
к очереди задач сначала смотрит на задачу сам высоким приоритетом ее выполняет если нет задач которые можно взять он просто продолжаю бесконечно крутится пока не появится то есть он все время крутятся крутятся пока не появится какая-то задача вот как только задачу появляется у нас начинает работать call stack задача синхронно отрабатывает и потому иван тут начинает еще раскрутиться и вот так бесконечно крутится крутится он не знает когда какую задачу вызвать то есть у него нету информации что нужно через
00:53:03 - 00:54:04
секунду про вернуться еще раз и за братьев задачу он это делает постоянно он каждый раз будет проверять ей задачей а задача или нет это я просто к тому что когда я может не так понял вопрос вот просто именно к этой задаче он вернется ну когда секунду пройдет еще раньше то не будет забирать ну да тут еще может быть такая ситуация как раз ты ее даже тоже описал что если у нас с тобой call stack очень долго отрабатывает не знаю он вместо одной секунды две секунды у нас отрабатывает и мы находим вот эту задачу которые должны
00:53:34 - 00:54:53
был через секунду выполняться он просто сразу тоже выполнит то есть мы ее поставили вы через выполнить через одну секунду она по факту через deep rose потому что у нас call stack не очистился и возможно у нас и были задачи с еще более высоким приоритетом те же самые микро тоски то есть нас могли быть микро тоски которые должны выполняться перед эти задачи они занимали еще больше времени в итоге наш канал тут у нас не знать через три секунды или через 4 вот и вот это вот такая особенность его глупо что здесь работают именно
00:54:14 - 00:55:19
приоритеты то есть нет никаких гарантий что там твой автоматизации закрепленное время окей паевым клуб узнаешь какой еще вопрос по синхронности немножко даже вот как вообще мы с тобой работаем со синхронностью то есть мы с тобой не можем написать типа не знаю получить значение сразу с promise а то есть мы должны дождаться promise и хочет понять за счет чего вот мы можем работать со синхронностью что через что мы будем выдать самое значение получать из полюсов да вообще угу ну то есть на с тобой жену что у нас
00:54:46 - 00:56:29
есть у нас с тобой есть система у нас есть еще другие разные всякие задачи нас есть render тоски request они меньше inflame нас с тобой есть событие кстати говоря это тоже асинхронные операции как бы обзору был у нас объема вернулся их даже спикер нормальный пока нету но надеюсь появились да но они есть как белочка вот и вопрос собственно вот за счет чего мы можем получать значение из этих асинхронных операций как мы ему получать новую задача которую которая приходит она передается в движок который уже
00:55:37 - 00:57:16
выполняет ну год он работает с этой задачи вот тот же движок и в общем вот и соответственно там они исполняются и соответственно там получают результат вот и потом уже когда она выдает результат ну она утверждает приходит оттуда и знаете непонятно наверное объясню это простой на самом деле был вопрос едут не пытался тебя прям запутать но мы с тобой можем сохранить работать в чистом виде в чистой с такой галочкой только через калмыки на 100 на то чтобы получить какие-то значения из асинхронных операций только
00:56:26 - 00:58:00
голубики есть то есть мы не можем написать что-то там вот но вот а ведь это уже такая начинается вкусовщина типа вот там ты можешь как бы получить значение без callback а то есть можешь написать кого и что-то и у тебя нет никого call back a но в основном есть не использую всякие сахара то тебе нужно писать callback который потом вызовется когда уже наступит момент срабатывания этой тоски вот это работает и для событий от работает на promise of отработает для sata mode или чего угодно то есть у нас для этого в основном
00:57:15 - 00:58:25
используется функция тоже те же самые worker и то есть worker of то же самое там есть события которые точнее там сообщения гоняются между основным потоком и worker его рокером вот и в обменнике событиями которые как раз работать на кубиках окей можно двигаться дальше не в ту сторону просто начал думать но это я про голубей китая знал в принципе и про и про то какой рад они могут создать если мы неправильно пользоваться но вот на этой был вопрос что понимаешь как это работает окей дальше будет следующий вопрос про
00:57:49 - 00:59:06
браузерной api может быть ты сталкивалась когда-нибудь shadow дом shadow дом [музыка] я вот точно не помню это приедет то что я но слоя не определение спрашивает прошу за полкило седине [музыка] не знаю точно не могу сразу ответить наверное сталкивался хорошо если сталкивалась эту расскажи где вот я не могу потому что она почему-то у меня на слуху ну что-то я не услышал но но сейчас не готов сразу тайну туда расскажи что-то слышал хотя бы он есть даже это пробел неплохо и то есть чем начать работать
00:58:28 - 01:00:10
хорошо может быть ты когда-нибудь не знаю возникало допустим необходимость у тебя как-то изолировать разные куски сайта два сайта с его купить друг с другом а ну то есть через тот же фрейм с одной стороны работают когда нужно загрузить один сайт в другой в этом плане но вот это близко но тут не совсем free [музыка] отдельная страница в странице можно конечно больше направо по ефрем про варить может быть разберем как что не попроще типа вот input of то есть ты наверно сталкивался с такой проблемой
00:59:21 - 01:00:57
что надо использовать input при этом ты не можешь взять и селектором каким-то там не знаю выбрать очень просто какой-нибудь стрелочку в пути тебе нужно писать какой-то очень хитрый псевдо селектор все написано псевдо-элементы ну вот собственно вот почему так то есть почему мы не можем просто в пути обратиться прям конкретным элементам а то есть именно какому-то элементу в самом in пути до или элементы input ах да но потому что она так работает ну то есть мы не все заложено функциональность которую мы
01:00:09 - 01:01:57
можем прописать там том же steam или и соответственно не все из java скрипта мы можем так выудить приходится ну вот обходить я чаще всего input и стилизовал дивами с одной стороны ну каких то есть уже приходится придумывать элементы из чего-то другого когда нужно какое-то особенное сделать его вот ребята которые пульту screen лидером на тебя посмотрели с большим вода осуждениям да да вот этот конечно икса сабель и ты страдает тогда но вот как раз из-за того что у input of внутренняя их содержим или зону через shadow дом из
01:01:02 - 01:02:35
этого ты не можешь так просто вот взять и что-то настроить то есть если ты не знаю поставишь какой-нибудь color red на select the он применит этот цвет применится только каким-то отдельным частям selecta кто же самое стрелочки допустим не применится и чтобы к ней добраться тебе нужно использовать какие-нибудь хитрые псевдо-элементы если если они есть да если они вообще есть или тот же самый placeholder вот input уже есть placeholder да и мы не можем ему добраться как полноценным элементу это будет псевдо селектор вот вот собственно
01:01:51 - 01:03:11
и заш идут дома это так работает что этот элемент он как бы изолирован от нашего основного дома и настраивать его надо вот таким хитрым способом и вот собственно shadow dom то как раз и придуман для изоляции стилей то есть когда мы хотим изолировать что-то от основного контента сайта если в общих чертах это это именно про изоляцию стилей вот вот это ну как то так то есть мы можем допустим написать разметку даже не так мы с тобой можем видеть всю эту разметку то есть мы все разметку чтобы увидим но по факту стиле
01:02:31 - 01:03:55
будут работать на каком-то приду то есть на на документе стиле будут применяться а вот на не знаем какую то в компоненте который шелдон они уже не будут применяться но здесь есть важная особенность что они будут наследоваться то есть вот того же input а если ты задашь color цвет цвет с текстовым пути все-таки поменяется потому что она свойство наследуется то есть шадоу демон тебе не делает прямо абсолютно полную изоляцию он оставляет наследование и свойства которые наследуются они будут проваливаться и те же шрифты и цвета это
01:03:13 - 01:04:31
все провалится вот остальные штуки не провалится потому что твои селекторы просто не сработают то есть если у тебя в доме есть div id и основном документе указал div там не знаю background color red то в shadow dome на этот div цвет не применится понял но надо будет это чем углубить достался уже практически все рассказал он тут почти зачитал всю статью отложим вопросов быть не может заменить хорошенько но применимости тоже уже тоже другой вопрос например судом еще много вопросов и редко его используют в плане
01:03:53 - 01:05:24
что сами манипулируют скорее по необходимости нежели ради какой-то великой идеи хорошо хорошо с этим мы разобрались следующие нас вопрос будет попроще сколько нужно тегов чтобы собрать обычную страницу нужен html как минимум body heat ну хоть базе по сути ну это прям вот будет страница но поставить вот ну и соответственно если нужно какое-то содержимое то уже в воде должно что-то появится в том же хайди ну как минимум получается у нас должен быть так html вот и в нем соответственно всегда есть четыре типа хорошо будет ли то это
01:04:39 - 01:07:00
обязательным type датой долл тоже нужно указывать потому что это заголовок сайта иначе будет будет скорее все ошибка как минимум хорошо орех рази ругая понимаем детская не знаю напишу в файле html просто пара мир чтобы я странице без описания вот этих всех без что мол без будь без ходят без сил но он не будет знать как правильно распарсить так что будет ошибка не он просто наверно покажет скобки вот эти треугольные и п ну и так далее то есть он не распался на сколько я понимаю этот текстовый но это
01:05:47 - 01:07:30
будет просто текст для него а не какой то что мой документ почему потому сказали doctype ему мы что это ты видел мы не знаю не валидный html-документ нет ну вот хорошо пошла моему понятия разметка текста по сути ну попробуем пойти от противного траки я напишу вот наш стандартный шаблон html боги и богини закрываем но закрою html что будет со страницы устраниться от рисуются просто если не закрыть базе да может быть будет то же самое будет один текст с не закрытым то есть все как текст не будет пустая
01:06:40 - 01:08:32
страница а почему так потому что он не найдет содержимого ну так воде не закрыт хорошо если сдать будь закрыли написали потом параграфы параграф не закрыли ну а это мне кажется он или проигнорирует ну потому-что бадди ну то что то что отображается она находится в базе у нас то что вот именно визуальная часть страницы и получается ну именно с этим он работает но он это размещает в ходе мы даем дополнительные дополнительную информацию скажем так ну так который не отображается и в небо де я так понимаю
01:07:37 - 01:09:17
тоже будет информацию которая не отображается я конечно не экспериментировал вот оно но это это не даже не скорее не про эксперимента просто про понимание того что у нас html это язык очень толерантны к ошибкам домаш вычтем эл допустить огромную кучу ошибок и тебе за это ничего не будет то есть движок и система настолько толерантен к этим ошибкам что все будет работать пока ты не сделал совсем что-то плохое сразу прям совсем то есть это это почему так вообще он устроена вычтем или потому что у тебя
01:08:27 - 01:09:47
закрывающие теги придут последними все то есть пока у тебя начинают грузить тысяч html-браузер вид начала html началах и да потом хоть закрывающий потом будет криво ющий то есть если бы он ждал закрывающие теги ему пришлось бы ждать все загрузку страница полностью только после этого совать так работает xml там все жестко но html он гораздо более оптимизирован чтобы отображать по мере загрузки то есть по мере так загрузки твоей страничке ты начинаешь увидеть там заголовки картинки и ты можешь не дожидаться
01:09:07 - 01:10:18
загрузка всей страницы и у тебя теги будут не закрыты за тебя их будет закрывать браузер поэтому ты можешь даже сам не закрывать и big brother в итоге закроет в этом и фишка html а что можно допускать очень много ошибок и он все равно это будет рисовать хоть как-то если у тебя совсем уж там что-то не валидная да он скорее все выглядит как текст но это больше к исключением относится чем к правилу то есть чаще всего она будет работать то есть то что в небо дион тоже нарисует вне боя нибудь если ты что-то положишь скорее всего он
01:09:43 - 01:10:52
это потом завернет внутрь body то есть финальной разметки она будет лежать внутри базе при все так я это не проверял потому что не приходилось такой писатель но какой-то интересный кейс который я просто вот я не знаю ну это довольно частая ситуация то есть вот тут вот пример которая приводилась а ты просто сделать все что было документам с одним параграфом бы что-то положе все остальное интересуются то есть самому самой разметки взяв лужах ты увидишь html их этой боди и все и положенный параграф body вот то есть
01:10:17 - 01:11:33
для него это как бы но не валидный ну ладно так и быть я сам все за тебя сделаю понятно на самом деле одну из преимущество снимал окей что-то еще по структуре спросим наверно все то есть мы основное обсудили тут дальше ну дальше тоже структурная тема немножко вот мы с тобой структуре жили документ написали html body heat как мы можем вообще документ еще структуре жить на таком верхнем уровне на самом верхнем то есть это не просил тени про кнопки вообще в целом весь документ как еще можно структурировать
01:10:55 - 01:12:41
а какой именно цель ну то есть дать ему определенная сразу стиле и и то как он вытри сова но все что внутри или что именно ну то есть можно добавить ему стиле там в том же виде то есть раньше да там баги у меня но подожди простили простили вообще сейчас мы и стиле не трогаем у нас с тобой только html недели уже потом сейчас мы чисто про содержимое говорим то есть в чем задача ну представим что я пришел сосками лидера я хочу перемещаться по разным частям сайта то есть странички да вот так лучше то есть на странице есть несколько
01:11:44 - 01:13:11
каких-то блоков там они как-то отличаются не знаю по смыслу или ещё как-то вот как мы можем эти блоки с тобой разметить чтобы по ним можно было навигировать удобно ну можно дать им падеж не кидать чем ну тащи к ним можно иметь доступ по через вот хэш соответственно дальше вот вот к этому ты ведешь то есть чтобы в дальнейшем можно было там перейти к конкретному в блог и он знал что он существует аноним но если мы с тобой hаши добавим у нас ничего не поменяется это же будет просто ссылки то есть это будет ссылку который будет name
01:12:31 - 01:13:57
и она нам ничего не говорит то есть это не структуру документ в принципе ссылка это уже часть какие то конкретных отдельных блоков где мы можем там текст считать party в тексте может ссылка встретиться и так далее здесь больше про вот такой верхний уровень вообще здесь надо вообще подумать о чем а что такое html документ с одной стороны есть же специальные теги которые как раз и помогают нам понимать чем где что находится но теги которые касающиеся там навигации касающиеся футера тайну и соответственно он как бы понимает что
01:13:15 - 01:14:32
сайт состоит из этих блоков может быть к этому но это опять таки не выше боге и всего остального наоборот внутри ну короче я чувством долга видом подходим давай вот последнюю подсказку которой она ведется на правильный ответ ты до этого назвал так тайтл как они мои вещи определенной дате не тот на стек тайтон для заголовка сделано всего документа по сути вот а какие мы еще можем с тобой применять теги чтобы вот как-то структурировать вот это вот иерархи построить заголовочной теги внутри какие мы можем использовать или
01:13:53 - 01:15:32
до того как мы формируем так и внутри body ну вот мы стали хотим для падения струя эфира теги заголовков они тоже структурирует точно там аж однажды а и так далее в ok вопрос по ним а как они собственно работают почему у нас с тобой вместо одного тега заголовка есть их целых 6 то есть группы с не берем не рассматриваем но вот на с тобой речи 12 и тогда 6 почему их 6 для чего это нужно вообще но это скорее нужно вот именно для доступа для для того чтобы можно было ни человеку скажем так понимать что на
01:14:43 - 01:16:22
странице но тот же screen reader x я была здесь screen reader тонов для человека как раз но я я понимаю то есть скрин или дорог и не человек и он может оценить соответственно что здесь идут заголовки но здесь h1 основной заголовок страницы он там объясняет что на этой странице и у него пошли там подзаголовки какие-то под темы и и так далее и соответственно у нас поэтому иерархии вот этих заголовков идет это вич-1 самого главного и и ниже там по нумерацию ok но хорошо по иерархии принципе понятно то есть мы можем
01:15:32 - 01:16:55
строить там вкладывать аж 32 и 44 так далее тогда вопрос можно ли у нас сделать несколько заголовков вич-1 то есть корневых таких ну а чисто физически это возможно но на самом деле это будет не правильно то есть h1 заголовок должен быть один на страницу а ужасными можно пользоваться а кстати почему это будет не правильно как ты думаешь но подумал что еще один заголовок определяет всю страницу ну что на ней именно находится на самые скажем так это название книги да а уже дальше пошли главы подзаголовки
01:16:13 - 01:17:42
и и так далее название абзацев ну хорошо тогда в чем у нас отличие тайтл речь один они же по сути за одно и то же то есть тайтл заголовок документа и я че один заголовок документа один мы видим на самой странице и он ну как часть содержимого страницы именно вот который находится в провайдере в именно видимости страницы а тайтл он идет для ну и для seo с той стороны и вот он как раз он он не отображается на самой странице он именно как такая информация отображается для пользователей он во вкладке по сути в
01:17:00 - 01:18:25
название вкладки ну да в целом сам ты правильно говоришь то есть основатели что в чем то есть тайтл это вообще да все документа а еще один он уже конкретно для боди и конкретным для какого-то куска в разметке то есть это та штука которой можно перейти вот и ты можешь на самом деле чаде не указывать при этом оставить просто тайтлы но у тебя будет странице без иерархия заголовков но при этом у тебя будет название документа такое тоже может быть хорошо тогда последний вопрос про заголовки вот как как ты может быть проверял вот эту
01:17:42 - 01:18:59
иерархию заголовков то есть там есть условии что надо соблюдать последовательность то есть у тебя h2 должен наследоваться от еще один и четыре должно т2 на используешь ли ты какие-то инструменты чтобы проверять что у тебя заголовки действительно идут правильно ну инструментами я не пользовался вот это было чисто механически скорее но самостоятельно а формируешь страницу следишь за тем чтобы все это было правильно а вот именно касательно инструментов конкретно проверки нет не использовал но и насколько я помню кажется white хаосе
01:18:20 - 01:19:38
есть всего у детей это то есть по моему сердито все-таки проверяет но это надо перепроверить не могу ошибаться и есть еще один классный инструмент вот наши коллеги и разработчики тоже из россии ты excel у нее есть и чтим он взрывается и чтим l3 это такая штука куда можно вставить разметку и там выведется вся твоя рафия заголовка при можешь посмотреть как всё строится это очень удобно как раз вот понять где может быть ошибка то есть где у тебя неправильно вложенность или еще что то вот инструмент очень полезный я
01:18:59 - 01:20:10
могу дополнить еще есть режим чтения в браузере который позволяет красоту структуру документа отобразить в упрощенном варианте да тоже очень хорошая штука да если ты правильно семантику формирую что соответственно и будут поддерживаться все вот эти штуки типа режима чтения читалки будут править и распознавать и им поисковики тоже тоже будут этому радоваться так хорошо теперь немножко деталь не про семантику поговорим вот у нас есть тобой с заголовки как мы можем помимо заголовков выделять какие-то куски на нашей
01:19:35 - 01:20:52
странице важные то есть обособленная с помощью каких тегов можем что-то семантически отделить друг от друга чтобы ты использовать и для чего ну например можно использовать так nav для того чтобы выделить именно ту часть сайта который отвечает за навигацию меню к примеру либо какая то панель навигации вот можно использовать так footer ну чтобы указать чем footer нижнюю часть которая также указывает но там также как правило навигация какие-то copyright и прочее вот и она ну собственно указать что это не
01:20:13 - 01:21:34
основная часть сайта вот именно его подвал вот так ну какие четких соответственно хедер еще хайдер туда же у нас с тобой еще есть три тоже очень важных тега но можем просто сразу сложно вспомнить это такие а сайт article is action вот сталкивался ли ты с ними и в чем вообще разница между этими тегами когда какой применять ну с action я применял именно для выделения готова была как особо облачко не может быть нужно применить любой стиль и либо ну то есть вы делите и как отдельную секцию агасси с action
01:20:54 - 01:22:46
а вот article не вот это я не пользовался я 10 честно верстка не так много занимался особенно последнее время вот но тоже не приходилось нет не приходилось но хорошо тогда кратенько немножко расскажу чем отличие то есть section и артикул они чуть-чуть похожи но надо понимать когда чтобы менять то есть article он про отделение обособленного куска то есть это часть чего-то цельного то есть не знаю тебя есть статья вот блок где текст статьей и с автором и еще с чем-то вот это цельный кусок это будет
01:21:48 - 01:23:29
article эта часть самостоятельно то есть ты можешь документы выдернуть и она без остальной части документа будет само по себе существовать я не нужно какой-то дополнительный контекст вот section это какие-то штуки допустим внутри того же article то есть у тебя есть несколько статье каких-то важных секции ты их можешь разбить на секции это какие-то на штуки про частное то есть артякова про общего с экшен про частное вот оао сайт это вспомогательная эта штука то есть тот же самый блок с автором он не является частью статьи сам
01:22:41 - 01:23:52
по себе то есть он косвенно связан с ней но это не статья и поэтому это можно положить его сайт это такая вспомогательная информация к статье дополнительный какой-то контекст вот ну вот такое примерно их отличием окей по семантике я думаю все можно следующий вопрос приходить до очень классный вопрос будет хранить не знает весь мир стал ты уже сказал что мало ну ладно допустим приходилось ли тебе оформлять контент в виде таблицы как-то это дело через стиле дисплей grid или через обычные таблицы но тут вообще
01:23:15 - 01:24:47
даже три варианта есть или может через стиле можно либо fleck сами построить табличку либо грядами потому что гряды они всё-таки нушка позже появились и поддержка если нужно там более старых браузеров более полноценный то flexo иногда могут выручить вот хотя это сложнее но гридо гряды они конечно удобнее были бы еще выбрать именно стилями хорошо table на это я услышал от действий табличный контент не знаю там табличка там несколько колонок несколько строк не знаю аналитика какой-нибудь не знаю статистика за последние несколько
01:24:06 - 01:25:32
месяцев чего-нибудь стал это и использовать для оформления мясная гряды вот если бы ты сейчас была такая значит что нужно этот блок как то сделать чтобы ты стал использовать кредо и flex и или может обычно табличку наверное я бы использовал три д ну опять таки вот между грядами и flexo метут поддержка браузеров с одной стороны играет роль вот ну то есть под какие браузера пишется этот сайт вот если нужно что-то древнее то там может быть кредо рефлексы и не потянут и придется все таки таблицы и думать как ее
01:24:48 - 01:26:05
стилизовать но с другой стороны использование тех же годов она поможет проще решить проблему мобильности этого сайта чтобы он был более подстраиваться под разные экраны лишь не бросает речь про блок но у гоблака это все равно часть сайта ну то есть ты бы не стал использовать там требовал со всеми вытекающими ну скорее я бы склонялся все-таки к стилям потому что соответственно это было бы на будущее скажем так больше больше поддержки разных устройств ну то есть проще сделать его более мобильным это
01:25:28 - 01:27:02
цель этот блок до в этом сайте но гиппокамп ничуть семантики но насчет семантики конечно это интересно вопрос потому что да с точки зрения семантики было бы проект правильно использовать таблицы так как тогда соответственно именно этот код и различал собой как строки как таблиц но вот тут как раз вопросы в финал здесь что например таблицы использовать сейчас только для оформления того контента именно контента не визуально какой-то который действительно в виде таблицы это правильно это сим античное логично а
01:26:16 - 01:27:45
когда мы говорим про позиционирование каких-то элементов на странице да там нас абсолютная свобода мы то можем хоть абсолютными хоть флик сами хоть грядами обмазываться хоть флота мин чего хотим делаем плане позиционирования но контент должен оформляться таблицы вопрос как хорошо ты знаешь таблицы именно вот ты был но скажем так я ими пользовался наверное я их знаю не в совершенстве но в принципе хорошо расскажи мне обязательно то есть как выглядит структура таблицы так так так ты был все про ебал в нем
01:27:01 - 01:28:34
соответственно строки тры [музыка] в этих строках уже соответственно идут колонки t&d td даст хорошо им не уточнил ты ничего не забыл ну и соответственно есть 1 основная строка который указывает на шапку таблицы вот каким тегам она указывается я не помню ну то есть же что-то такое есть данная потому что я давно пользовался ей колонки тоже называться будет по-другому нет ну не вспомнишь на сейчас не вспомню хорошо помимо этого еще какие секции есть таблицы ну именно секцию у нее как бы еще свойства можно задавать именно самих
01:27:52 - 01:30:14
стиле получается того как она оформляется нет именно 7 а вот всем отечна наверное не скажу да я таблицами мало пользовался ноги 3 зря ими пренебрегал все тогда это абсолютно зря потому что таблицы это все-таки нужно у нас часто бывает что будто статистику выводим ее тоже делает таблицы и так вот у таблицы обязательно чтобы было заголовочной части это которые будут лейблы это течь это обязательно указывать сам как бы это буде где основной контент таблицы так тоже нужно указывать он закрывающейся в
01:29:05 - 01:30:40
котором будут до строки т.р. и столбцы т.д. все правильно сказал еще таблице есть footer тоже т footer т.к. вот тут уже ничего не меняется все остается то есть автор необязательный а вот такой от это будет обязательный элемент если даже ты напишешь их простота и бтр т.д. куда табличку построишь на самом-то деле браузер умные вот мы и раньше говорили что он умалчивает ошибки и сам достраивают структуру и вот он построит тебе он обернет хит там первую строчку что у нас заголовки есть что у нас тут
01:29:53 - 01:31:07
есть в воде и часто бывает такая проблема не знают и может быть когда нибудь сара работал основная проблема в том что когда ты вот формируешь таблицу частоты шаблонизатор не забываешь о том что тебе нужно это сделать потом когда идет проверка на совместимость html и вот того дом который должен быть построен секрет ошибка что они несовместимы потому что браузер дорисовал и у него другое а то что ты как бы вот сформировал путем кода и шаблонизатора не совпадает станции есть что добавить ну я хотел немножко узнать про вот
01:30:29 - 01:32:02
адаптацию то есть ты говоришь что с годами как тот адаптировать попроще но ведь мы же с тобой можем у той же таблички любой дисплей указать то есть мы можем эту же самую таблицу тоже повесить там дисплей grid дисплей flex то есть почему здесь какие то не знаю проблемы при адаптивности будут но я имею ввиду чтобы еще и контент перестраивать если там вот уже ужимать некуда но все-таки гряды flexo не но есть вот именно брать такую таблицу до какой-то статистике то тут уже никуда не денешь действительно тут и перестраивать
01:31:16 - 01:32:38
не получится но смотри какая проблема по просто я чувствую не приходилось делать такую шутку адаптивность потому что вот-вот и бла есть в чем особенность у него всегда фиксированная структура тебя всегда будет ты был у тебя всегда будет то базе у тебя всегда будет rtd вот с грибами не так за грибами ты сама управляешь своей разметка и взглядами ты можешь любой ячейки сказать куда встать вот с табличкой так сделать не получится потому что у тебя может быть ты хоть какой-нибудь захочешь положить ячейку в какой-нибудь the head
01:31:56 - 01:33:09
и все как бы и пиши пропало вот с грибами тебя таких ограничений нет и поэтому да действительно можно сделать гибче но единстве что угри да сейчас нет поддержки sap городов это нужно когда ты хочешь сделать гриф внутри города и чтобы он знал про корневой грит и умел использовать в эти размеры которые родители есть вот так как вот этой поддержки пока везде еще нет то взглядом тоже есть проблемы при вот попытки как бы сымитировать табличную верстку там не всего хватает что хотелось бы но надеюсь скоро появится и тогда но ты был можно
01:32:33 - 01:33:54
будет использовать но для адаптивности лучше конечно будет крутить на грядах вот на это все дело будущего пока используем табл да окей так движемся дальше наверное надо нам надо уже почти мало закругляться там что-то долго сидим прям поэтому кратенько тебя спросим по последним темам вот хочется подарить про встраивай контент строим и контент что это такое то есть это картинки и всякие фрейме видео вот и хотелось бы поподробней остановить следом он успел только про картинки то есть с картинками у нас можно указать для них размеры
01:33:15 - 01:34:44
допустим то есть можно видеть сходиться находить написать вопрос почему важно так делать то есть что будет если мы для с тобой для картинок не будем эти размеры писать ну может прийти изображение не того размера которые нам нужно и она будет под него подстраиваться подстраивать свой контент есть ли стиле не заданы вот то соответственно нас может либо сильно большое изображение быть ну то есть поплывет все что мы хотели увидеть ну давай представим что она с тобой верстка пуленепробиваемая то есть
01:33:59 - 01:35:16
неважно каких размеров будет картинку на свёртка не поплывет у нас все будет учтено картинка красиво тому живется как то ли еще что то в чем собственно здесь проблема если картинка вот имеет них не какие-то не заранее установлены размеры вот как и на для конечного пользователя это скажется не приходилось заходить на какой-нибудь сайт не знает типа удочки на который сто пятьсот . рынок и я не все грузится не сразу какие там возникают проблемы но получается так можно было бы жировать картинку маленькую вот и соответственно
01:34:37 - 01:36:02
потом они бы быстро училищ я так понимаю если не указать что будет оригинальным размеров но именно тех больших файлов которые возможно кто-то недальновидно а мы не узнаем про размер пока не загрузим картинку и отсюда в чем в чем может быть проблема если мы с тобой начнем с король и допустим допустим картинку у нас тобой там их 20 картинок статья мы с тобой начинаем скролить какие могут быть проблемы если мы не указали размера ну он же пытается все грузить сразу если если это не настроена вот соответственно
01:35:19 - 01:36:48
будет медленно открываться до такие сайты но и кроме того не слышал про такой метрику layout shift но вот это как раз очень сильно связано с тем а если ты не указываешь размер картинок или вообще любого контент который динамически появляется то есть проблем какая ты открываешь сайт там еще картинка не загрузилась у неё высота будет 0 потому что ты ее не выставил мы не знаем размер картинки она будет 0 когда на загрузиться и высота может быть какой угодно и соответствовать и белая угла тета будет
01:36:07 - 01:37:30
будет сдвигаться да и вот ты допустим хотел кликнуть на одну кнопку и ровность тот момент когда кликнем картинка загрузилась и ты кликнул на другую кнопку и все у тебя пользователь будет в ярости просто в ярости он скорее всего уйдет сайта вот такое лучше никогда не допускать если есть возможность указать размер картинки если мы точно знаем размер картинки их нужно всегда указывать чтобы не было таких прыжков это необязательно что надо указывать именно через атрибуты хайд и вид можно указать через
01:36:50 - 01:37:49
css если чсс жестко задашь тоже ничего страшного главное чтобы эти эти размеры оставались такими как какие были изначально можно бы не было в итоге от шифта причем вы и отшив может исходить любое время он может происходить как при загрузке страницы то есть ты увидел страницу и она прыгнула как и по ходу скролла то есть начинаешь скролить у тебя подгружается статьи об тихонечку картинки а загружаются ты читаешь в одном параграфе картинка загрузилась параграф улетела вот это тоже очень плохо для пользователя пипец для этого
01:37:20 - 01:38:23
нам нужно нужно нужно такого избегать хорошо давай тогда про форматы изображений поговорим какие форматы знаешь и какие форматы для чего вообще лучше подходят основные которые используются jpeg png и gif они но если нам нужна прозрачность например то нам jpeg не подойдет потому что он не хранит в себе информацию об альфа канале вот но в то же время jpeg лучше уживается gif имеет определенную анимацию вот и вот тут уже в зависимости от ситуации используются изображения есть также еще вариант вывода
01:37:50 - 01:39:22
изображения этой свечи вот это такой достаточно гибкий ну программный можно сказать способ построения изображений таких векторных вот он хорошо подходит для иконок для значков вот потому что ну во первых потому что масштабировать его качественно легче вот ну наверное даже главное за это ну и им еще управлять тоже кстати легче например какие-то изменять цвета определенных его частей линии там такое не пройдёт со статичными изображениями а все вообще ключевое отличие получается ас в игре от всех остальных форматов которые ты назвал
01:38:40 - 01:40:28
ну все остальные форматы это уже готовый файл который просто загружается байтами на сайте ну получается байтами и выдается только та картинка которые есть вот а из фиджи это изображение она строится на сайте вот именно из кода которые скажем так существует в нем вот но тут не то что бы скорее нет ни в байтах равенство будет то есть она конечно будет там в байтах отличаться но здесь именно концепция растровые изображения против векторных то есть векторные изображения стильно ты правильно говоришь что они рисуются да
01:39:33 - 01:41:00
все так они рисуются растровые они уже в конкретных размерах нарисованы и все и больше ничего с ними сделать нельзя тот же джипег ты его хоть увеличиваю 100 раз и больше вас решения ты не увидишь с одышкой можно с келли сколько угодно ты увидишь максимально зашей насколько это позволяет вектор то есть все зависит от того насколько детально прорисованы вот эти векторные края окей а не слышал ли ты про такой формат как в пвп слышал о такой свежий относительно формата но я им так не пользовался еще но вот ты просто сказал
01:40:18 - 01:41:42
gif ну на самом деле gif сейчас применять на сайтах это скорее анти по тону потому что он очень тяжелый он нереально тяжелый если ты можешь лучше конечно применять видео прям так видео вставлять потому что видео будет тупо меньше весить сейчас настолько хорошие кодеки по сжатию видео что дешевле использовать videotec чем картинку гибкой вставлять вот но в каких-то случаях видео неся вставить ее приходится после gif такое может быть а в.п. нужно использовать вообще в принципе всегда когда есть возможность то есть
01:41:00 - 01:42:09
выпей это просто формат в котором можно гораздо эффективнее сжимать те же самые картинки там можно использовать ту же самую прозрачность то можно применять очень крутые кодеки и мощные вот и поэтому если есть возможность использовать вопил лучше конечно использовать в.п. вот к сожалению поддержка не идеально у него то есть где то нужно будет либо запале пилить либо что то еще применить вот кстати как мы с тобой можем для одной картинке указать несколько форматов вот нам допустим как раз нужно с тобой сделать одну картинку в
01:41:34 - 01:42:49
png но потом я очень сильно уважать ввп и при этом чтобы для тех кто поддерживает в.п. они увидели именно в.п. а те кто не поддерживает они бы увидели png вот как мы это с тобой можем сделать вообще ну через css я так понимаю через все со как частица сделать через css надо учитывать какой браузер тут даже не медиа наверно запрос получается комедия запросам кстати про что медиазапрос он больше про экраны про устройство которые используются но размеры про вот это то есть ты предлагаешь отдельный стиль и
01:42:14 - 01:44:03
грузить разным браузером ну через те лишь мы получается знаем какой браузер потому что допустим некоторые стили ну специфические для браузеров по-разному применяются стиле мы не знаем какой у нас браузер но есть конечно сайт с х коми огромная портянка хаков для применения стилей для конкретных браузеров но он устарел очень сильно сейчас браузер и все настолько стали похожи друг на друга что большинство из этих хаков они применимы для каких-нибудь safari 5 6 там есть и так далее для современных браузеров это не
01:43:07 - 01:44:25
работает сейчас так никто не пишет код css с мыслью о том что вот эта часть выполняться только в конкретно браузер причине пишет еще есть так picture по-моему называется этого можно несколько картинок задач наверное через него можно решить этот вопрос вот но я не так хорошо знаю это так вот как им пользоваться но до безбожно разные картинки сдать occur in picture кстати может можно сможет можно что-то кроме picture использовать ну то есть не знаю абстрагироваться вообще от нашей страничке вот у нас есть тобой одна
01:43:51 - 01:45:07
ссылка можно ли это не на уровне html решить не знаю но тот вопрос мишка pptp потому что на сочтите пи есть заголовки акцепт от клиента то есть твой клиент посылает при загрузке картинки форматы в которых он может прочитать картинку если он туда пришлет в.п. то ты можешь на том же уровне индекса решить что ему отдать то есть у тебя может быть ссылка ввести не на конкретный файл а просто на название картинки а уже джинкс будет решать в каком формате отдать вот то есть можно уже не ешьте типы даже так разрулить какую
01:44:29 - 01:45:59
картинку лучше отдать клиенту и он получит только то что он может поддерживать вот такой подход тоже существу хорошо и давай вот последняя про с в год а мы сидим долга вопрос как можно нас с вами жку вставить то есть картинкам понятно тем же или background image а как можно ставить из в гсвг ну и представляет собой и вот именно описание того как будет строиться эта картинка вот и соответственно она вставляется в уже непосредственно в код скажем так уж там называется онлайн такие дела нити как можно еще но
01:45:14 - 01:46:52
им же понятно то есть можно с игрушку внж блажить можно заменить а как еще можно сделать ну вот я только два варианта использовал можно и за искусства можно из одной свой горшки к другой братец как ну в принципе да я с вышки не так хорошо знаю вот именно все детали их построения вот но насколько я понимаю вполне возможно потому что она именно рисуется в браузере но вот смотри у нас есть такой паттерн для использования в gta спрайта то есть как он работает есть один файл с кучей svg шик там их можно отлить по разному
01:46:10 - 01:47:47
можно как символ определить можно просто как с обложки то есть мы с вами можем высокое вкладывать это не запрещается вот а потом можем в конкретном месте где нам нужно этой kong получить можем тоже объявить т.к. svg и написать так уж и через вот этот тег получить конкретную иконку из вот этого спрайта через юз обратиться поедишь нику как он кият рисовать конкретную конку вот так работают все спрайты svg ну про ограничения расскажу наверное по ограничение не сталкивался но здесь с юзом проблема в том что он не кросс
01:46:59 - 01:48:10
домены то есть edius можно использовать только на этом же домене если попытаешься обратиться к юз на другой домен у тебя будет ошибка курс и ничего не получится поэтому когда утечка какая-то сиденко куда ты грузишь все ассеты и при этом используешь спрайта испугаешь но у тебя будут здесь проблема придется как-то это разделять вот здесь есть особенность и ну тут разные подходы и можно картинку отдельно куда-то бил из другую папку можно инлай нити с флешку тоже вариант мы можем к онлайн спешке поддержки обратиться вы
01:47:35 - 01:48:47
тоже самое но здесь мы пациенты до каширования в общем здесь такая штука типа надо искать баланс то есть у каждого из подходов есть какие-то свои минусы здесь нужно ходить что нельзя работает конкретно вот окей наверное покажу игрушки еще можно шрифтами грузить ну да но это но это не не особо рекомендуется то есть shift и свои грешные ну такое да ним еще бляха шконки у нас это популярно почему прикончены и шрифты зла не используйте гоночной shift и но это кстати это отожрать лайк а если используют и гоночный шрифт так ну
01:48:11 - 01:49:39
наверно последнее затем вычтим разберем и уже дальше хорошо давайте быстренько приходилось и используйте freemium наутро немножко затрагивались этой темы явилось ли встраивать один сайт в другой сайт и фреймы но именно потребности такое у меня не возникало вот но я так не много читал про это но скажем так вот прямо потребностью у меня не было поэтому я этим особо не пользуюсь хорошо может быть ты знаешь на что можно управлять кремом можем ему задавать размеры например ну айфрейм это блок на странице поэтому
01:48:55 - 01:50:21
в принципе мы можем именно указать в какую область мы грузим вот просто другой момент как от рисуется вот там вот этот внутренностью но это да это не немножко нюансы хорошо можем ли мы узнать и как если можем что и фрейм у нас загрузился контент внутри него я думаю она дает какое-то событие вот ну вот какой особый чей я точно не знаю хорошо если текущую страшно быть как мы узнаем что она загрузилась через через логично а если нет но можем на глаз с грузом похоже что загрузилась до носа когда вам говорят через ds постоянно
01:49:36 - 01:51:47
хочется спросить а если через защиты mail можно через ищите музыки через с может нужно что при взгляде но соответственно у нас есть чтобы ча ну и так он учась рендер проходит несколько этапов это подгружается что мэл потом соответственно элементы на него не отвечу наверно еще сразу ну там два есть например есть когда загрузился дом это дом кантерлот за когда просто сложиться лаут в общем у них время тоже есть вот события что он загрузился хорошо можно ли как-то общаться с между двумя этими изолированными кусочками между фреймом и
01:50:47 - 01:52:31
самой странице но это использовал ты не знаешь поэтому расскажу я можно через пост мэсседж и общение ограничено рамках одного да да мимо то есть если ты встраиваешь контент другой какой то другом домене то он уже общаться не получится ты сможешь хотя нет ты не сможешь заглянуть внутрь вот но общаться можно подписываясь на эти пост месяц что есть но то есть это односторонняя связь и фрей может эти события отдавать наверх типа смысле мы можем их принимать новый я уточню что посмотришь он как раз для
01:51:37 - 01:53:12
того что у тебя и фрейм с другого домена то есть если ты фрейм строился этого же дома на тебя посмотришь не нужен ты можешь прям в документ залезать идет там че хочешь и прямо на объект документа смотреть или на windows то есть там все работает вот посмотрим как раз karos домены и ноги поправочку сделали все таки пас мышь по моему быстро работает то есть фрейм кажется может подписаться на родительский документ там по моему есть парень документ и по-моему там можно подписаться но я точно не помню то
01:52:27 - 01:53:33
потому что но не все это используют скажем так давай нам это нарезка из нашего личики они очень любят годам да точно формулируем ребят если машина из орех пишите в комментариях отлично уже будет интересно чем там все закончится давайте уже последнюю тему потому что времени мало любимый блок ксс хорошо давай простой вопросик по ксс мой любимый какие ты знаешь способы изоляции вообще зачем нам нужно изоляция двое его лучше с этого начнем но изоляция нам нужно потому что если к примеру классе названная одинаково но
01:53:01 - 01:54:41
они должны использоваться по разному скажем так новые они в разных модулях каких-то которые из которых мы собираем сайта потом возникнут конфликты да будут перетираться стиле и неожиданно меняться из не ожидаемое поведение будет скажем так внешнего вида вот а изолятором как конфликт имен там еще будет самое основное что делает наш любимый css ну перетирать свой то есть соответственно этаж каскадные таблицы стилей и все что будет позже вот и будет и применяться да да на то что перетираться может возникнуть неожиданно
01:53:52 - 01:55:19
каскад вот ну а как нам избежать вот этой проблемы с одной стороны можно использовать технологию б.м. для именования и соответственно продумать сначала архитектуру скажем так как достигается изоляцией если ты используешь бы ну она скорее механически достигается в том плане что мы используем блоки их элементы у этих элементов есть но блоки и элементы и соответственно если мы понимаем да что вот точно такой же блок используется в другом месте то мы его используем но вот этот класс который мы назвали но
01:54:35 - 01:56:12
в то же время ну то есть тут сначала идет планирование интерфейса потом уже назвал разбиение его на блоки и элементы и правильных но все правильно отвечаешь она только знаешь формулировать более четко смущено конфликтов не возникает ну потому что изначально уже структурирована все правильным образом вот но и название уже заданы исходя из использования вот этого блока ну то есть если он точно такой же перри используется в другом месте то он там так будет называться вот но если мы назовем с тобой два разных блока одним
01:55:28 - 01:56:59
именем это уже будет или или что-то так ну это значит будет какой-то поломанный вам ну просто вот в этом и суть как разбавим а что у нас конфликты в основном за счет чего возникают за счет того что у нас идет какая-то какой-то пресечение по названию классов или ну просто по селектором есть у нас одни селекторы пересекаются другими селектора me вот здесь возникает проблема с изоляцией bang bang эту проблему решает за счет уникальных классов у тебя во всем проекте не должны классы повторяться вообще нигде если ты делаешь какой-то и
01:56:14 - 01:57:40
солидный блок он пишет только свои классы у тебя возможно могут появляться какие-то супер минимальные утилитарные классы такое конечно может быть но в основном вам про то чтобы писать всегда уникальные классы и за счет этого ты задержишься вот это это как раз предсказуемость вот это про предсказуемость но плюс в том что как раз мы конкретизируем название имен то есть сам модуль блок элемент и тем самым получаем кроссворд составное имя которое уникально в рамках всей страницы но вот по поводу изоляции стиле
01:57:00 - 01:58:22
еще выход достаточно неплохое интересные это товарные стиле когда мы называем определенный набор стилей скажем так даем ему имя и используемого уже для построения конечно конечно пример назовешь какой-нибудь тайвин тот же самое принимаете и подобные а в чем кстати минусы подходов вот если ты возьмешь бэм какие у тебя будут минусы возможно которые ты знаешь ее steel windom но что касается б м а ну во первых тут получается должна быть заранее продуманная четкая структура и дальше следовать apple если допустим большая команда и не все
01:57:40 - 01:59:20
относятся к этому внимательно то получается опять таки может быть пересечении имен вот то есть либо должен быть какой-то отдел которая это контролирует и только оттуда жестко используется вот ну то есть он не защищает абсолютно пересечениями он скажем так потому что все равно тут человеческий фактор может сыграть в отношении еще минусов его надо в отношении тела windows мемам там примерно когда у нас понятно он все равно там уже все все его проблемы ясно в отношении келвин да но с одной стороны
01:58:30 - 01:59:59
один из таких минусов это читаемость то есть когда нужно достаточно сложный какой-то сформировать результат может растягиваться описании вот этих классов она достаточно большой объемный может стать ну то есть вот эти вот маленькие описаниях много до в одном элементе в каком-то и ну получается большой html вот то есть с одной стороны у нас вроде как нет неиспользуемого css а мертвого css но в то же время у нас есть более большой html css меньше становится html больше вот и тут надо думать что ли нас
01:59:15 - 02:00:38
оптимальнее но я не соглашусь мертвый с из нас может остаться запросто например тоже таиланд он генерирует трех с половиной мегабайт ней банду из всех возможных сочетаний своих классов и стилей это при разработке а в дальнейшем уже можно это настроить чтобы он собирал именно чистили ну вот если брать именно тайл винт как готовы в библиотеку то она достаточно гибкое и можно настраивать чтобы он от использовал в конечном ван ли который на пород полетит чтобы были именно те стили которые надо будет достаточно за счет
01:59:57 - 02:01:17
чего это достигается но сборщик он соответственно уже анализирует но во время сборки анализируются какие стиле используются и только они включаются в конечно вот именно оттуда возникает еще одно ограничение кончать по использованию долги атомарного css таиланда как сборщику знает что этот класс ты используешь а какой-то другой нет но должен пройтись по всему что есть соответственно проанализировать ну и соответственно у него должен быть вот этот вот набор шаблонов которые существуют в принципе да там эти три
02:00:36 - 02:02:14
грубо говоря с половиной мегабайта из них он должен выбрать только но там обычно историю строчный парсинг of числе ограничено потому что ты не можешь использовать конкатенировать имена сижу тебя имя класса является частью переменной и ты их собираешь в один и тогда сборщик никак не определиться что это вот существующим классам почитай что его нет его не использую это вот еще один ограничения я бы здесь надо уточню немножко что это вообще в принципе про runtime стиля то есть вот элвин до проблема с runtime стилями в плане того
02:01:26 - 02:02:39
что тебе все все классы которые хочешь фронтами то мне знак генерировать добавлять их придется положить вот в отдельный white list есть какой-то белый список когда который sti классов которые сто процентов попадут в банду и они там всегда будут лежать вот потому что по-другому просто никак тайвин просто не узнает про то что эти классы будут использоваться вот но это такое ограничение вот этого сборщика который чистит ненужные класса но можно даже назвать его это конкретно называется пусть с с кажется plugin repost css луны и если
02:02:03 - 02:03:21
это сын он сверяет к системе кстати говоря пока мы об этом поговорили о таиланда появился jit способ как раз компилировать части или которые ты использую что есть обратно не начали все а потом вырезать которые не нужно а наоборот только те что использовал те генерировать работает много быстрее вот они обещают что там ближайшем большому обновление будут это уже по умолчанию работать но и в отношении изоляции стиле еще некоторые фигурки предоставляют некоторые возможности там тот же в школу пустили
02:02:41 - 02:04:06
но это не всегда работает достаточно хорошо то все равно бывает вылазит можно скачать до 2 минуса эскапада скоpо да ну вот явью не так хорошо знаю я его сейчас только начал интересоваться им потому что ну хочется понимать то есть вдруг столкнусь а вот но нет идеальных free work of дело не его вьюга где у него ее тело в принципе который он использует для изоляции стиле то есть опыт испытанием слышал ты знаешь что на себя представляет то есть он записывает каждому классу который используется в каждом компоненте свой уникальный
02:03:24 - 02:04:58
модификатор то сразу вытекают проблемы много и беспощадно вот подумай логически то есть тут надо знать о нюансов и мер к чисто подход он очень опорный коли же может быть вот этих уникальных идентификаторов чисто теоретически вот то что их хэш-таблицах бывает кризис носит и тут ну и соответственно тогда опять будет проблема но коллизия имен не зная ни разу не сталкивался в этом плане подумали хорошо как ее не то не допустить но ты можешь подумать ещё каким из этого быть проблем но получается если нам нужно все-таки
02:04:12 - 02:06:12
переиспользовать какие-то стили то мы их уже не сможем они будут автоматически меняться именно мы не будем знать как до принимается но я бы я все-таки сказал что в его компания все оптимизирует то есть у тебя для каждого компонента ейского пойди он старается максимально оптимизировать и у тебя за всех инстансов одного компонента будет отдельная isakova по идее он не будет каждый раз для каждого компонента новый поэтому здесь есть какая-то оптимизация дело другое в том что у тебя эти один ты должна появиться
02:05:15 - 02:06:34
то есть тоже the wind этот же б.м. они не имеют runtime а то есть runtime это то что у тебя вызывается на клиенте какой дополнительный код скал подстели без runtime они могут существовать то есть если ты runtime уберешь у тебя никакого ского куда не будет вот для дома и для тела винты runtime вообще не нужен они живут в комп файл t'aime то есть на уровне компиляции обоим вообще даже без компиляции живет ему даже компиляция не нужно просто вешаешь стиль и вешаешь классы и все у тебя все работает из коробки без дополнительных
02:05:56 - 02:07:03
телодвижений вот эта винда посложнее а узко путь еще сложнее ну и плюс это раздувается файл стилей насчет того что каждому классу назначается уникальный индикатор компонентов которые используются и от этого тоже никуда не уйти так но я предлагаю нам с потихонечку заканчивать потому что мы уже сидим очень долго и в принципе по оси сосуд утром развернулись думаю мы там дальше да не будем все вдруг оса спрашивать будем какие-то подводить итоги вот и передаю слово владу сказать свое мнение свои впечатления ну мои
02:06:30 - 02:07:55
впечатления какие то есть видно что опыт есть то есть много разного видно что такими вещами сталкивалась ну так же видно с какими не сталкивался скажем так или джона если мы отмотаем как джуна знание более чем достаточно я там но практически кто угодно с руками оторвет потому что есть понимание того как вообще в что из себя представляет пусть там где-то есть просадки но понятно что там за счет любви к теории можно легко наверстать но базовое понимание есть рассуждать можешь то есть там есть некоторые моменты не назвал это не так
02:07:14 - 02:08:49
страшно главное что есть понимание база неплохая то есть видно что читал корни java script по java script у кому вообще [музыка] лично мне показалось самый лучший блог то есть видно что по верстке вопросы есть по стилям вопросы есть то есть тут чисто достигается лесу все хорошо знаешь то есть я скажу что ты проходишь на junior позицию спокойном уверенно 3 слаб да у меня тоже очень хорошее и позитивное впечатление на все вопросы мы получили плюс минус такой хороший ответ вот на некоторые получили прям очень
02:08:03 - 02:09:46
хороший ответ то есть по джессу там действительно было много таких полных раскрытых ответов что очень хорошо вот там свой папе какие-то были не большие просадки там паше до удобно но это все такое да с опытом ну и плюс shadow домом тоже не каждый джон сталкивается это такое да но мы просто решили в разные точки пострелять посмотреть что у что у тебя хорошо отложена в памяти что не очень вот вы по большей части очень все хорошо поэтому считаю что на джона сто процентов проходишь прям очень все хорошо даже вот на такого уже джуна
02:08:56 - 02:10:14
постепенно перетекающий дидло я бы сказал что есть опыт использования почти всех вещей которые мы назвали но единственно что вот с фреймами ты говоришь не очень работал но я думаю что придется с ними столкнуться рано или поздно когда ноутбуке не платежки добавлять на сайт вот я придет с этим столкнуться но в целом впечатление очень хорошая считаю что у тебя отличные перспективы очень классно что ты загорелся фронтэнда пришил в него удариться потому что у тебя получается мне кажется прекрасно вот это вот так
02:09:35 - 02:10:42
дальше таким же темпом идти и что там смотреть как бы побыстрее уже продвинуться до метла и так далее вот поэтому очень все классно ты молодец давай теперь твои впечатления послушаем как считаешь как прошло впечатление члене очень положительные я очень благодарен вам обоим за вот это собеседование потому что с одной стороны в каких-то областях оно помогло мне укрепиться в понимание того что я все-таки понимаю вот и с другой стороны я увидел те моменты которые действительно могу еще углубить понять
02:10:08 - 02:11:36
разом отца может быть попробовать в каком нибудь там маленьком пэт проекте потренировать чтобы в дальнейшем чувствовать себя уверенно как вот я даже выписал себе некоторые нюансы которые не ответил которые там например действительно требовали такого пояснения и ну конечно обязательно буду расти до дальше потому что есть чем почти всегда и вот такие собеседования не всегда помогают это увидеть это здорово спасибо но и нашим любым и хейтерам шах и мат джунг 35 это реально никаких комплексов никаких проблем я думаю что можно только
02:10:54 - 02:12:26
восторгаться потому что человек пришел наконец к этому да спасибо те что пришел было классно 100 пообщаться и наверное какие-нибудь заключительные слова от влада а что так не хочешь сам попросить наших подписчиков подписываться на по три ты хочешь снова на нашей дороге нужно писать в комментариях нарушим нашу традицию до подписывайтесь на наш канал оставляйте комментарии ставьте тоже колокольчик кстати говоря тоже полезно и спасибо нашим патроном которые нас постоянно поддерживает они кстати будут
02:11:38 - 02:12:50
смотреть этот выпуск уже четверг вот если хотите тоже смотреть четверг подписывайтесь на patreon и у нас появилась подписка теперь на ю тубе можете подписаться прямо на ю тубе это же получаете выпуске четверг но и вообще спасибо всем подписчикам который нас постоянно смотрит нашим постоянным зрителям и за следующий выпуск а всем пока-пока yamaha
02:12:15 - 02:12:59