#1: React Hooks - useState

📢 Платный курс по ReactJS с наставником: mentor.archako...
❤️ Поддержка:
- Patreon: / archakovblog
- Донаты: www.donational...
📢 О чём я буду рассказывать?
Я решил сделать новый курс по React-хукам и рассказать подробно о том, как работает каждый хук. В данном видео, я рассказываю о хуке useState. Как он работает, зачем нужен и когда можно обойтись без него?
Это первое видео по хукам ReactJS. В следующих видео я расскажу про другие хуки.
❓ Кому подойдёт этот курс?
Для начинающих, которые только начали изучать ReactJS и для тех, кто изучает более 3-х месяцев.
На каждый хук, есть отдельная ветка в репозитории ниже. Просто кликаете по "Branch" и выбираете нужный хук.
Ссылка на GitHub: github.com/Arc...
🔗 Следите за обновлениями и информацией в:
- Telegram-канале: t.me/archakov_im
- VK: archako...
- Личном блоге: archakov.im
- GitHub: github.com/Arc...
- Моё резюме: career.habr.co...

[@MrBolodina]

Привет! Все правильно рассказал, но один нюанс, массив может быть константой в твоем случае, т.к. ты можешь выполнять разные функции над ним (push например) и он будет меняться, а вот переопределить массив ты не сможешь!

[@VolodymyrSirenko]

Очень толковое объяснение useState для начинающего! Спасибо!

[@dennisfisher2684]

Присоединяюсь ко всем спасибо в комментариях. Отдельное спасибо за светлую тему )) С телефона намного лучше воспринимается информация.

[@adeptusCustodius]

Супер! Самое толковое объяснение хуков в рускоязычном сегменте!!! Спасибо!

[@atakhanzhumadil8784]

где ты был год назад брооооооооу, это лучший туториал в инете

[@АлександрСмирнов-щ4с]

спасибо большое за доступное объяснение, заполнил свои пробелы.

[@lalathealter6513]

прекрасное объяснение. Любому новичку всё станет понятно

[@pettonjef3061]

Лучший урок по хукам что я видел. Спасибо большое. Продолжай в том же духе )

[@maximzalutskii1012]

it-kamasutra посмотри, всё поймешь

[@polinamueller8502]

Блин ты мой новый любимчик, красавчик, спасибо

[@vitalygaraev8093]

Спасибо! Очень ясное и подробное объяснение.

[@ЛиЛи-н8м]

я в шоке. самая доступная подача материла в мире!!!

[@Snegurjan]

Если мне бы так обьясняли в школе,я стал бы програмисстом в 12 лет.Спасибо бро!

[@forssety9]

Видел тебя в коментах "путь самурая", рад за тебя, выбрать ноут вместо кровати, чтобы учиться после работы это достойно уважения, рад что ты уже работаешь программистом, удачи стать Сеньором)

[@Snegurjan]

@@forssety9 благодарю. Удачи в твоём пути, пусть все получится 🤟🙏

[@forssety9]

@@Snegurjan спасибо!

[@Mike37373]

@@forssety9 что значит ноут вместо кровати

[@forssety9]

@@Mike37373 у него была возможность купить либо ноутбук, либо кровать, Он выбрал первое

[@inzoddex8312]

Лучший урок, спасибо большое!

[@michealmltefive5510]

14:50 key сравнивается не глобально, мы можем использовать одинаковые key в разных частях!

[@Shnolll]

отдельное спасибо за рекламу в самом конце

[@vasilkou73]

Спасибо огромное, очень доходчиво пояснил!

[@s9219871110]

Спасибо тебе большое за годнейший контент!

[@Mirrasim]

Spasibo za urok

[@flotskey9751]

Видос пушка, продолжай в том же духе!

[@МаксимМ-й7с]

Сразу лайк! Красавчик)

[@alexforos5425]

Спасибо, отличное объяснение ! С меня лайк и подписка!

[@КириллГаланов-л6ь]

Бро, ты красавчик! Спасибо)

[@igorkit1946]

best of the best.. ПРЯМ ВЗАЛ И РОЗЛОЖИЛ ВСЕ ПО ПОЛКАХ..

[@ИбрагимТаиров-ш6в]

очень качественная подача материала

[@ВладимирГугин-ш7щ]

Хорошо получается объяснять !

[@one_channel379]

setArray((prevState) => ([ ...prevState, newElement ]) очень полезный кейс в некоторых моментах) видео крутое ) лайк

[@dennisfisher2684]

А что такое превСтейт? По аналогии с видео - это начальный массив намберс?

[@ArchakovBlog]

Это токующее состояние

[@galievramil1169]

Подача отличная, Бро, если бы ВУЗах нормально платили, хотел бы видеть там тебя!

[@whiteguards43]

А нельзя setNumbers(numbers.push(random))?

[@volga_code]

отлично, продолжай!

[@vladimirww5152]

Детально объянил!

[@_pheax]

понятно , спасибо большое

[@gayanegalstyan9132]

Огромное Вам спасибо!!!

[@Oleg_Artemov]

ТОП !

[@pse1525]

Просто супер!

[@ВладСкурський]

Подскажи, пожалуйста, как удалить елемент с массива useState?

[@argeninho]

Разжевал и плюнул в рот :D Большущий рахмат

[@supersaeros]

Спасибо очень доходчиво. А про остальные хеки ещё нет видео?

[@dr_morpho]

Спасибо вам! Насколько знаю, jsx атрибуты пишутся в camel Case :))

[@dr_morpho]

Спасибо вам! Насколько знаю, jsx атрибуты в отличии от html пишутся в camel Case :))

[@ОлегОвчинников-щ9с]

🔥🔥🔥🔥🔥🔥🔥

[@blackwarrior6015]

Однозначно лайк

[@Shved_2.0]

за объяснение 5 баллов

[@skeelo3157]

жду useContext

[@suspiciouscandy1678]

Моя довольна :)

[@sergeykudryashov9097]

Спасибо!

[@Asgyr]

почему нельзя let это же массив и ты меняешь значения а не сам массив поэтому можно и const или я неправ ?

[@НиколайГрубляк-х9п]

Я вообще не знаю реакт, но я абсолютно всё понял. ТЫ ГЕНИЙ!

[@ВладиславВикул-г1я]

Спасибо за урок.

[@vitaliidrapaliuk5652]

Планируються видео по другим хукам?

[@AlexMazur-x4i]

posto zoloto a nie kurs!

[@munutd9857]

👍👍👍👍👍👍👍👍👍👍

[@АлександрАлехин-е2х]

более четкого объяснения не встречал

[@АлексейЧухланцев-л5г]

19:32

[@ivansafronov3359]

Круто объясняешь! Немного больше деталей по терминологии, к примеру, не совсем в начале было понятно, что за componentDidMont и тд... А так молоток, все круто!

[@ArchakovBlog]

спасибо за комментарий! в следующем курсе

[@GreatDion]

Что за тема в вскоде?

[@ArchakovBlog]

Atom One Light

[@vlad8318]

Не понятно :(

[@srt2046]

Мне кажется или реакт наоборот усложняет работу? То что с html и jQuery делается за 5 минут, с реакт занимает 20

[@fedorrychkov9962]

Если проект больше тудушника по функционалу, то можно умереть в пОгромировании с jQuery.

[@ArchakovBlog]

тебе кажется. Федор верно все верно говорит

[@srt2046]

@@ArchakovBlog понял, видимо это из-за отсутствия опыта)

[@Snegurjan]

Походу братан тебе когда то "Key" много нервов испортили)))

[@zhen1asemen1uk]

Блин, а ти харош

[@bigboy3085]

Умоляю!!!! Сделай уроки по Redux, а то в русском сегменте все объясняют через жопу, только ты поясняешь все моменты и нормально рассказываешь)

[@anzhelikacherniavska2605]

Очень классное объяснение useState!!! Благодарю! Ваши уроки офигенные для новичка в React!

[@ЕвгенийМакарук-ж8в]

Привет давно изучаешь реакт?

[@anzhelikacherniavska2605]

@@ЕвгенийМакарук-ж8в Привет, примерно 3 месяца.

[@ЕвгенийМакарук-ж8в]

@@anzhelikacherniavska2605 Как успехи?

[@anzhelikacherniavska2605]

@@ЕвгенийМакарук-ж8всредне) только в начале пути😊

[@tutnichegonet]

@@anzhelikacherniavska2605 а сейчас?

[@gayanegalstyan9132]

Я еще раз посмотрела видео и еще раз захотелось написать Спасибо Вам огромное! Пожалуйста, снимайте побольше видео. Вы нам реально очень помогаете!

[@eduard_dev]

Phenomenal !!! One of the best course on react, absolutely loved it . It cover all the concepts from very basic to advance. Арчаков Дэннис is the best React Js teacher.

[@ЕгорНей-л3ф]

Не поверишь, как раз сегодня дошел до хуков в документации. Приятное совпадение))

[@jorgenUA]

для сравнения kzbin.info/www/bejne/r4euiY2wZ96Unas

[@skynov]

Круто! Жду курс по реактивной пицце

[@jorgenUA]

про причину использования map вместо forEach ты наплёл так, что... не хочу обидеть, но: ты правда делал коммерческие проекты?)Про иммутабельность ни слова, а нужно бы сравнить для понимания массив numbers с newArr БЕЗ randNumber - человек бы увидел причину применения оператора spread... ну, может, ночью видео делал...) тема для VSC ничего так

[@yaroslavoz]

Чем тебе map не угодил?)

[@mykhailokurta8856]

Супер, использую уже)

[@MrSensys]

Как же отлично все разжевано и объяснено. Спасибо!

[@Jdjdjjjxhzh]

Отличный гайд, все понял.

[@AchtungBaby_87]

Даже тупой поймет после такого объяснения)

[@theoty-js]

как же ты круто объясняешь!

[@АлексейКравец-е7й]

спасибо за видео, мне понравилось как ты объясняешь

[@AlexMazur-x4i]

very cool explanation!

[@vladvoloshenko5701]

Очень грамотно и понятно, спасибо)

[@dinmukhamedamirov2704]

Благодарю!

[@yuriypetrik3333]

спасибо

[@SlimDwarfPavelIronfoot]

вот круто! правильно что обьясняешь с запасом!! так и нужно, а то как откроешь видео по 2 минуты... лучше обьяснить лишнего чем что то упустить! спасибо! комент в поддержку канала

[@romafrolov6811]

Ааааа белая тема

[@biLLie_wiLLie]

А что не так с курсом про пиццу?

[@ArchakovBlog]

Всё ок, просто то лень, то времени не хватает на запись оставшейся части. Пока записал где-то 60% курса

[@biLLie_wiLLie]

@@ArchakovBlog подскажи плиз, во всех курсах про реакт используют компоненты классы. С помощью этих хуков про компоненты классы можно забыть? Инфа в курсах не актуальна?

[@yuraivaniv1816]

нужно знать оба подхода

[@fedorrychkov9962]

@@biLLie_wiLLie функциональные компоненты легко поддерживаемы и проще тестируются. В своих проектах еще не видел кейса, где была бы необходимость возвращаться к классам в компонентах.

[@Cindorqw]

@@ArchakovBlog фреймворк COD Modern Warframe слишком интересным оказался, я прав?)

[@ALEKSEY_77737]

джи!

[@vladosononame6376]

на примере чисел то понятно, а на примере как добавить сообщение у которого массив messages которое идет из пропсов что состоит из обьектов {id:'23', title:'hello world',text:'SOME MESSAGE'} не совсем понятно при этом нужно увеличивать id на еденицу в зависимости от последнего сообщения, эти примеры с обычными числами не совсем юзабельные в реальной жизни, тем более если в реальной жизни ты взаимодействуешь с базой данных, а этот пример с номерами я это прочитал на более 10 сайтах что обьясняют useState, поэтому пошел на ютуб что б увидить более разнообразный пример, вообщем не совсем то что я хотел увидить, большенство коментаторов даже в реальности не пробуют делать то что на видосах, а просто в тупую пишут спасибо спасибо и думают єто им поможет в будущем но нет)

[@aleksandr1277]

а если forceUpdate использовать для перерисовки компонента?

[@TheFryOS]

Просто топ контент. Благодаря тебе разобрался и понял. Спасибо что для самых маленьких рассказал.

[@mm_dima]

пересмотрел роликов 10 на эту тему и этот оказался самым понятным, благодарю

[@edword0376]

Если бы не ты, так и бы не понял как работает этот хук, много где прочитал и посмотрел об этом, не понимал. Спасибо!)

[@OnlyLuck1000]

Почему нельзя поставить 100500 лайков?)

[@АлександрПлуталов-ъ4ш]

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

[@3bogdan333]

Спасибо, помог разобраться как это работает

[@yaroslavoz]

Расскажи, пожалуйста, как использовать функцию вместо присваивания массива или объекта переменной стейта. И когда будут следующие хуки?)

[@samirvaliyev]

В очень классный учитель. Спасибо вам

[@anv1kk]

Красава, очень понятно и подробно объясняешь, а новичкам это так необходимо!

[@АлександрГригоренко-г8к]

Привет. Спасибо за урок! А что за светлая тема у тебя в редакторе на видео?

[@tashakarluka7026]

молодец! давай еще React

[@ВикторияРезяпкина-ж7б]

Обьяснение - понятное очень, спасибо

[@Maksim-o3e6n]

Очень грамотно и понятно, спасибо!!!

[@RomanCzujko]

Доступно, спасибо!

[@reels_shorts7]

Спасибо 👍

[@vadimgaidai8186]

А push в случае с setNumbers не подходит из-за иммутабельности?)

[@ArchakovBlog]

он работает и есть сделать numbers.push(random) , а потом вызывать setNumbers(numbers), работать будет, но делать так не желательно

[@vitaliidrapaliuk5652]

Спасибо)

[@yevheniisahanenko5848]

Отличное видео, спасибо, что так сильно углубился в нюансы

[@enjoymtx]

какое углубление в нюансы, если это урок для начинающих и только про самые основы)