Собеседование Middle Frontend-разработчика + Live Coding | JS, Typescript, React, FSD, Next.js

[@PurpleSchool]

Хотите принять участие в съемках? 📝 Оставьте заявку в форме - forms.gle/6uTY5rig17guS3tE9 Наш телеграм-канал с новостями веб-разработки, полезными материалами, возможностью участвовать в карьерных консультациях, мок-интервью и активным чатом на 4 000 ребят с самым разным опытом, присоединяйтесь! ✈ t.me/purple_code_channel Полезные видео 🍿 Код-ревью: 8 ошибок в 1 кнопке на React - kzbin.info/www/bejne/qInQhmSioNGhgsU 🍿 Обзор нового React 19 - kzbin.info/www/bejne/j6fbq5mQfN2Eh5Y 🍿 Новости веб-разработки - kzbin.info/www/bejne/n36pqqSmnryLlbs Бесплатные материалы 🗂 Бесплатные карты развития в разработке под вашу ситуацию - purpleschool.ru/skills? 🗂 Бесплатный курс «Основы разработки» - purpleschool.ru/course/code-basics? 🗂 Бесплатный курс «CSS Flexbox» - purpleschool.ru/course/flexbox? Обучение по темам из видео 🚀 Карьерный путь «Frontend-разработчик» с 1,5 года практических проектов, полным освоением навыков и опытным наставником - purpleschool.ru/profession/frontend? 📚 Курс по теме «HTML и CSS» - purpleschool.ru/course/git? 📚 Курс по теме «Продвинутый JavaScript» - purpleschool.ru/course/javascript-advanced? 📚 Курс по теме «TypeScript с нуля» - purpleschool.ru/course/typescript? 📚 Курс по теме «React и Redux Toolkit» - purpleschool.ru/course/react-redux? 📚 Курс по теме «Next.js - с нуля» - purpleschool.ru/course/nextjs? 📚 Курс по теме «Feature-Sliced Design» - purpleschool.ru/course/fsd?

[@grovestreet2126]

Как всегда вышел имбовый видос. Благодарим вас, Антон Ларичев, что вы снимаете для нас имбовые и обучающие видео)))

[@PurpleSchool]

Спасибо)

[@Script696]

Что то тут напутали, господа const delay = (ms, rValue) => { return new Promise(resolve => { setTimeout(() => { resolve(rValue); }, ms); }); } const values = [1, 2, 3] values.forEach(async (value) => { const res = await delay(1000, value); console.log(res) }) console.log('DONE') Тут всегда будет вывод 1, 2, 3 в таком порядке forEach тут вообще не причем

[@PurpleSchool]

Да, тут лучше было бы сделать случайную задержку, чтобы точно получить разные результат const res = await delay(Math.floor(Math.random() * 2000), value);

[@tacituskilgore2258]

Побольше таких видосов, Антон !

[@PurpleSchool]

Хорошо)

[@sashas.3323]

на 14.20, так с forEach-ем вывод правильный 1,2,3, он не дожидается выполнения , но ведь setTimout-ы были запланированы в нужно последовательности. я проверил в браузере

[@ЕвгенийКраев-я2ж]

31:50, а зачем тогда нужны серверные, если клиентские тоже рендерется на сервере, к чему такое разделение?

[@PurpleSchool]

Так как на клиентских нельзя получать данные на сервере.

[@FedorRasputin-v6i]

Сразу же лайк ❤ Нужно больше таких видео

[@PurpleSchool]

Спасибо!

[@xyozy8]

8:34 помню год назад вы мне говорил, что семантика имеет небольшое(или даже было озвучено 'минимальное') влияние на сео)) про fsd, конечно, грустно слышать, такой неудобный подход столь популярен😢, а так собес интересный)

[@user-Duke2017]

Карго культы очень любят в России, это норма

[@PurpleSchool]

Не большое, но сементика будет плюсом.

[@pika4u380]

Там точно не оговорка в конце про Middle+?)

[@СамирАбасов]

Использование tw похоже на использование ts. Первые ощущения негативные и возникает куча вопросов зачем всё усложнять. Но после того как пользуешься не понимаешь как вообще по другому можно. В недостатки tw всегда приводят огромный код, но эта проблема решается плагином, точное название его не помню вроде inline fold, он просто сворачивает все классы пока не нажмёшь на classname='...' по итогу кода становиться меньше. Плюсы tw которые парень не смог описать 1. Скорость написания, вам больше не нужно придумывать кучу имен классов, это снижает нагрузку на мозг для которого подобная задача является часто тяжелой 2. Скорость отладки, больше не нужно искать какие стили влияют на компонент, как они определены и где они хранятся. 3 Переиспользуемость - компоненты которые используют tw можно скопировать с других проектов и с большой вероятностью они будут выглядеть как и предполагалось, чем в случае с кастомными стилями, когда вам придётся понять как вообще в проекте устроена система стилизации. Есть еще преимущества, но их более сложно описать, например быстрое создание вариативности классов

[@PurpleSchool]

👍

[@sharkman6434]

Насчет тайлвинда согласен +100500, реально быстро писать и не думаешь о классах + нет отдельных.файлов для скачки по ним, вся разметка перед глазами прям на логике что очкнь ускоряет + вся легенда про лапша код это миф. Парню годик и пару жирных прожектов и пойдет.

[@СамирАбасов]

Использование tw похоже на использование ts. Первые ощущения негативные и возникает куча вопросов зачем всё усложнять. Но после того как пользуешься не понимаешь как вообще по другому можно. В недостатки tw всегда приводят огромный код, но эта проблема решается плагином, точное название его не помню вроде inline fold, он просто сворачивает все классы пока не нажмёшь на classname='...' по итогу кода становиться меньше. Плюсы tw которые парень не смог описать 1. Скорость написания, вам больше не нужно придумывать кучу имен классов, это снижает нагрузку на мозг для которого подобная задача является часто тяжелой 2. Скорость отладки, больше не нужно искать какие стили влияют на компонент, как они определены и где они хранятся. 3 Переиспользуемость - компоненты которые используют tw можно скопировать с других проектов и с большой вероятностью они будут выглядеть как и предполагалось, чем в случае с кастомными стилями, когда вам придётся понять как вообще в проекте устроена система стилизации. Есть еще преимущества, но их более сложно описать, например быстрое создание вариативности классов

[@sharkman6434]

@@СамирАбасов + эффективный поиск по классам просто бомба, скопировал классы в девтуле и нашел в проекте это место + кастомизация простая понятная. Работал с ним в большом проекте на нексте, не заметил длинные классы, обычно длинные были места где не правильно написанно и пытались без clsx что то делать )

[@lex_nel3097]

Вопросов чет маловато. Про git например, про REST API. Но тогда видео бы растянулось часа на 3)

[@PurpleSchool]

ага

[@lex_nel3097]

Почему React!? Frontend - это не только React.

[@PurpleSchool]

Да, но данный кандидат пишет на React

[@Kira_sk]

Проблем не будет если добавлять data-test-id

[@PurpleSchool]

@@Kira_sk 👍

[@JJohnson-fy9uz]

ну тут максимум trainee, на junior в текущих реалиях не тянет

[@Script696]

И на что он не ответил на Джуна ?

[@DefaultProgger]

да на студента 1 семестра шараги тогда уж скорее, раз это для тебя trainee))))))

[@pika4u380]

Вам же сказали, Middle+)

[@user-Duke2017]

Ну да, ну да, а потом заходишь на проект к таким мегасеньорам, а у них все функции в useCallback обернуты, зато у них вокруг все trainee

[@pika4u380]

@@user-Duke2017 Да не, как по мне, кандидат хорошо отвечал