Вопросы на собеседовании на фронтенд-разработчика
Это — видеокаст, в котором Евгений Ковальчук помогает подготовиться к собеседованиям на позицию джуна и мидла фронтенд-разработчика. В нем вы найдёте технические вопросы, которые можно получить на интервью.
Сохраните, чтобы не потерять: https://www.youtube.com/watch?v=RKFu0MC1aUs
@tproger_web #собеседование #фронтенд
Original post link: t.me/tproger_web/4457
Forwarded and filtered by @smartfeed_bot
Это — видеокаст, в котором Евгений Ковальчук помогает подготовиться к собеседованиям на позицию джуна и мидла фронтенд-разработчика. В нем вы найдёте технические вопросы, которые можно получить на интервью.
Сохраните, чтобы не потерять: https://www.youtube.com/watch?v=RKFu0MC1aUs
@tproger_web #собеседование #фронтенд
Original post link: t.me/tproger_web/4457
Forwarded and filtered by @smartfeed_bot
Forwarded from Senior Frontend - javascript, html, css
Объясните разницу между методами forEach() и map().
Методы forEach() и map() определены на нескольких структурах данных. Мы рассмотрим чем отличаются эти методы для массивов.
Оба метода принимают колбэк, который вызывается для каждого элемента. Разница в том, что метод forEach() ничего не возвращает, а метод map() возвращает новый массив с результатами вызова колбэка на каждом исходном элементе. Если переданный колбэк ничего не возвращает в новом массиве появится undefined
Вы можете вернуть значение и из колбэка для forEach() но оно никак не будет использоваться дальше.
Используя map() вы можете создавать цепочки вызовов. Если же вы будете использовать forEach() так сделать не получится.
В примере выше изменился только myArray2.
Для закрепления, реализуем ту же самую логику при помощи forEach().
👉 @seniorFront
Методы forEach() и map() определены на нескольких структурах данных. Мы рассмотрим чем отличаются эти методы для массивов.
Оба метода принимают колбэк, который вызывается для каждого элемента. Разница в том, что метод forEach() ничего не возвращает, а метод map() возвращает новый массив с результатами вызова колбэка на каждом исходном элементе. Если переданный колбэк ничего не возвращает в новом массиве появится undefined
Вы можете вернуть значение и из колбэка для forEach() но оно никак не будет использоваться дальше.
[1,2,3].forEach(a => a + 3);
Используя map() вы можете создавать цепочки вызовов. Если же вы будете использовать forEach() так сделать не получится.
const myArray = [4, 2, 8, 7, 3, 1, 0];
const myArray2 = myArray.map(item => item * 2).sort((a, b) => a - b);
console.log(myArray); // [4, 2, 8, 7, 3, 1, 0]
console.log(myArray2); // [0, 2, 4, 6, 8, 14, 16]
В примере выше изменился только myArray2.
Для закрепления, реализуем ту же самую логику при помощи forEach().
const myArray = [4, 2, 8, 7, 3, 1, 0];
let myArray2 = [];
myArray.forEach(item => {
myArray2.push(item * 2);
});
myArray2 = myArray2.sort((a, b) => a - b);
console.log(myArray); // [4, 2, 8, 7, 3, 1, 0]
console.log(myArray2); // [0, 2, 4, 6, 8, 14, 16]👉 @seniorFront
🦾Использование кастомных шаблонов и конфигов для swagger-typescript-api
В этой статье автор описывает процесс на примере своей задачи, показывает, как можно модифицировать шаблоны для генерации нужного кода.
Читать...
Original post link: t.me/frontendnoteschannel/3428
Forwarded and filtered by @smartfeed_bot
В этой статье автор описывает процесс на примере своей задачи, показывает, как можно модифицировать шаблоны для генерации нужного кода.
Читать...
Original post link: t.me/frontendnoteschannel/3428
Forwarded and filtered by @smartfeed_bot
Курс: Основы API
Забирайте базовый курс по API. Тут разбирают, что из себя представляет API, как работает и зачем он нужен. Также рассмотрят примеры использования, способы вызова и тенденции развития.
Понимание принципов работы API становится всё более актуальным для карьеры в индустрии разработки ПО. На курсе вы изучите некоторые фундаментальные концепции API и определите общую модель того, как он используется: https://stepik.org/course/124947/promo?search=3345883703
@tproger_web #инструменты #курс
Original post link: t.me/tproger_web/4458
Forwarded and filtered by @smartfeed_bot
Забирайте базовый курс по API. Тут разбирают, что из себя представляет API, как работает и зачем он нужен. Также рассмотрят примеры использования, способы вызова и тенденции развития.
Понимание принципов работы API становится всё более актуальным для карьеры в индустрии разработки ПО. На курсе вы изучите некоторые фундаментальные концепции API и определите общую модель того, как он используется: https://stepik.org/course/124947/promo?search=3345883703
@tproger_web #инструменты #курс
Original post link: t.me/tproger_web/4458
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
💿 Song Selector
Реализовано на HTML и SCSS. Анимация реализована при помощи библиотеки Flipping.
👉 @seniorFront
Original post link: t.me/seniorFront/3923
Forwarded and filtered by @smartfeed_bot
Реализовано на HTML и SCSS. Анимация реализована при помощи библиотеки Flipping.
👉 @seniorFront
Original post link: t.me/seniorFront/3923
Forwarded and filtered by @smartfeed_bot
✍️ REM – шрифт без засечек, который подходит для экранов устройств и брендинга продуктов. Пример можно посмотреть в сниппете "45 CSS Only Buttons"
Сайтодел | #шрифт
Original post link: t.me/sitodel/1702
Forwarded and filtered by @smartfeed_bot
Сайтодел | #шрифт
Original post link: t.me/sitodel/1702
Forwarded and filtered by @smartfeed_bot
😯Сравнение работы ре-рендеринга страниц в React и Vue
В этой статье мы проведем общее сравнение ре-рендеринга страниц при обновлении данных в таких библиотеках: React.js и Vue.js.
Читать...
Original post link: t.me/frontendnoteschannel/3430
Forwarded and filtered by @smartfeed_bot
В этой статье мы проведем общее сравнение ре-рендеринга страниц при обновлении данных в таких библиотеках: React.js и Vue.js.
Читать...
Original post link: t.me/frontendnoteschannel/3430
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
slowroads
Пора за руль: это гонка с процедурной генерацией пейзажей и сменой дня/ночи прямо в браузере. Работает только на девайсах с клавиатурой.
slowroads.io
Original post link: t.me/senior_front/1922
Forwarded and filtered by @smartfeed_bot
Пора за руль: это гонка с процедурной генерацией пейзажей и сменой дня/ночи прямо в браузере. Работает только на девайсах с клавиатурой.
slowroads.io
Original post link: t.me/senior_front/1922
Forwarded and filtered by @smartfeed_bot
Forwarded from Senior Frontend - javascript, html, css
Кодер умеет в пыху. Какие словечки бесят айтишников
Автор статьи провел опрос и узнал, какие слова, словечки и высказывания раздражают IT‑специалистов. Среди ответов есть неожиданные, но лидер вряд ли кого‑то удивит. Как к этому всему относиться? Как к профессиональному жаргону, который есть в каждой специальности. Обычного человека, скорее всего, покоробят профессионализмы юристов и врачей, но для нас всех короткое и ёмкое слово — формулировка короткой и точной мысли. По крайней мере, очень хочется так думать;‑)
Не буду тянуть, вот список
Комментарии, в основном, автора статьи, цитаты — участников опроса. В скобках — количество упоминаний.
айтишечка (2) — никакого уважения к нашей IT‑сфере!
айтишник (5) — а это мы как‑то расспрашивали в отдельном порядке, вроде большинству нормально, но кто‑то и обижается
андрюша (2) — Android. И правда, так себе звучит
апи, апишка (2) — вместо Эй‑Пи‑Ай (API)
бага (3) — ну «баг» же, что за неоправданные феминитивы
жаба (2) — Java, но тоже душит
закостылил (2) — залил на прод код со странной логикой и опасными временными решениями, обычно закостыливается навеки
интервью, интервьюер (3) — «ты чего помылся, интервью брать будут?»
история (3) — в контексте IT и правда звучит не очень
кейс (3) — к истории его, в кейс чемодан
кресты (3) — С++ (кто‑то видит плюсы там, где остальные видят только кресты)
лайвкодинг (2) — да и занятие странное
мускуль (3) — MySQL, уважительнее, плиз
постгря (2) — тут аж целую статью написали, не до шуток!
пых пых, пыха (3) — любимый всеми PHP
рефактОринг (2) — говорите правильно
ручка (5) — топовый триггер гнева. Он же API endpoint. Употребляется в российских компаниях исключительно.
уметь в... (6) — адский лидер, который достал всё IT
яваскрипт (он вам не остров, не мотоцикл, не принцесса!)
Пишите в коменты ваши "любимые" словечки.
👉 @seniorFront
Автор статьи провел опрос и узнал, какие слова, словечки и высказывания раздражают IT‑специалистов. Среди ответов есть неожиданные, но лидер вряд ли кого‑то удивит. Как к этому всему относиться? Как к профессиональному жаргону, который есть в каждой специальности. Обычного человека, скорее всего, покоробят профессионализмы юристов и врачей, но для нас всех короткое и ёмкое слово — формулировка короткой и точной мысли. По крайней мере, очень хочется так думать;‑)
Не буду тянуть, вот список
Комментарии, в основном, автора статьи, цитаты — участников опроса. В скобках — количество упоминаний.
айтишечка (2) — никакого уважения к нашей IT‑сфере!
айтишник (5) — а это мы как‑то расспрашивали в отдельном порядке, вроде большинству нормально, но кто‑то и обижается
андрюша (2) — Android. И правда, так себе звучит
апи, апишка (2) — вместо Эй‑Пи‑Ай (API)
бага (3) — ну «баг» же, что за неоправданные феминитивы
жаба (2) — Java, но тоже душит
закостылил (2) — залил на прод код со странной логикой и опасными временными решениями, обычно закостыливается навеки
интервью, интервьюер (3) — «ты чего помылся, интервью брать будут?»
история (3) — в контексте IT и правда звучит не очень
кейс (3) — к истории его, в кейс чемодан
кресты (3) — С++ (кто‑то видит плюсы там, где остальные видят только кресты)
лайвкодинг (2) — да и занятие странное
мускуль (3) — MySQL, уважительнее, плиз
постгря (2) — тут аж целую статью написали, не до шуток!
пых пых, пыха (3) — любимый всеми PHP
рефактОринг (2) — говорите правильно
ручка (5) — топовый триггер гнева. Он же API endpoint. Употребляется в российских компаниях исключительно.
уметь в... (6) — адский лидер, который достал всё IT
яваскрипт (он вам не остров, не мотоцикл, не принцесса!)
Пишите в коменты ваши "любимые" словечки.
👉 @seniorFront
Callback-функции
Многие избегают callback-функций (функции обратного вызова). А зря — ведь это довольно просто! В примере на картинке
Original post link: t.me/senior_front/1923
Forwarded and filtered by @smartfeed_bot
Многие избегают callback-функций (функции обратного вызова). А зря — ведь это довольно просто! В примере на картинке
console.log() будет передан в myFunc() в качестве callback-функции.Original post link: t.me/senior_front/1923
Forwarded and filtered by @smartfeed_bot
«Как я случайно превратила свой сокращатель ссылок в приманку для мошенников?»
Автор статьи запустила собственный навороченный сокращатель для ссылок. Она разработала лучший в своём роде сокращатель со всеми возможными примочками, начиная с обширной кастомизации и заканчивая хорошей аналитикой трафика. И сделала доступ бесплатным и неограниченным, опираясь на принцип: «бесплатность — лучшая маркетинговая стратегия».
Но с первого же дня ресурс облюбовали мошенники. Как так получилось и что делать, чтобы не допустить такого у себя на проекте — читайте в статье: https://habr.com/ru/companies/ruvds/articles/798649/
@tproger_web #безопасность
Original post link: t.me/tproger_web/4459
Forwarded and filtered by @smartfeed_bot
Автор статьи запустила собственный навороченный сокращатель для ссылок. Она разработала лучший в своём роде сокращатель со всеми возможными примочками, начиная с обширной кастомизации и заканчивая хорошей аналитикой трафика. И сделала доступ бесплатным и неограниченным, опираясь на принцип: «бесплатность — лучшая маркетинговая стратегия».
Но с первого же дня ресурс облюбовали мошенники. Как так получилось и что делать, чтобы не допустить такого у себя на проекте — читайте в статье: https://habr.com/ru/companies/ruvds/articles/798649/
@tproger_web #безопасность
Original post link: t.me/tproger_web/4459
Forwarded and filtered by @smartfeed_bot
🙂↕️ref vs shallowRef
В этой статье вы узнаете о различиях между ref и shallowRef в VueJS, их использовании и примерах применения в различных сценариях разработки.
Читать...
Original post link: t.me/frontendnoteschannel/3431
Forwarded and filtered by @smartfeed_bot
В этой статье вы узнаете о различиях между ref и shallowRef в VueJS, их использовании и примерах применения в различных сценариях разработки.
Читать...
Original post link: t.me/frontendnoteschannel/3431
Forwarded and filtered by @smartfeed_bot
#вопросы_с_собеседований
Как бы Вы реализовали метод Array.prototype .map?
Метод map создает новый массив с результатом вызова указанной функции для каждого элемента массива.
Original post link: t.me/senior_front/1925
Forwarded and filtered by @smartfeed_bot
Как бы Вы реализовали метод Array.prototype .map?
Метод map создает новый массив с результатом вызова указанной функции для каждого элемента массива.
Original post link: t.me/senior_front/1925
Forwarded and filtered by @smartfeed_bot
Forwarded from Senior Frontend - javascript, html, css
С какими проблемами можно столкнуться тимлид?
Лучше еще на старте знать, от чего выгорают тимлиды, чтобы распознать тревожные звоночки.
Непонимание со стороны бизнеса
Это самая распространенная проблема, когда ты из месяца в месяц пытаешься достучаться до руководства, приходишь со своими проблемами и готовым решением, но наверху лишь заносят проблему в бэклог, и ничего не происходит. Причин может быть несколько. Первая — ты говоришь с бизнесом не на том языке, и стоит изменить подход. Вторая — твой начальник «знает все лучше всех» и продолжает сражаться с ветряными мельницами. В таком случае лучшим решением будет сменить компанию.
Нехватка ресурсов
Простой пример:— твою команду постоянно заваливают задачами, и рук уже не хватает. В малом и среднем бизнесе может просто не быть денег, чтобы нанять новых сотрудников. В таком случае можно взять на себя дополнительную роль, например роль системного аналитика, и заняться описанием задач, чтобы работа двигалась быстрее. В крупных компаниях деньги, скорее всего, есть, но цепочка принятия решения слишком длинная, и нет никакой гарантии, что между начальниками третьего и четвертого звена не пробежала кошка и процесс из-за этого не застопорится. Здесь можно лишь попытаться перетянуть кого-то из высшего руководства на свою сторону или просто ждать.
Не видно результатов работы
Бывает, приходишь в компанию, разрабатываешь стратегию, строишь планы, горишь работой, но время идет, а ничего не меняется. Здесь недолго и приуныть: «Да кому все это нужно». В таком случае можно провести ретроспективный анализ, чтобы понять, почему проект не развивается. Спросить себя: «Может, я не туда бью, не те проблемы решаю?»
Отсутствие инструментов для достижения цели
Так бывает, когда тебя поставили на руководящую должность, наградили ответственностью, а рычагов управления не дали. Например, нет возможности самостоятельно проводить собеседования и набирать разработчиков к себе в команду. Здесь варианта всего два: либо пытаться достучаться до бизнеса и обозначить свою позицию, либо менять компанию.
Доступ к бизнесу
Чтобы развивать продукт и решать текущие проблемы команды, тимлид должен быть в постоянном контакте с лицами, принимающими решения. Если доступ к «верхушке» закрыт, проблемы так и останутся нерешенными, перспективные стратегии развития — неозвученными, и мотивация работать потеряется. Чтобы не выгореть, лучше сменить компанию, если наладить отношения с руководством не выходит.
Перманентный режим аврала
Иногда задач сыплется слишком много, и команда уже не справляется со входящим потоком. В ситуации постоянного аврала регулярные созвоны отходят на второй план — кому нужны мемы и пустой треп, когда этот час можно потратить на устранение багов. В итоге вся команда превращается в загнанную лошадь, которая рано или поздно выдохнется, и люди начнут уходить. Все, что может сделать тимлид, — попытаться выбить расширение штата или поставить задачи в очередь.
Плохая атмосфера в команде
Такое может случиться, если ты пришел в уже сложившуюся команду, где все друг друга ненавидят. В коллективе уже укоренился токсичный стиль общения, и ни о какой взаимопомощи речи не идет. Тогда единственное, что можно сделать, — расформировать всю команду и набрать заново.
Какой бы ни была проблема, всегда есть шанс на благоприятный исход. Не стоит сдаваться после первой же неудачи. Возможно, стоит немного подождать или сменить подход. Но если все перепробовал, а ощущение такое, будто стучишься в глухую стену, то решение уйти будет единственно верным.
Заключение
Умение решать проблемы — важное качество тимлида. Но получается, увы, не всегда. Но если чувствуете, что уже год или два топчетесь на месте и никак не можете на это повлиять, а расти хочется, сменить компанию — неплохая идея. Не стоит бояться перемен. Менять работу — это нормально.
👉 @seniorFront
Лучше еще на старте знать, от чего выгорают тимлиды, чтобы распознать тревожные звоночки.
Непонимание со стороны бизнеса
Это самая распространенная проблема, когда ты из месяца в месяц пытаешься достучаться до руководства, приходишь со своими проблемами и готовым решением, но наверху лишь заносят проблему в бэклог, и ничего не происходит. Причин может быть несколько. Первая — ты говоришь с бизнесом не на том языке, и стоит изменить подход. Вторая — твой начальник «знает все лучше всех» и продолжает сражаться с ветряными мельницами. В таком случае лучшим решением будет сменить компанию.
Нехватка ресурсов
Простой пример:— твою команду постоянно заваливают задачами, и рук уже не хватает. В малом и среднем бизнесе может просто не быть денег, чтобы нанять новых сотрудников. В таком случае можно взять на себя дополнительную роль, например роль системного аналитика, и заняться описанием задач, чтобы работа двигалась быстрее. В крупных компаниях деньги, скорее всего, есть, но цепочка принятия решения слишком длинная, и нет никакой гарантии, что между начальниками третьего и четвертого звена не пробежала кошка и процесс из-за этого не застопорится. Здесь можно лишь попытаться перетянуть кого-то из высшего руководства на свою сторону или просто ждать.
Не видно результатов работы
Бывает, приходишь в компанию, разрабатываешь стратегию, строишь планы, горишь работой, но время идет, а ничего не меняется. Здесь недолго и приуныть: «Да кому все это нужно». В таком случае можно провести ретроспективный анализ, чтобы понять, почему проект не развивается. Спросить себя: «Может, я не туда бью, не те проблемы решаю?»
Отсутствие инструментов для достижения цели
Так бывает, когда тебя поставили на руководящую должность, наградили ответственностью, а рычагов управления не дали. Например, нет возможности самостоятельно проводить собеседования и набирать разработчиков к себе в команду. Здесь варианта всего два: либо пытаться достучаться до бизнеса и обозначить свою позицию, либо менять компанию.
Доступ к бизнесу
Чтобы развивать продукт и решать текущие проблемы команды, тимлид должен быть в постоянном контакте с лицами, принимающими решения. Если доступ к «верхушке» закрыт, проблемы так и останутся нерешенными, перспективные стратегии развития — неозвученными, и мотивация работать потеряется. Чтобы не выгореть, лучше сменить компанию, если наладить отношения с руководством не выходит.
Перманентный режим аврала
Иногда задач сыплется слишком много, и команда уже не справляется со входящим потоком. В ситуации постоянного аврала регулярные созвоны отходят на второй план — кому нужны мемы и пустой треп, когда этот час можно потратить на устранение багов. В итоге вся команда превращается в загнанную лошадь, которая рано или поздно выдохнется, и люди начнут уходить. Все, что может сделать тимлид, — попытаться выбить расширение штата или поставить задачи в очередь.
Плохая атмосфера в команде
Такое может случиться, если ты пришел в уже сложившуюся команду, где все друг друга ненавидят. В коллективе уже укоренился токсичный стиль общения, и ни о какой взаимопомощи речи не идет. Тогда единственное, что можно сделать, — расформировать всю команду и набрать заново.
Какой бы ни была проблема, всегда есть шанс на благоприятный исход. Не стоит сдаваться после первой же неудачи. Возможно, стоит немного подождать или сменить подход. Но если все перепробовал, а ощущение такое, будто стучишься в глухую стену, то решение уйти будет единственно верным.
Заключение
Умение решать проблемы — важное качество тимлида. Но получается, увы, не всегда. Но если чувствуете, что уже год или два топчетесь на месте и никак не можете на это повлиять, а расти хочется, сменить компанию — неплохая идея. Не стоит бояться перемен. Менять работу — это нормально.
👉 @seniorFront
This media is not supported in your browser
VIEW IN TELEGRAM
💾 Masked Circle Slider – слайдер с маской в виде окружности с текущей фотографией. Чтобы перелистнуть страницу, нужно перетащить ее вправо или влево.
Сайтодел | #сниппет #css
Original post link: t.me/sitodel/1703
Forwarded and filtered by @smartfeed_bot
Сайтодел | #сниппет #css
Original post link: t.me/sitodel/1703
Forwarded and filtered by @smartfeed_bot
📇Воплощённые типы
В этой статье вы узнаете о подходе к определению типов под названием "Embodied types", который позволяет сделать код более понятным и чистым.
Читать...
Original post link: t.me/frontendnoteschannel/3432
Forwarded and filtered by @smartfeed_bot
В этой статье вы узнаете о подходе к определению типов под названием "Embodied types", который позволяет сделать код более понятным и чистым.
Читать...
Original post link: t.me/frontendnoteschannel/3432
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
Circular Mask
Переходы созданы при помощи CSS mask-image и mask-position. Плавность достигается благодаря CSS transition.
👉 @seniorFront
Original post link: t.me/seniorFront/3928
Forwarded and filtered by @smartfeed_bot
Переходы созданы при помощи CSS mask-image и mask-position. Плавность достигается благодаря CSS transition.
👉 @seniorFront
Original post link: t.me/seniorFront/3928
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
— Насколько хорошо вы умеете работать с CSS?
— Настолько, что рисую на CSS картины.
— Что?
— Что?
Целый аккаунт с похожими работами: https://twitter.com/asyrafhussin4
#css @tproger_web
Original post link: t.me/tproger_web/4460
Forwarded and filtered by @smartfeed_bot
— Настолько, что рисую на CSS картины.
— Что?
— Что?
Целый аккаунт с похожими работами: https://twitter.com/asyrafhussin4
#css @tproger_web
Original post link: t.me/tproger_web/4460
Forwarded and filtered by @smartfeed_bot
🫣INP: что это и зачем с этим работать
В этой статье я расскажу, что такое INP и как работать с новой метрикой.
Читать...
Original post link: t.me/frontendnoteschannel/3434
Forwarded and filtered by @smartfeed_bot
В этой статье я расскажу, что такое INP и как работать с новой метрикой.
Читать...
Original post link: t.me/frontendnoteschannel/3434
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
Sunrise over still lake
Восход солнца, выполненный с помощью SCSS, без использования JavaScript
https://codepen.io/pehaa/pen/yLVeLNg
Original post link: t.me/senior_front/1926
Forwarded and filtered by @smartfeed_bot
Восход солнца, выполненный с помощью SCSS, без использования JavaScript
https://codepen.io/pehaa/pen/yLVeLNg
Original post link: t.me/senior_front/1926
Forwarded and filtered by @smartfeed_bot
🐙 Awesome Design Patterns – список паттернов проектирования для разных языков программирования и фреймворков, а также советы по работе с облачной архитектурой и микросервисами.
Сайтодел | #репозиторий #github
Original post link: t.me/sitodel/1704
Forwarded and filtered by @smartfeed_bot
Сайтодел | #репозиторий #github
Original post link: t.me/sitodel/1704
Forwarded and filtered by @smartfeed_bot