React стек 2022. TypeScript, Redux Toolkit, RTKQuery, Tailwind
58 245 просмотров • 14 июля 2022 г.

249 тыс. подписчиков
Исходники тут: https://t.me/js_by_vladilen/485
Я в соц сетях:
Telegram: https://t.me/js_by_vladilen
VK: https://vk.com/vladilen.minin
Instagram: https://instagram.com/vladilen.minin
Мастеркласс по React: https://youtu.be/haiiBZW45JE
Мои паблики по JavaScript:
Telegram: https://t.me/result_school_it
VK: https://vk.com/result.school
Instagram: https://www.instagram.com/result.school.it
JavaScript cообщества:
Discord: https://discord.gg/jscommunity
Telegram: https://t.me/js_by_vladilen_chat
Получить профессию Frontend разработчика -
https://bit.ly/3bzTr5X
Подробнее узнать об обучении в Result School -
https://bit.ly/3QTbUKQ
Бесплатный курс HTML & CSS - https://bit.ly/3NnFUvs
Сделать 5 проектов на JavaScript - https://bit.ly/3OGfJ47
Roadmap по каналу:
https://vladilen.notion.site/Roadmap-YouTube-0b917095c1ec424e9574c2ede36efab9
Продвинутый React. В видео технологии: TypeScript, Redux Toolkit, RTKQuery, Tailwind
2 534
0
Srg M
31.08.22 в 17:30
state.favorites = state.favorites.filter(f => f !== action.payload) vs ругается на action, в чем мб дело?
Ivan Stepanoff
31.08.22 в 16:07
Если можно - личный вопрос: live with less это отказ от яхты, кабриолета и виллы в Ницце или же от мяса, вина и женщин?
Ivan Stepanoff
31.08.22 в 15:42
Ценный видос. Мало лайкосов на ~60 кило просмотров...
Все просто мимо проходили? либо опытные мидлы просматривают нерелевантный контент, либо толпа Жлобов в айти входят, которым в лом ткунуть в батон пальчиком.
Руслан Муканаев
25.08.22 в 11:56
Просто пишешь код, говоришь что он делает, а как он работает и зачем не объясняешь.
Anton Goul'art
22.08.22 в 06:33
странная тенденция намечается... До того, как ts стал мейнстримом во фронтенде, все прекрасно понимали что означают события onClick и onChange и прекрасно работали с ними без описания их типов. Как только ts ворвался в комьюнити react разработчиков, сразу возникла острая необходимость описывать типы событий аля: «React.MouseEvent(HTMLButtonElement)....» Со стороны такой код выглядит странно. Какая цель у этого подхода? Создать видимость «экспертности», или это реально решает какие-то проблемы?
но в целом спасибо за урок. Кое-что полезное для себя нашёл.
Google User
20.08.22 в 20:07
Thank you very much for your work :)
maxim bagrayntsev
18.08.22 в 11:18
Офигительный материал. Доходчиво и все по делу!
Stegan Moskalen
17.08.22 в 22:32
Крутое видео, но у меня в IDE никак не работает tailwind
Portinable
17.08.22 в 12:36
Хотелось бы увидеть работу с подобным стеклом + Redux Observable
Файз Хисориев
16.08.22 в 08:25
спасибо большое, уважаемый человек)
Ametion
14.08.22 в 22:07
А вместе всех этих квери и тд, можно было бы использовать axios?
BLAC
14.08.22 в 16:36
const {isLoading, isError, data} = useSearchUsersQuery(debounced).
useSearchUsersQuery не будет делать лишние запросы на сервер при одинаковом значении debounced?
Ал М
14.08.22 в 08:25
Владилен, современный Реакт позволяет явно его не импортировать
Tigran Grigoryan
11.08.22 в 09:48
спасибо тебе за твой труд
Ал М
08.08.22 в 12:30
Не планируешь ли снять видео о Next.js + RTK ?
Дмитрий Дудолад
08.08.22 в 08:50
Отличный опыт, в 2022 году
Denis
05.08.22 в 20:50
Это trainee уровень?
Garik Melqonyan
05.08.22 в 13:51
Good job Vlad, thanks!
Kapiton
05.08.22 в 11:30
Очень полезный контент! Огромное спасибо) Когда допиливаешь кнопку Remove из самой FavouritePage, удобней получается))
Валерий Харламов
05.08.22 в 11:12
Огромное спасибо Владилену за мастер-класс! Как раз не хватало связки Реакт-TS.
Только у меня нежданная проблемка возникла. Забираю стейт из локалСторадж:
favourites: JSON.parse(localStorage.getItem(LS_FAV_KEY)) ?? [],
и TS мне пишет (подчёркивая localStorage.getItem(LS_FAV_KEY)):
Аргумент типа "string | null" нельзя назначить параметру типа "string".
Тип "null" не может быть назначен для типа "string".
Дальше просто невозможно двигаться, ибо вылетает эта ошибка. Если кто-нибудь знает, что это и как правильно надо здесь прописывать правильный тип — поделитесь, пожалуйста, буду очень благодарен!
Александр Гурков
03.08.22 в 08:18
как всегда классное видео, интересный материал, хорошая подача. спасибо, Владилен!
Игорь Белозор
02.08.22 в 14:16
очередной годный контент, спасибо за труд
Андрей Колтунов
31.07.22 в 17:03
Спасибо, было очень интересно, но ничего не понял
Games
30.07.22 в 08:24
Молодец, побольше бы таких видосоа
avel
29.07.22 в 18:26
А почему редакс? Мобх же на волне ныне
Christian Space
28.07.22 в 04:35
Очень интересно, но ничего пока не понятно, почему и как)) Возможно надо пересмотреть несколько раз. Спасибо
Pablo Andres Rodriguez Riveros
26.07.22 в 21:52
Поздравляю с видео, очень хороший материал. Хотя я не говорю и не понимаю по-русски, я довольно хорошо понял весь код.
У меня было только одно сомнение. Я не знаю, что делает функция setupListeners, если бы вы могли объяснить это, я был бы очень признателен.
Привет из Сантьяго-де-Чили в Южной Америке... на другом конце света.
---
Felicidades por tu video, muy buen material. Aunque no hablo ni entiendo nada de Ruso, entendí bastante bien todo el código.
Me quedó sólo una duda. No sé lo que hace la función setupListeners, si me pudieras explicar te lo agradecería mucho.
Saludos desde Santiago de Chile en Sudamérica...al otro lado del mundo.
Denis Ryazantsev
25.07.22 в 15:21
Крутейший материал!
Maxim Minchenko
24.07.22 в 18:25
Владилен, большое спасибо за урок!
Last Breath
24.07.22 в 02:49
Почему сразу после создания приложения или установки tailwind, сразу же 6 очень серьёных уязвимостей выдаёт npm? Когда по видосу с ангуляром всё делал, такого не было.
Stanislav
23.07.22 в 18:25
что то VUE совсем мало...
YL CSL
22.07.22 в 21:16
ещё можно было добавить Next вместо cra
Alexander Diakonov
22.07.22 в 12:01
Не понравился тейл винд, делает грязь в компоненте .
BV
20.07.22 в 20:30
Классное видео, как всегда! Хотелось бы увидеть разработку SSR на реакте без использования фреймворков типа NextJs, надеюсь когда-нибудь такое у тебя появится :)
Aliaxei Semianiuk
20.07.22 в 19:41
Как раз меня подписали на проект на примерно таком стеке
fallart
20.07.22 в 12:53
в вебшторме есть удобные сниппеты для реакта. например uses - развернет темплейт для useStore, а usee - useEffect
Alena Loban
20.07.22 в 08:10
Продвинутый стек - также известен как дефолтный)
Ольга Матвеева
20.07.22 в 07:45
Спасибо за урок, очень было полезно! Изучаю реакт, но с ts и redux ещё не работала, так что это прям то, что нужно)
Андрей
19.07.22 в 22:36
В CRA есть готовый темплейт для TS + RTK. Но в нем используется другая архитектура - деление на фичи. Тоже довольно удобный подход, всем советую потыкать)
Команда для генерации:
npx create-react-app ИМЯ_ВАШЕГО_ПРОЕКТА --template redux-typescript
И спасибо за видео, на днях буду пробовать tailwind
Alexis Rohina
19.07.22 в 18:51
В вебшторме есть встроенный сниппет - rsc, он создаёт и функцию и называет её сразу по названию файла
Dmytro Yevlakhov
19.07.22 в 11:51
React стек 2022 это NextJS в связке Apollo GraphQL
Редакс и всего его сопутствующие либы, как и REST в целом - избытки прошлого
TypeScript это не современный стек, а мастхев, кто-то еще пишет на чистом JS?
Елена Кайданова
19.07.22 в 08:20
Спасибо за урок. Со всем уважением, но Владилен вроде все хорошо на первый взгляд, но ничего не понятно, галопом по Европе. Что, куда и зачем не понятно. После просмотра осталось 100500 вопросов, на которые пришлось искать ответ самостоятельно. Но с другой стороны спасибо тебе что эти вопросы у меня возникли и я искал как их решить (ведь главное узнать вопрос). Жду следующих видео)
Денис К
18.07.22 в 14:24
Ужасное эхо в начале видео, я аж испугался, все видео будет таким, но потом звук исправился. Тебе нужно что-то делать с эхо
707bober
18.07.22 в 11:02
Спасибо. Было бы круто записать что-то подобное для Vue
Arlen M
18.07.22 в 09:31
Спасибо за труд! TypeScript, Redux Toolkit, RTKQuery, Tailwind
Владислав Коваль
18.07.22 в 07:18
Владилен, сделай видео как прикрутить ssr на этот стек, не на next, а вручную)
JeruGenius
17.07.22 в 21:58
зачем я это смотрю.. я даже не фронтэндер
vitalinko55
17.07.22 в 20:05
Владилен очень крутой ролик..... больше таких роликов
Alexandr Kharchenko
17.07.22 в 18:05
требуем подобного видео, об актуальном стеке в связке с vue/nuxt !)
Aleksandr Ivanov
17.07.22 в 14:29
Спасибо за лаконичную подачу, нашел несколько моментов по RTK для себя, хотя используем его уже год в проде) Классный пример со стилями.
Sostenes Gomes
17.07.22 в 12:30
Thanks a lot. This is very helpful. One question: why are you not using redux-persist, to store data on local storage? Is very easy to use. Instead manage LocaStorage manually, redux persist will do it for you
sc0or
17.07.22 в 12:22
Продвинутый - это чистый ЖС, хуки и контексты. Все, что в заголовке - это то, чем занимался тимлмд этим летом.
John Strayk
16.07.22 в 22:58
Спасибо за такие видосы, я под них засыпаю просто отлично.
Timur Kharkov
16.07.22 в 18:08
Почему до сих пор redux? А как же graphql? Или мы вынуждены постоянно использовать заюзанный вариант в угоду прошлому? Нужно уже попробовать что-то новое. Я уже полтора года использую graphql без redux и пока в полном восторге. Просто надоело уже слушать одно и тоже без изменений. Кажется что Владлен застрял в прошлом. Раньше мне нравился этот контент, но все меняется и нужно двигаться дальше.
Никита Есьман
16.07.22 в 17:16
Очень своевременный видеоурок, достаточно подробно рассказал, как что нужно делать, однозначно лайк)
scout top
16.07.22 в 15:23
Прошла зима. Настало лето. Спасибо путину за это
Real Programmer
16.07.22 в 11:37
Это кошмар, столько методов и синтаксиса нужно запомнить. Не верю что без таблеток это все нельзя запомнить
Дмитрий Зусмановский
16.07.22 в 09:43
Владилен, у вас хорошо получается рассказывать о разных технологиях. Побольше бы таких роликов.
Igor Alekseev
16.07.22 в 07:41
А как axios и RTK query соотносятся? Они одну задачу выполняют или разные в целом? Что из них лучше?
Arkadii
16.07.22 в 06:23
Гей
Max Mashpit
15.07.22 в 22:28
Владилен, спасибо! Я в своё время покупал твой курс по ангуляру, нашёл работу благодаря твоему подходу к обучению.. Реакт тоже нужен, буду изучать
Володимир Боднарчук
15.07.22 в 20:41
Спасибо большое за этот ролик!
Vadym Esch
15.07.22 в 19:24
Ну возможно в Перми React + Redux это продвинутый стрек.....ахааххахахаха
Иван Полотнянщиков
15.07.22 в 17:08
предусмотрел случай is loading в дропдауне и потом сам же скрыл когда данных нет)
Pavel Soldatov
15.07.22 в 15:47
Ни о чём. Смысл делать туториал, где ты тупо переписываешь уже готовый проект с другого монитора. Не объясняется, зачем используются те или иные хуки, принцип работы интерфейса, не проговаривается заранее архитектура приложения, псевдокод: что, куда, почему. Писать псевдокод до начала проекта - это вообще хлеб и масло любого начинающего програмиста.
Алексей Троцкий
15.07.22 в 14:24
В данном уроке сама программа WebStorm напоминает JDK. VisualStudio обладает такими же свойствами как WS?
Forellko
15.07.22 в 12:07
Спасибо за крутой контент! :)
Ilya Kovin
15.07.22 в 11:33
Спасибо. Начинал кодит, когда твой канал только начинался. Даже давал комментарии первым на роликах по TS. Спасибо! Ты топ!
Камиль Мухаметзянов
15.07.22 в 11:18
Благодарю
Артур Мудрик
15.07.22 в 10:15
Только абсолютно дилетантские фронтендеры используют и им нравится Тайлвинд, это пц, просто пц.
Ivan Oliinyk
15.07.22 в 09:25
Треба більше контенту данного формату, вподобайка, лайк !)
antogonyst
15.07.22 в 09:20
Потрібно більше таких відео
МегаНаноЧел
15.07.22 в 08:52
Спасибо большое за интересный урок.
Александр
15.07.22 в 08:06
А ты хорош! Спасибо за контент, тем более в свободном доступе. Всё четко, грамотно, у тебя талант объяснять. Учился на твоих роликах в том числе. Благодарен тебе !!!
Ol 11
15.07.22 в 07:57
Спасибо спасибо большое большое !!!
VIKI
15.07.22 в 07:18
Спасибо, как всегда очень полезно!
Alexsandr Glebov
15.07.22 в 04:30
за тобой прям кусочек Джеймса Уэбба. ✨
Dima Tronciu
15.07.22 в 03:04
crasata
Sergey Sergeev
14.07.22 в 23:31
Какой это лес после Vue
magntu0
14.07.22 в 22:44
Вай брат, всё получилось, после твоих курсов пошёл на работу, потом выгнали, когда узнали, что у тебя учился
Emin Aliyev
14.07.22 в 22:11
Почему про styled components ничего не снимайте , ведь он самый лучший щас в мире , ничего толкого не могу найти чтобы учить как правильно использовать их и тд )
FLASHBACK
14.07.22 в 22:08
Владилен , круто , хотелось бы Ангуляр увидеть))
Николай Хвостов
14.07.22 в 21:35
и чем этот тайл винд отличается от инлайн стилей? по мне так устраивать помойку в классах такая себе идея...
Du_ Mond
14.07.22 в 21:34
Раз два три четыре :D
Artem Fedotov
14.07.22 в 21:29
Вырос за два года, как фронтендер на твоих видосах, и уже своих учеников отправляю смотреть.
Спасибо тебе за то, что ты делаешь!
Алиса Двачевская
14.07.22 в 21:17
Спасибо тебе за контент, ты и учишь, и мотивируешь своим образом и мыслями :)
Trippie
14.07.22 в 20:21
у фронтов так быстро технологии меняются, RTKQuery и Tailwind впервые слышу, хотя не работаю с фронтом всего год)
Алексей
14.07.22 в 20:05
Супер!!!
Sergey Maksimov
14.07.22 в 19:55
Лайк просто за заголовок видео)) Посмотрю на досуге! Спасибо за подобный контент!
Самир Абдуллауев
14.07.22 в 19:17
Это уже не продвинутый стек. Если посмотреть вакансии джуна на фронт, то redux, typescript, toolkit уже давно там, tailwindcss спрашивают тоже, но не всегда)
Cebotari Viktor
14.07.22 в 18:57
Спасибо огромное за такие ролики! Они очень помогают, даже если я щас 40-50% проекта не понимаю, но со временем пойму
А Tailwind - это прям минус заботы за css классы и файлы даже если иногда получаются большие классы. Но преполагаю что в больших проектах он не рекомендован, т.к там всё по полочкам должно быть разделено, но если это не так, то это ещё лучше
Swetlana Aderikhina
14.07.22 в 18:38
спс, делай свое дело! Заинтересованые разберутся и в обновлениях синтаксиса и в смене парадигмы некоторых фреймворков со временем!
Lormida
14.07.22 в 18:33
Может быть снимешь что-то похожее но по Vue?
Ilya Martynov
14.07.22 в 18:31
После Next js так не кайф эти роутинги писать ручную
Дмитрий Ховрич
14.07.22 в 18:21
1:14:29 useState для хранения isFav - лишнее. Если у нас немного данных в store, то можно прямо в компоненте вычислять это значение. Если данных много, то можно использовать Set<string> вместо string[] в сторе и получать isFav всегда быстро - сложность поиска в Set - O(1)
Дмитрий Ховрич
14.07.22 в 18:11
1:02:20 Я давно не работал с Редаксом (и ни разу не работал с ReduxToolkit), но разве делать сайдэффекты в редюсере (чтение и запись в localStorage) это не нарушение границ ответственности компонентов? Разве редюсер не должен быть чистой функцией без побочных эффектов?
Дмитрий Юсов
14.07.22 в 18:01
1.Минин, 2.ты, 3.крутой, 4.чувак. )
WebMobileDev
14.07.22 в 17:58
Владлен спасибо! И отдельное спасибо за сразу выложенные исходники))
Рекомендации:
17 240 просмотров •
17 августа 2022 г.
98 622 просмотра •
17 августа 2022 г.
16 116 просмотров •
31 июля 2022 г.
41 878 просмотров •
8 июля 2022 г.
26 025 просмотров •
24 июня 2022 г.
20 736 просмотров •
17 июня 2022 г.
78 728 просмотров •
26 мая 2022 г.
50 216 просмотров •
21 апреля 2022 г.
35 849 просмотров •
16 апреля 2022 г.
22 588 просмотров •
8 апреля 2022 г.
71 042 просмотра •
7 апреля 2022 г.
37 050 просмотров •
1 апреля 2022 г.
21 461 просмотр •
25 марта 2022 г.
52 346 просмотров •
18 марта 2022 г.
27 764 просмотра •
24 декабря 2021 г.
38 565 просмотров •
11 марта 2022 г.
17 468 просмотров •
7 марта 2020 г.
18 337 просмотров •
3 апреля 2020 г.
125 832 просмотра •
9 апреля 2020 г.
1 686 085 просмотров •
5 мая 2020 г.
35 041 просмотр •
7 мая 2020 г.
34 530 просмотров •
13 мая 2020 г.
20 920 просмотров •
15 мая 2020 г.
46 341 просмотр •
4 июня 2020 г.
67 856 просмотров •
30 июня 2020 г.
Alec Hardison
05.09.22 в 19:48
А что на счёт reselect в тулките ?