Объяснение:

В отличие от классовых компонентов в React, у функциональных компонентов нет состояния и методов жизненного цикла. Для имитации componentDidMount, componentDidUpdate и componentWillUnmount понадобится специальный хук useEffect. Он позволит нам добавлять эффекты: например, запрос к серверу или обновление компонента.

Мы передаём два аргумента, когда используем useEffect. Первый — это функция, которая выполнит нужные нам эффекты. Второй аргумент необязательный — это массив зависимостей. Может быть три варианта использования второго аргумента: не указан вовсе, указан пустой массив или в массиве что-то есть.

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

Если в качестве второго аргумента мы передаём пустой массив, то компонент отрисуется один раз.

Если в массиве что-то есть, начинается самое интересное. При первой отрисовке компонента функция из первого аргумента всегда выполняется. При последующих отрисовках React сравнивает значения массива зависимостей (второй аргумент) с предыдущими значениями. Если они отличаются, React вызывает функцию. Если значения не изменились, React оптимизирует и пропускает выполнение функции.

Хочешь в айти, но пока ничего не умеешь? Мы покажем тебе, как стать программистом через фронтенд-разработку 👌

9 и 10 сентября пройдёт двухдневный интенсив от SaintCode Bootcamp — демо-версия основного курса. На этом интенсиве ты будешь учиться основам фронтенд-разработки с 12 до 19 часов, как в буткемпе. Если ты в Петербурге, приходи в офлайн-буткемп на Колокольной, если в другом городе — подключайся к группе онлайн через Discord.

Для интенсива мы выбрали метод обратной разработки — такой подход позволяет усвоить базовые знания даже абсолютным новичкам.

Пока мы тестируем формат, действуют скидки: один день интенсива стоит 2 000 руб., два дня — 3 000 руб. Следующие интенсивы будут дороже — 3 800 руб. за один день и 5 700 руб. за два 📈

Переходи по ссылке, чтобы посмотреть полную программу интенсива и забронировать место в группе — https://saintcode.ru/intensive?utm_source=telegram_direct&utm_medium=post&utm_campaign=organic_social&utm_content=intensive91009

Мест осталось не так много 😉

Программа двухдневного интенсива от SaintCode Bootcamp
9 и 10 сентября:

1️⃣ день. Основы вёрстки HTML/CSS — ты получишь необходимый минимум теории и макет простого сайта с героями «Гарри Поттера». Затем вместе с наставником разберёшь, как он свёрстан. Домашним заданием будет повторить проект, но уже самостоятельно.

2️⃣ день. Введение в язык программирования JavaScript — необходимый минимум теории и тот же макет, что и в первый день. Только теперь вместе с наставником ты разберёшься, как добавить к вёрстке кнопки с фильтрами на JS. Домашним заданием будет сделать свои фильтры в этом проекте.

Будем использовать метод обратной разработки — ты получаешь уже готовый код и разбираешь его на составляющие вместе с преподавателем.

До интенсива остается один день! 🔥

Подробно что ждёт на первом дне - смотри в видео ⬆️

Переходи по ссылке, чтобы посмотреть полную программу интенсива и забронировать место в группе — https://saintcode.ru/intensive?utm_source=telegram_direct&utm_medium=post&utm_campaign=organic_social&utm_content=intensive91009

А как выглядит твой профиль GitHub? 😏

Конечно, на картинке мы шутим — пусть эйчар и клюнет на количество, зато тимлид точно проверит качество твоего кода 💯

⚡️ Ждём тебя на бесплатном вебинаре «Как выучиться на программиста, которого берут на работу?» — он пройдёт 26 сентября в 19:00 МСК ⚡️

Главное в обучении программированию — дойти до этапа, когда тебе платят деньги за код 💯

Но как учиться с фокусом на трудоустройство? Об этом поговорим с основателем SaintCode Bootcamp и карьерным консультантом Женей Гриценко.

В гостях у Жени трое выпускников SaintCode. Все они пробовали кодить сами, но только после буткемпа смогли устроиться на первую работу в IT.

😇 Даша Сыпкова работала в сфере внешнеэкономической деятельности, но хотела в айти. Начала с самостоятельного изучения Java, потом остановилась на фронтенде и знакомилась с HTML/CSS/JS. Тут Даша поняла, что потратила много времени на самообучение, а результата всё нет — и пришла в буткемп. После выпуска она несколько месяцев преподавала JS у нас, потом получила оффер в компанию Kraud и устроилась туда фронтенд-разработчицей.

😇 Дима Катков работал в крупных банках на должностях, связанных с аналитикой. Задумался о программировании в 2015 году, но совмещать обучение с основной работой не получилось. В прошлом году Дима поставил цель — перейти в айти за год. После выпуска из буткемпа работает фронтендером в веб-студии Kojo.

😇 Даниил Семёнов учился в техническом ВУЗе и кодил сам, но не был готов к поискам работы. В буткемп пошёл, чтобы видеть ежедневные результаты обучения и получить навыки для коммерческой разработки. После буткемпа Даниил выложил резюме на HeadHunter и забыл про него на полгода. Через полгода с ним связалась компания и предложила место — теперь он фронтенд-разработчик в Studwork.

На вебинаре ребята поделятся своими историями и полезным опытом — как новичку в программировании учиться так, чтобы устроиться на первую работу. Приходи с вопросами, на все ответим и подскажем, в чём может быть проблема и в каком направлении двигаться.

👉 Вторник, 26.09. 19:00 МСК. Участие бесплатное, регистрируйся на сайте — https://saintcode.ru/webinar?utm_source=telegram_direct&utm_medium=post&utm_campaign=organic_social&utm_content=webinar2609 👈

Метод push в JavaScript — как работает и что возвращает? 📥

Вот несложная задачка. У нас есть массив frontend с тремя элементами базовых навыков для веб-разработчика клиентской стороны: строками HTML, CSS и JS.

Присвоим значение frontend новой переменной frontendAdvanced и добавим строку React с помощью метода push. Какую длину массива frontend вернёт всплывающее окно?

Попробуй написать объяснение своими словами в комментариях — все ответы посмотрит наш преподаватель, прокомментирует и выберет самое сильное. Своё объяснение мы пока не выкладываем, чтобы было интереснее 🙂

Ребята, большое спасибо всем, кто предложил свою версию объяснения вчерашней задачи. Вы молодцы и нормально так шарите 😉

Вот наше объяснение, его тоже можно обсудить и покритиковать:

Метод push() добавляет элементы в конец массива и возвращает новую длину массива. Но в задаче мы применяем метод ко второму массиву frontendAdvanced, а запрашиваем длину первого массива frontend. Почему длина frontend — не 3?

Во второй строчке кода мы присвоили frontendAdvanced значение frontend — это значит, что изменение одного массива приведёт к изменению другого. Поэтому после push() оба массива будут выглядеть как ["HTML", "CSS", "JS", "React"], а длина каждого из них будет равна 4. Это и есть правильный ответ.

Когда на собеседовании задали вопрос про Event Loop, а ты такой: «нуу-у, там асинхрон, бульк, вот это вот всё» 🤦‍♂️

Конечно, провальные собесы новичку тоже полезны. Но можно сильно сократить их количество, если сразу учиться с фокусом на трудоустройство 🙌

Как стать программистом, которого берут на работу? Об этом поговорим на бесплатном вебинаре 26 сентября, в 19:00 МСК.

💥 Смотри подробности и регистрируйся на событие на нашем сайте, будет интересно и полезно 💥