React + Typescript за 40 минут. Типизируем axios redux и redux tool kit.

Рет қаралды 5,155

Күн бұрын

Всем привет, на связи WebStack - Frontend и в этом ролике мы познакомимся с Typescript. Освоим все базовые понятия. И узнаем, как быстро перевести свое приложение на Typescript
Таймкоды:
00:00 | Вступление
01:20 | Инициализируем React typescript проект
02:00 | Основные инструменты typescript
04:50 | Типизируем пропсы React компоненты
12:20 | Типизируем хук useState
14:55 | Что такое enum
21:21 | Типизируем хук useRef
24:24 | Типизируем колбэки
27:40 | Типизируем переменные
28:50 | Устанавливаем axios и типизируем запросы. Utility типы
38:18 | Типизируем redux tool kit
43:20 | Типизируем классический redux reducer
47:00 | Улучшаем типизацию useDispatch
49:40 | Итоги
Поддержать канал:
boosty.to/webstack-fe
Репозиторий с проектом:
github.com/vosdux/Rugram-yout...
Чат где можно задать мне вопросы и пообщаться с другими начинающими фронтендерами:
t.me/+0FWmXELauK44NjRi
Наш Discord сервер:
/ discord

Пікірлер: 43

@user-sp8ty2ol8m Ай бұрын

Насколько же тут всё отлично подано, прекрасный канал нашёл

@webstack-frontend1697 Ай бұрын

Спасибо за поддержку!

@RuslanZolotoy 7 ай бұрын

Зашёл после видео про MobX, сразу лайк автоматом. У тебя хорошая подача, благодарю!

@webstack-frontend1697 7 ай бұрын

Спасибо за поддержку!

@c4973 Жыл бұрын

Это одно из лучших видео по Typescript. Очень доходчиво, без воды, по сути при этом разжевано сразу когда возникал бы вопрос. +1 подписчик!

@webstack-frontend1697 Жыл бұрын

Спасибо за поддержку!

@user-ju4be3qp3o 8 ай бұрын

Спасибо большее. Все было очень доходчиво и быстро передано!!!

@webstack-frontend1697 8 ай бұрын

Спасибо за поддержку!

@user-qv1vw3rg3z 9 ай бұрын

Самый лучший канал про frontend в русскоязычном ютубе, автор супер!

@webstack-frontend1697 9 ай бұрын

Спасибо, за поддержку!

@alexmoney4641 Жыл бұрын

Очень важное видео, сейчас кидаю его всем своим коллегам, кто изучает TypeScript, очень благодарен автору.

@webstack-frontend1697 Жыл бұрын

Спасибо за поддержку!

@hobbi-mebel 9 ай бұрын

Классное видео! Коротко, без воды, все по делу! Автору респект.

@webstack-frontend1697 9 ай бұрын

Спасибо за поддержку!

@Roman-qr4xg Жыл бұрын

Отличное видео, без воды, всё доступно и главное на практике.Спасибо!

@dmaberlin Жыл бұрын

Два чая этому господину!

@mikeempire Жыл бұрын

Пока это самый годный урок на канале, большое спасибо!

@andrewsam224 6 ай бұрын

Интересненько......

@romanmerkulov830 Жыл бұрын

Классная подача. Очень много узнал полезного

@webstack-frontend1697 Жыл бұрын

Спасибо за поддержку!

@mbspudi Жыл бұрын

Про pick и omit не знал, постоянно искал что-то подобное, чтобы, по сути, не дублировать интерфейсы, плохо искал получается, спасибо

@webstack-frontend1697 Жыл бұрын

Таких служебных типов еще много

@hobbi-mebel Жыл бұрын

Спасибо за информацию! Отличная подача, многое для себя прояснил. Подписка.

@raijinhasarrived Жыл бұрын

Кайфую с тайпскрипта, спасибо 🔥

@RamaRama-qv3jo 11 ай бұрын

Отличное видео, ещё раз спасибо! Хотелось бы попросить автора, учитывать просмотр с мобильных устройств и планшетов в своих видео, довольно мелко и при этом в демонстрации много пустого места. При монтаже код можно увеличить выделив самое важное в текущий момент.

@webstack-frontend1697 11 ай бұрын

Спасибо за поддержу! Учту замечания, постараюсь исправить

@RamaRama-qv3jo Жыл бұрын

Спасибо!

@webstack-frontend1697 Жыл бұрын

Спасибо за поддержку

@Syberby Жыл бұрын

Спасибо за видео. До этого ломал голову над тем, откуда разраб узнает тип ивентов вроде ChangeEvent

@kainorling7418 Жыл бұрын

sps brat udace

@MrEmil-cf8wo Жыл бұрын

Привет классное видео! сейчас переношу spa на next столкнулся с проблемой reduxtoolkit , кто то вооще говорит удалить redux с проекта, есть ли вариант записать видео на эту тему?) про стейт менеджер в next

@webstack-frontend1697 Жыл бұрын

Привет. Честно говоря в ближайших планах нет, так как я сам не спец по next

@SoniqueChannel Жыл бұрын

с rab2 порвало

@fromntop3750 Жыл бұрын

41:01 (value: string) => boolean можно по подробнее почему при входных параметрах строки мы получим буль? p.s автору огромное спасибо. Я учил тс по документации, и никак не мог понять работу Picker и т.д. Спасибо🙏

@webstack-frontend1697 Жыл бұрын

Ну это был абстрактный пример. Но можно представить вот так: это функция, которая принимает строку и возвращает true если в ней четное количество символов и false, если не четное. Спасибо вам за отзыв!

@Syberby Жыл бұрын

Когда типизируешь в аксиосе запрос, например то чего хочешь получить, то это по большому счету только для того, чтобы работал автокомплит получаемых данных, а по факту что потом с сервера придет, то это проконтролировать невозможно же? Тоесть если в типе есть поле name, но на сервере переименовали его в title, то при запуске кода, он ломается по факту?

@webstack-frontend1697 Жыл бұрын

Да, здесь вы верно подметили. Но есть специальные библиотеки для валидации данных пришедших с бэка, которые отлавливают такой кейс. В одном из следующих роликов разберу это

@Syberby Жыл бұрын

@@webstack-frontend1697 спасибо, ждемс)