Співбесіда в Українську Компанію Junior Frontend ( JavaScript ) | React + Redux

Поделиться
HTML-код
  • Опубликовано: 28 май 2024
  • Підтримати канал та отримати доступ до ексклюзивних відео можна тут (Patreon) 👇
    / sniedaprogrammer
    Зміст:
    00:00 - Дисклеймери
    00:14 - Початок співбесіди
    01:46 - Про проекти (проект)
    03:20 - Що використовуєш про верстці ? flexbox vs float vs grid
    04:35 - Що таке БЕМ ? (верстка)
    05:57 - Які знаєш семантичні теги ? (верстка)
    06:15 - Як відцентрувати елемент (всі способи) ? (верстка)
    07:03 - Всі значення для властивості position ? (верстка | html + css)
    07:21 - Як зробити кастомний checkbox ? (верстка)
    08:42 - Як працює fr в css grid ? (верстка | css)
    09:30 - Що таке SCSS ? (верстка)
    10:35 - Яка різниця між var, let та const ? ( JavaScript )
    10:35 - Яка різниця між var, let та const ? ( JavaScript )
    11:39 - Яка область видимості у let та const ? ( JavaScript )
    12:17 - Чим відрізняється строге порівняння від не строгого ? ( JavaScript )
    13:05 - Який тип порівняння працює швидше ? ( JavaScript )
    13:19 - Чим відрізняється slice від splice ? ( JavaScript )
    13:19 - Чим відрізняється slice від splice ? ( JavaScript )
    13:59 - Як скопіювати об'єкт ? ( JavaScript | object )
    15:20 - Як працює e.preventDefault ? ( JavaScript )
    15:48 - Чим відрізняються стрілочні функції від звичайних ? ( JavaScript )
    16:35 - Які способи роботи з асинхрогим кодом ? ( JavaScript )
    16:46 - Що таке promise ? ( JavaScript )
    17:45 - Що таке async await ? ( JavaScript )
    18:34 - Що таке hoisting ? ( JavaScript )
    18:34 - Як можна самостійно створити помилку ? ( JavaScript ) (throw new Error)
    20:18 - Які способи зберігання інформації на frontend ? ( JavaScript )
    20:50 - Типи http запитів ( Frontend )
    21:03 - В чому різниця між post та put ? ( Frontend )
    21:14 - В чому різниця між put та patch запитами ? ( frontend )
    21:38 - Life cycle methods ? ( frontend )
    21:59 - Чи можемо змінити props в React ? ( React js )
    22:20 - Які знаєш хуки (hooks) ? ( React js )
    22:45 - Як працює useEffect ? ( React js )
    23:08 - Коли потрібен componentWillUnmount ? ( React js )
    24:00 - Для чого потрібен хук useContext ? ( React js )
    25:30 - Що таке React.memo ? ( React js )
    25:54 - Чи можна відмовитися від redux використовуючи useContext ? ( React js )
    26:48 - Як працює Redux ? ( redux )
    28:02 - Коли можемо використовувати useState замість redux ? ( redux )
    29:09 - Для чого потрібен redux-thunk ? ( redux )
    29:42 - Чи працював з redux-saga ? ( redux )
    29:55 - Чи працював з redux-toolkit ? ( redux )
    30:04 - Переваги redux-toolkit над redux? ( redux )
    31:26 - slice vs reducer ? ( redux )
    32:09 - Як можна обробити зміну даних input ? ( react )
    32:35 - Для чого хук useRef ? ( react )
    32:50 - Різниця між useState та useRef ? ( react )
    33:20 - Ти працював з typescript ? ( react )
    33:30 - Різниця між type та interface ? ( typescript )
    34:32 - Як типізуєш redux? ( typescript | redux )
    34:55 - Доводилося використовувати Next js ? ( Next js )
    35:09 - Що таке Next js ? ( Next js )
    35:55 - Для чого key в React js ? ( React js )
    36:52 - Чим відрізняється git rebase від git merge ? ( github )
    37:38 - Як можна перенести коміт в іншу гілку ? ( github )
    38:43 - Що таке функція вищого порядку ? ( JavaScript )
    39:00 - Що таке чиста функція ? ( JavaScript )
    39:20 - jQuery ? ( JavaScript )
    40:00 - ДВІ ПРАКТИЧНІ ЗАДАЧІ ( JavaScript )
    46:33 - Фідбек
    ----------------------------
    Мій інстаграм для розробників:
    / snieda_programmer
    Телеграм канал ( фідбек ) :
    t.me/sniedaweb_ukr
    Група телеграм:
    t.me/programmersfromheaven
    Автор коду на фоні:
    @Давай Попробуем: JavaScript
    ----------------------------
    • Дане відео підійде всім, хто вивчає Html, Css, JavaScript або React js
    • Для джунів (junior)
    • Для мідлів (middle)
    Дякую за перегляд ! 🙏🤗
    #javascript #react #співбесіда
  • Авто/МотоАвто/Мото

Комментарии • 137

  • @user-eg2iw2iv2i
    @user-eg2iw2iv2i Год назад +145

    Ще до прегляду напишу подяку, за розвиток українського IT контенту✊💥

    • @snieda_programming
      @snieda_programming  Год назад +2

      Дякую 🙏🔥

    • @user-uw4kz5fu3f
      @user-uw4kz5fu3f Год назад

      Привіт Ігоре, я буду як типовий наглий коментатор і запрошу тебе зацінити і мій канал українською :)

  • @user-wx5pn7th8j
    @user-wx5pn7th8j 5 месяцев назад +2

    мій варіант завдання про flatten array . в даному випадку, працює з будь яким рівнем вкладеності
    function makeFlattenArr(arr){
    let res = []
    arr.forEach((el)=>{
    if(el instanceof Array){
    res.push(...makeFlattenArr(el))
    }else {
    res.push(el)
    }
    })
    return res
    }

  • @weukrainians1744
    @weukrainians1744 Год назад +23

    Дякую, крутий відос! Український контент росте та розвивається!

  • @Voterite
    @Voterite Год назад +7

    Дуже круто , що одразу показуєш приклади.

  • @stepanrudiak95
    @stepanrudiak95 Год назад +14

    Круто, дуже дякую за подібний контент

  • @Alex0680
    @Alex0680 Год назад +1

    Огромное спасибо вам за классный контент!

  • @romanprokopets3693
    @romanprokopets3693 Год назад +13

    крутий контент, особливо хочеться відмітити вставки з кодом під час відповіді, дякую!

  • @nicholaskaradzha2798
    @nicholaskaradzha2798 Год назад

    Як завжди - чудовий контент. Дякую за якість.))

  • @shortMovieforEveryBody
    @shortMovieforEveryBody Год назад +19

    Контент супер, насправді, окремо вдячність за розвиток українського контенту.
    В подальшому, якщо це можливо, спробуй сам, як варіант, проводити співбесіди з підписниками)

  • @nazariikarpa7569
    @nazariikarpa7569 Год назад +4

    Дякую за український IT-контент!

  • @dmitry_beresten
    @dmitry_beresten Год назад +1

    Дякую за корисне відео!

  • @antonlazurko8999
    @antonlazurko8999 Год назад +9

    Useful content. Thanks mate! like+comment)))

  • @paliushentsia1651
    @paliushentsia1651 Год назад

    Дякую. Дуже інформативно. Такі речі якісно "чикають" страх співбесіди😁👍

  • @Max-tk8ol
    @Max-tk8ol Год назад +7

    Єєєєє, нова співбесіда, дякую!

  • @oleksanya
    @oleksanya Год назад

    Дякую, крутецький контент!

  • @rapsodden
    @rapsodden Год назад +1

    Окрема подяка за вивід правильних відповідей!

  • @Anton-hg2wv
    @Anton-hg2wv Год назад

    Дуже дякую за такий контент

  • @ex-zalt4582
    @ex-zalt4582 Год назад

    Дякую за український контент! Однозначно лайк і коментарій)

  • @IT_Pastor
    @IT_Pastor Год назад +2

    Дякую за корисний відос!

  • @wickedcode6338
    @wickedcode6338 Год назад

    Дякую за відео!

  • @BMikel
    @BMikel Год назад +4

    Це неймовірно круто що такий контент зявляється українською мовою. Ви неймовірні, дякую!

  • @scarboro3689
    @scarboro3689 Год назад

    Дякую за україномовний контент!)

  • @mykhailobryndzak
    @mykhailobryndzak Год назад +1

    Дякую, робіть ще)

  • @MakcKipelov
    @MakcKipelov Год назад +1

    подивився перше відео, і теж напишу одразу подяку за наш контент. Дуже приємно, сподіваюсь на продовження

  • @maksym.pryhoda
    @maksym.pryhoda Год назад +1

    Дивлюсь з цікавістю, приклади для закріплення питань взагалі бомба

  • @jamesbondinc6842
    @jamesbondinc6842 Год назад +2

    Чувак, ти крутий, десь я доповнював твої відповіді, десь дізнавався нове. Продовжуй в тому дусі!

  • @usergmail3091
    @usergmail3091 Год назад

    Дякую за україномовний контент!

  • @user-bb2ee7ds9u
    @user-bb2ee7ds9u Год назад

    Дуже гарний українській контент. Займаєте узьку нішу :)

  • @resoursa
    @resoursa Год назад

    Дякую друже!

  • @vasya8441
    @vasya8441 Год назад

    Дякую за вiдео,

  • @eugenbeetl9751
    @eugenbeetl9751 Год назад

    Красний інтерв'юєр :)
    А ти дуже добре відповідав, здається ти не джун)

  • @user-jt7wb3zc1m
    @user-jt7wb3zc1m Год назад

    Дякую! Дуже актуально! Як раз буду шукати роботу щоб свічнутись у фронтенд. Сподіваюсь відео стане у нагоді :)

    • @zefffirka8963
      @zefffirka8963 3 месяца назад +1

      Як успіхи рік потому?)

    • @user-jt7wb3zc1m
      @user-jt7wb3zc1m 3 месяца назад

      ​ @zefffirka8963 Вітаю! Дякую що спитали :) Ситуація "все добреЄ та одночасно "все складно", ггг. Працюю, через деякі обставини не в компанії а на фрілансі, скоріше "fullstack" ніж фронт. Переважно Wordpress бо достатньо замовлень, сегмент вище середнього, уникаю Elementor & Co. Параллельно проходив безкоштовні курси frontend на RollingScopes EN та по nodejs, але зараз привалило замовленнями тому на жаль навчання довелось поки засаспендити, що трохи засмучує бо бек на ноді пішов як діти у школу, цікаво. Коротше таке собі. Сподіваюсь в вас успіхі краще :)

  • @FrendIgor
    @FrendIgor Год назад +2

    Як багато треба знати на джуна ;) Дякую за українську!

    • @MrSvitS1337
      @MrSvitS1337 Год назад

      Насправді це тільки на співбесідах так, тут інтерв'юер не дуже попався

  • @vasyok92
    @vasyok92 Год назад

    Дуже гарно)

  • @ky3ow
    @ky3ow Год назад +3

    Для копії об'єкту можна використовувати spread operator(ES6)
    const obj = { a: 1 };
    const objCopy = { ...obj };

  • @Den-ig5bs
    @Den-ig5bs Год назад

    топ!
    Молодці!

  • @OriGami145
    @OriGami145 Год назад +19

    Ти вже ці запитання на пам‘ять знаєш)) крутий контент, дуже корисно для новачків, дякую 🙏
    А ти не думав сам проводити співбесіди для своїх підписників, і в кінці давати якийсь фідбек?)

  • @ichwill421
    @ichwill421 Год назад

    Дякую!

  • @user-qs7st3sw8c
    @user-qs7st3sw8c Год назад

    Крутяк!)

  • @vladyslavsosnov8412
    @vladyslavsosnov8412 Год назад +1

    Круто. За українську окремий респект!

  • @oksanakukhotska7190
    @oksanakukhotska7190 Год назад

    Thanks!

  • @volodymyrpalamar5515
    @volodymyrpalamar5515 Год назад

    Вподобайка за Українську 👍

  • @andriykhomik1898
    @andriykhomik1898 Год назад

    Дякую за контент рідною мовою🇺🇦

  • @freepeopleworldtv6138
    @freepeopleworldtv6138 Год назад

    Я ще не працюю . Впринципі на всі знав відповідь . Якось так попало що питання були легкі для мене. Але вважаю що є питпння такі як алгоритми структури даних . Ооп методи тоді буде важче

  • @ruslanpostoiuk4963
    @ruslanpostoiuk4963 Год назад +1

    Кайф!

  • @jackyarrow471
    @jackyarrow471 Год назад

    відео афігезне, дякую тобі велике! допомогло відчути себе більш впевненим). Але я не розумію, чому не можна було скористатись методом flat(Infinity) в першій задачі, може я щось пропустив

  • @artillustrations5462
    @artillustrations5462 Год назад

    Дуже гарне інтерв'ю. Аж захотілось розвиватись як розробник. Але, на жаль, пальці болять, не можу на клавіатурі.

  • @SHMATUAN
    @SHMATUAN Год назад +2

    Це якось бiльше на спiвбесiду на мiдла схоже чим на джуна .-.

  • @kyrylostromelyuk9492
    @kyrylostromelyuk9492 Год назад

    Дякую Дякую

  • @GLBrand
    @GLBrand Год назад

    За відео дякую! Більше знімай, навіть фейкових співбесід. Завжди щось нове для себе відкриєш!
    За чекбокс би посперечався

  • @semx8372
    @semx8372 Год назад

    Єдиний канал де стоїть дзвіночок на нові відео

  • @biotopcrypto611
    @biotopcrypto611 Год назад

    ЛУЧШИЙ!! ТОП🇺🇦🇺🇦👊👊

  • @teothedoor
    @teothedoor 10 месяцев назад

    Дякую за таку корисну співбесіду :) Моє рішення останніх двох задачок:
    const flatten = (array) => {
    let r = [];
    for (let i = 0; i r.push(el));
    }
    }
    return r;
    }
    console.log(flatten([[1], [[2, 3]], [[[4]]]]))
    const removeDupes = str => [...new Set(str)].join('');
    console.log(removeDupes('abcd'))
    console.log(removeDupes("aabbccdd"));
    console.log(removeDupes("aaabccddddd"));
    console.log(removeDupes("abcd"));

    • @LHLetale
      @LHLetale 10 месяцев назад

      console.log([[1], [[2, 3]], [[[4]]]].flat(Infinity)); задача первая решается)

    • @teothedoor
      @teothedoor 10 месяцев назад

      @@LHLetale Не знав про Infinity, дякую )

  • @user-we4qr8nl9f
    @user-we4qr8nl9f Год назад

    Нарештіііі, я шукав українськомовну співбесіду

  • @Stas_Gutsal
    @Stas_Gutsal Год назад +8

    Дякую за відео. Скажи будь ласка, а ти плануєш записувати саме плейлистами відео уроки (як для навчання людей, які хочуть з нуля навчитися)? Було б дуже круто, якщо б в нас з'явився саме укроїномовний контент

    • @Max-tk8ol
      @Max-tk8ol Год назад

      Таке є у фрілансера по життю, але для різноманіття можна було б

    • @snieda_programming
      @snieda_programming  Год назад

      Часу бракує (

  • @stnnickk
    @stnnickk 11 месяцев назад

    Якщо про досвід спитають, можна про пет проекти сказати?

  • @zefris3169
    @zefris3169 Год назад

    14:50 ще можна копіювати об''єкти операцією spread

  • @andreyyatsenko1593
    @andreyyatsenko1593 Год назад

    задача на рекурсію остання? Бо не зовсім ще розумію, що таке рекусія, тільки почав вчитись

  • @danlep0352
    @danlep0352 Год назад +1

    дякую за контент українською!

  • @andrewpo16
    @andrewpo16 2 месяца назад

    bem by yandex?

  • @user-ep5yq8ek3e
    @user-ep5yq8ek3e Год назад

    Дуже круто!! Давай Українське!!!!!

  • @ihorzhuk4949
    @ihorzhuk4949 Год назад +1

    Привіт! В тебе ж будуть відеоролики по JS?) Дуже очікую!!

    • @snieda_programming
      @snieda_programming  Год назад

      Привіт. На жаль, не впевнений, швидше по React 🔥

    • @ihorzhuk4949
      @ihorzhuk4949 Год назад

      @@snieda_programming Дідь я в розпачі :) Підписався на твій patreon

    • @snieda_programming
      @snieda_programming  Год назад

      @@ihorzhuk4949 Помітив, Дуже дякую ! Причина чому я не хочу робити контент по js заключається в тому, що такого контенту ДУЖЕ багато. Я просто буду повторяти уже сказані слова іншими 😊

  • @user-jc4ys6nr3t
    @user-jc4ys6nr3t Год назад +4

    класно :)
    попробуй на мідла :))

  • @vponochovny
    @vponochovny Год назад

    18:05 - перед fetch не пишемо 'await' ?

    • @snieda_programming
      @snieda_programming  Год назад

      Так, мій косяк🤗

    • @vponochovny
      @vponochovny Год назад

      @@snieda_programming я засумнівався і написав) Дякую за такі відео, багато чого нового і структуровані, чіткі відповіді. *Очікували джуна, а тут на кожне питання є такі повні чіткі відповіді, оце вони в шоці))

  • @nanvlad
    @nanvlad Год назад +2

    Нафіга мені дивитися ціле відео, якщо можна одразу поставити лайк за українську і написати про це комент?

  • @weblance7333
    @weblance7333 Год назад

    питання та відповіді на мідла більше тягнуть, якщо це інтерв'ю справжнє

  • @YevheniiHloba
    @YevheniiHloba Год назад +1

    хороше інтерв'ю, я б сказав що можна Junior прибрати)

  • @AlexAlex-tb8ew
    @AlexAlex-tb8ew Год назад +2

    1k зелені зп? Чи варто взагалі знімати щось подібне з таким низьким зп? Я думаю тут є деяка доля непорозуміння, так як питання/відповіді тягнуть на набагато вищий рівень.

    • @user-td5bw9rt2g
      @user-td5bw9rt2g Год назад

      Це його не перша співбеседа, багато питань вже були.

  • @luckyperson3411
    @luckyperson3411 Год назад +1

    Скільки часу потрібно , щоб все це вивчити та успішно використовувати на практиці?

    • @snieda_programming
      @snieda_programming  Год назад +1

      Приблизно 1200 год. зосередженої робоьи

    • @luckyperson3411
      @luckyperson3411 Год назад +1

      @@snieda_programming В мене ціль вийти на фріланс та верстати шаблонні сторінки для початку, мені вистачить html , css, jquery ? Чи зразу вчити JavaScript? Дякую за відповіді!)

    • @snieda_programming
      @snieda_programming  Год назад

      @@luckyperson3411 без знань JavaScript - вчити JQuery немає сенсу

  • @mariia7044
    @mariia7044 Год назад

    Може я не вїхала але це дійсно фейкова співбесіда чи справжня?

  • @sellentis
    @sellentis Год назад

    зроби що небуть з мікро будь ласкаа, шоб такого фону не було 🙄а так топ контент)

  • @McScraych
    @McScraych Год назад

    А хлопця взяли чи ні?

  • @maxym922
    @maxym922 Год назад

    ajiliway?

  • @user-fz4le7ex3q
    @user-fz4le7ex3q Год назад

    Українська чудова

  • @user-uc9jo8jt5j
    @user-uc9jo8jt5j Год назад +1

    Відео чудове. Але є питання. Це імітація співбесіди - тобто вона є фейковою?

  • @m1nusasusplus897
    @m1nusasusplus897 Год назад

    І вінда на рузком, ну капєц

  • @nikola03077777777
    @nikola03077777777 Год назад

    нефіга не поняв але було цякаво

  • @nnazar836
    @nnazar836 Год назад +1

    Гарно б буоло подивитися відео де ти в ролі джуна без досвіду

  • @ilyasosnytskyi8241
    @ilyasosnytskyi8241 Год назад

    Неперевершено

  • @bodyamunssin8963
    @bodyamunssin8963 Год назад +1

    Загалом круто і корисно, але явно співбесіда є постановою)

  • @alexanderchumak1008
    @alexanderchumak1008 Год назад

    post, put - боже, как это развидеть.

  • @MrSvitS1337
    @MrSvitS1337 Год назад +1

    Я працюю на позиції junior більше року, вирішую складні задачі та беру велику відповідальність
    вмію працювати з складними графіками та впринцимі можу реалізувати любий челендж по фронту
    но варто мене запитати задачки на алгоритми, я без гугла не зроблю абсолютно нічого - немає сенсу запитувати алгоритми вони ітак на фронті не потрібні !!!
    Які нахрен масиви в масивах, якщо мені це віддасть бек, я його відправлю переробляти
    ніколи нічого подібного не буде в роботі - того що просять зробити на собесі, абсолютно НІКОЛИ!!!

    • @bogdan_888
      @bogdan_888 Год назад +3

      Так и есть, просто нужно знать два языка, - один для работы, другой чтобы лясы точить на собеседовании. Тоже долго не мог принять эту реальность

  • @user-jp4lw9qm1c
    @user-jp4lw9qm1c Год назад +1

    Круто в целом, правда вижу что вам немного сложно говорить на укр, но это пройдёт

  • @cseedrvr6627
    @cseedrvr6627 Год назад +1

    Задачку с массивами можно еще так решить:
    array.toString().split(',');

  • @user-sf4yh2st7o
    @user-sf4yh2st7o Год назад +1

    Ось мої варіанти вирішування задач, не судіть строго)))
    1)
    function flatten(arr) {
    arr.map((el, index) => {
    // typeof el == 'object Також можна використати в умові'
    if(Array.isArray(el)) arr.splice(index, 1, flatten(el))
    });
    return arr.flat();
    }
    console.log(flatten([[1], [[2, 3]], [[[4]]]]));
    2)
    function removeDupes(str) {
    return [...new Set(str.split(''))].join('');
    }
    function removeDupes(str) {
    let newStr = '',
    oldStr = str.split('').sort();
    oldStr.map((symbol, index) => {
    if(symbol != oldStr[index - 1]) newStr += symbol;
    })
    return newStr;
    }
    console.log(removeDupes('abdsd'));

    • @snieda_programming
      @snieda_programming  Год назад

      Дякую

    • @GLBrand
      @GLBrand Год назад

      [...new Set(str.split(''))].join('');
      можна без split. Зайва операція ;)

    • @user-sf4yh2st7o
      @user-sf4yh2st7o Год назад

      @@GLBrand , Круто (не знав), дякую!!!

  • @MrMomomoy
    @MrMomomoy Год назад

    цікавий відос, від себе додам, шо перша задачка вирішується в один рядок, array.flat(2) думаю, ти це знав, просто на співбесіді не зорієнтувався

    • @furidashidreamer
      @furidashidreamer Год назад

      Ага особенно когда у тебя входящий массив не известен, там же может быть любой уровень вложения

    • @MrMomomoy
      @MrMomomoy Год назад

      @@furidashidreamer тоді пишеш flat(infinity)

  • @alex_akuna
    @alex_akuna Год назад +1

    Первую задачку я чет так решил, про flat вообще забыл)
    const result = [];
    function func(arr) {
    for (let index = 0; index < arr.length; index++) {
    if (Array.isArray(arr[index])) {
    func(arr[index])
    } else {
    result.push(arr[index])
    }
    }
    }
    func([[[1]], [2,3], [[[4]]], 5, [6]])
    Вторая
    function uniqStr(str) {
    return [...new Set(str)].join('')
    }
    uniqStr("12322325677778880")

  • @IvanVasiunin
    @IvanVasiunin Год назад +1

    До цього відео я не знав про flat, але тепер здається що задачку з масивом можна було вирішити куди простіше, просто return array.flat(Infinity)