11 - React + TypeScript / Типизируем ВСЁ / React JS - Путь Самурая 2.0

it-incubator.i... - человекоориентированное, честное и профессиональное обучение front-end и back-end разработке гарантированно до трудоустройства за фиксированную стоимость.
Поддержать меня можно на patreon / itkamasutra или оформив спонсорство на данном канале.
Ребят, применил TS ко всему проекту. Фууух... React+TS Task completed! психолошический барьер пройден. Ждите новых вкусняшек!!!
Спасибо всем за поддержку! Надеюсь у всех всё получилось, а если нет... забирайте контент с репозитория.
Вы красавчики, самураи! Я вами горжусь! Спасибо за поддержку! Летим в космос вместе!
Поддержать проект монеткой: social-network...
Платное обучение в онлайн или оффлайн инкубаторе:
it-incubator.eu
it-kamasutra.com
А здесь бесплатная взаимопомощь:
t.me/reactjs_s...
* Мы в соц. сетях:
itkamas...
/ itkamasutra
telegram.me/it...
* Мои личные VK и Insta:
d.kuzyu...
/ it.kamasutra.dimych
#reactJS #typescript #практика #примеры #уроки #курс
Удачи нам, друзья!

[@ITKAMASUTRA]

Ребят, применил TS ко всему проекту. Фууух... React+TS Task completed! Психологический барьер пройден. Ждите новых вкусняшек!!! Спасибо за донаты, спонсорство и подписку на АПИ! 🚀🤟

[@user-ln4do8bv9c]

Скинь пожалуйста ссылку на "трёхуровневый метод Димыча для обучения", про который ты рассказывал в одном из своих видео

[@pivand8648]

Куда написать чтобы получить ответы по обучению?

[@aleksandrpushnin2244]

Димыч когда будут новые видео?)

[@tazalov]

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

[@uzver3787]

00:22:05 event PromiseRejectionEvent(catchAllUnhandledErrors) 00:24:26 App props 00:26:00 compose, mapStateToPropsType 00:29:20 compose,тип ComponentType 00:31:11 WithSuspense HOC(generic) 00:34:14 WithAuthRedirect HOC(generic) 00:52:00 Bag(userPhoto) 00:53:50 User 00:57:55 AddPostForm 01:06:20 My Posts 01:12:07 Profile Info 01:16:25 Todo:) 01:20:20 Object.keys for ContactType 01:23:45 ProfileDataForm 01:31:15 ProfileContainer 01:37:30 Ctrl+alt+v (отдельные типы) 01:42:00 Типизируем Map и Dispatch для connect(Post Container) 01:46:40 Post 01:49:10 О выведении типа для mapStateToProps 01:51:20 Status 01:58:25 Navbar, Header 02:05:49 Messages, Paginator 02:13:42 Plans for the future...

[@grigoralex406]

Крутая идея!

[@maxim.saharov]

круто спасибо, только если не сложно исправь HOK на HOC

[@darjat.1069]

Димыч, спасибо тебе огромное! Нашла работу, правда не React, а Vue разработчиком. Однако освоить Vue после твоих курсов было совсем несложно. Мне 30, у меня гуманитарное образование, я училась почти полтора года (с большими перерывами и борьбой с прокрастинацией) и искала работу два месяца. Училась на твоих курсах, ну и каких-то ещё бесплатных видюшках в интернете. Хочу сказать, что всё можно, если не сдаваться. Дерзайте, ребята! И тебе ещё раз огромное спасибо, Димыч, за то, что делаешь сложные вещи простыми. ❤️❤️❤️

[@mariiatkachova570]

Молодец!!! У меня такая же ситуация была!

[@SohoCode]

как дела сейчас?

[@user-uu4gp9et2s]

Ты в конце жизни попадешь в рай, или в историю. Спасибо, лучший формат и подача и информация

[@sergeypetrov7005]

Привет Димыч. Хочу сказать тебе огромное спасибо за твою деятельность. Прошел твой курс React+Redux путь самурая v.1 и начал искать работу. В итоге на первом же собесе предложили оффер на позицию Junior. Всем ребятам советую не мчаться на платные курсы, а постараться самим вникнуть во все аспекты и идти, и еще раз идти на собесы. Только ваше желание и самостоятельное обучение даст максимальные результаты!

[@user-uk2hh8vy9e]

а подскажи, в каком городе искал? а то у нас с этим карантином вообще ноль вакансий)

[@sergeypetrov7005]

@@user-uk2hh8vy9e Россия, Томск) У нас карантин никак не повлиял, просто перешли на удаленку

[@linuxlifepage]

Привет расскажи что на собеседовании спрашивали. Тебе видимо круто повезло, либо бэкграунд хороший (правда?)?

[@user-uk2hh8vy9e]

@@sergeypetrov7005 понял, спасибо) удачи тебе и роста!:)

[@user-cm3qb6jo7d]

Надеюсь следующий плейлист будет называться "Нейросети кабзда как просто")

[@maxim.saharov]

и длиться 6 часов каждый урок)

[@visokogroup7922]

Ураа, я очень ждал этот день!)) и наконец-то, новая серия Игры престолов продолжается))) TypeScript мощный, но сложный... Спасибо, за твой адовый труд!

[@ITKAMASUTRA]

:))) Спасибо за поддержку!🙋🏻‍♂️

[@LNMaster_]

Это титанический труд, что-то объяснять и одновременно писать код, сам по себе знаю. Однозначно лайк за старания.

[@ggtv1964]

Разговаривают двое Хакеров, один другому: Знаешь как взломать Банкомат? Второй:Нет, как? Первый:Берешь кувалду, берешь Ноутбук, подходишь и разбиваешь банкомат кувалдой и бери что хочешь. Второй: А зачем ноутбук? Первый: Ну какой ты Хакер без ноутбука

[@user-ku2cf7dw4t]

Уееее!!! Начал с видео TypeScript месяца три назад, но все не доходили руки закончить. У меня сегодня такое же чувство, когда закончил огромный кусок работы. Тема была тяжелая. Димыч как всегда спасибо. Все супер. Вижу ты ты устал тянуть уже эту серию. Чувствую до соточки не доберемся;)

[@user-pb3yt3bo9u]

Вместо Obj.keys использовал такую конструкцию const getContacts = (contacts: ContactsType) => { return Object.entries(contacts).map(contact => { let [contactName, contactValueText] = contact if (contactName) { return ( {contactName}: {contactValueText} ) } return false }) }

[@dm-vg3vx]

Каждый раз кайфую с песенки в начале :D В самурае 1.0 клевая, но эта еще круче. У тебя музыкальный талант, Димыч!

[@marina-ej4qd9kc1wh]

Ооооох. Тяжело было, Димыч, спасибо за видео про TypeScript. Ты мегамозг

[@sandorkligan2208]

Спасибо Димыч! Ты великолепен!

[@maxim.saharov]

фух, ура! Наконец то закончился этот бесконечный урок) я его наверно больше двух дней проходил - так как Димыч не сильно стал разжевывать и приходится по ходу самому учить TS (так как второй сезон уже для мидлов типо, а сейчас и джунам нужно знать все что и мидлам)). И многое уже не так как у Димыча в видео сейчас - технологии меняются каждый месяц), поэтому приходится все делать как у Димыча только на новых технологиях. У кого не получаться что то прошу в мой репо.

[@maxim.saharov]

01:57:40 - Димыч позывает что не работает переход на профиль и что бы себя показывало. Я там больше, чем пол дня долбался и додолбился до идеальной работы) показывает профиль авторизированного пользователя и когда руками ссылку вбил то тоже показывает, как нужно, тоже можно увидеть в моем репо или в репо в файле News есть ссылка уже на выложенный сайт на гитхабе.

[@maxim.saharov]

maxim-saharov - назв. гитхаба и ReactKamasutra назв. Проекта

[@maxim.saharov]

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

[@spacerider9426]

TypeScript, React, Redux, типизация. Сэнсэй, спасибо за твой труд! Смотрю дальше!

[@aleksandrglebik8033]

Димыч, Ты просто красавчик! React + TypeScript / Типизируем ВСЁ / React JS

[@user-wr3dz2op1t]

Летим !

[@user-vj8hj9jk2b]

Димычу респект. Закреплены знания по TS for react components, connect, reduxForm, HOCs, redux redusers and actions. Маленькое примечание по видео: для React.memo() необязательно создавать новую компоненту и ее экспортировать, а сделать сразу: export default React.memo(Component)

[@user-bx7rm2rp9g]

Димыч, спасибо за твой труд! Респект!

[@user-jj9pm4zz2p]

огромное спасибо за уроки!

[@ITKAMASUTRA]

🚀👍 на здоровье!

[@mariiatkachova570]

React + TypeScript -> Cпасибо Димыч !

[@user-vd3pn5if1k]

Димыч большое тебе спасибо! Ты человек с большой буквы, Здоровя тебе!

[@VasylBatih]

Курс пушка, прошел 1.0 в то время как на работе сказали что будем переходить на реакт, очень помогло, но с 2.0 все както заплутанее, очень хаотичен код и + переход на TS, + если пишите как я немного по своему и не точь в точь за Дмитрием, то будет еще сложнее переводите ето все в ТС, было бы хорошо както структурировать ето все без обид, лично мое мнение Путь самурая! Вперед!)Летим! upd: и лучше как минимум разнести компоненты по отдельным файлам/папкам, т.к. сейчас присутствуют файлы с 2 и более компонентами

[@anthony_fed]

Димыч, огромное тебе спасибо!!! Нашел работу))) твой курс очень сильно помог !!! Останавливаться не буду) буду дальше бомбить твой курс!!!!

[@artsemvilchuk9037]

Ого! Димыч в воскресенье даже видосики выкладывает! Как сказали уже в комментах "новая серия игры престолов вышла!" :) Спасибо!

[@user-dz8gp1ls9z]

Спасибо большое за курс! React+TS ❤️

[@johnunderwood4904]

@Aimner Нашёл решение ошибки: "Type 'WCP' is not assignable to type 'IntrinsicAttributes'." Пишем export function withAuthRedirect и ошибка пропадает.

[@marina-ej4qd9kc1wh]

ты крут!

[@user-wd3tl2rx9p]

Димыч, спасибо) 00:22:05 event PromiseRejectionEvent(catchAllUnhandledErrors) 00:24:26 App props 00:26:00 compose, mapStateToPropsType 00:29:20 compose,тип ComponentType 00:31:11 WithSuspense HOC(generic) 00:34:14 WithAuthRedirect HOC(generic) 00:52:00 Bag(userPhoto) 00:53:50 User 00:57:55 AddPostForm 01:06:20 My Posts 01:12:07 Profile Info 01:16:25 Todo:) 01:20:20 Object.keys for ContactType 01:23:45 ProfileDataForm 01:31:15 ProfileContainer 01:37:30 Ctrl+alt+v (отдельные типы) 01:42:00 Типизируем Map и Dispatch для connect(Post Container) 01:46:40 Post 01:49:10 О выведении типа для mapStateToProps 01:51:20 Status 01:58:25 Navbar, Header 02:05:49 Messages, Paginator 02:13:42 Plans for the future..

[@joburn4144]

Спасибо большое за ценные уроки! Очень полезные записи. Прикольно, что у ребят, которые рассказывают о работе фронта React + Typescript, а главный сайт - это криво свёрстанный на конструкторе франкенштейн)) даже не знаю как это объяснить

[@n0escape]

Обновление 5: для типизации тестов (решение ошибки, где мы инициализируем компоненты): чтобы решить проблему с недостатком параметров, можем сказать что параметры которые не нужны в типизации самой компоненты указываем например : currentPage?: number также мы указываем стандартные значения в пропсах компоненты: const Paginator: Reac.FC = ({ ..., currentPage = 1 onPageChanged= x => x }) => {...}

[@user-pc9bl7uf1l]

Я на 47 минуте - мозг говорит тебе спасибо и выключается ))))

[@Ta1mse]

Всем доброго времени суток ,кто-нибудь знает решение проблемы с RouteComponentProps в 6 версии router-dom?

[@progi2409]

много времени конечно прошло но может нашел решение? я уже второй день мучаюсь все перепробовал ничего не помогает

[@user-ij9qf9yx8z]

Тоже не понимаю

[@n0escape]

В версиях 'react-router-dom' 6 и выше RouteComponentProps был заменен на RouteProps. поидеи работатет так же

[@n0escape]

@@progi2409 пнул ответ если надо еще

[@n0escape]

@@user-ij9qf9yx8z пнул ответ если надо еще

[@TheGena888]

56:45 сгорел от того что не слышу димыча из за охлаждения ноутбука - сходил за наушниками, надел. димыч поправил микрофон. победитель.

[@Edvard-Aliev]

Спасибо мужик! Еще не дошел до этого, но видео посмотрел) круто!

[@lelkamod]

Димыч, спасибо за очередной урок! Вместе с тобой переписала все на TS. Очень жду продолжения!

[@alessarver]

Спасибо большое за уроки))) Посмотрела все видео + начала писать свой проект на реакте. Откликалась на разные акансии по реакту в своем городе и втом, который недалеко. Пока не прошла ни одного собеседования(их было 2). Результаты еще 1 пока неизветны, а на другие собесы не попала. У кого-нибудь было такое же ужасное чуство из-за которого хочется сказать себе: "Возможно, это не мое". Очень много учу программирование ежедневно больше полугода(реакт начала учить около 2 мес назад).

[@ITKAMASUTRA]

Полгода - мало! 10 собесов проваленных первых - это норма!! Лети , не сдавайся!!!✊

[@erbolkenjebekov7701]

export function withAuthRedirect(WrappedComponent: React.ComponentType) помогло

[@yuritian8830]

Мне тоже помогло

[@originalhrysha1976]

Отличный контент!!

[@ITKAMASUTRA]

Спасибо

[@portador-portador]

Вроде не увидел в комментах. Нашел такие варианты типизацмм 1. Для контейнерных компонент: - создаем переменную connector: code: /// const connector = connect(mapStateToProps, mapDispatchToProps) - получаем тип пропсов, которые приходят в компоненту: code: /// type ConnectorProps = ConnectedProps 2. Типизация withSuspense для arrow function: code: /// const withSuspense = (WrappedComponent: React.ComponentType) =>

[@user-dg5js1if7c]

Определение типа ключей для полей формы можно выполнять прямо в самом createField. export function createField(placeholder: string | undefined, name:(Extract), component: FC, text: string, validate: Validator | Validator[] | null, props: any = {}) {

[@user-vd2xq1lx9x]

React + TypeScript / Типизируем ВСЁ / React JS

[@alira2924]

огромное спасибо! React+TS Task completed!

[@malifor]

Вот нормальный рабочий вариант withAuthRedirect C таким вариантом в app.ts ничего менять не надо все итак работает как надо и suspense отлично подгружается let mapStateToPropsForRedirect = (state: AppStateType) => ({ isAuth: state.auth.isAuth }) type MapStatePropsType = ReturnType export const withAuthRedirect = (Component: ComponentType) => { class RedirectComponent extends React.Component { render() { if (!this.props.isAuth ) return ; return } } return connect(mapStateToPropsForRedirect)(RedirectComponent); }

[@n0escape]

Спустя примерно 20 мин видео и 6 часов дебага я хотел сломать ноут разбить окно, и прокричать что я думаю о всех тех кто придумал эти все структуры и про програмирование в целом... Продолжение коммента 1: типизируем Хоки (папка hoc) Для начала типизации хоков, типизируем сначала места, где их используем (компоненты) Часто выскакивает ошибка в compose, ее следует типизировать сказав compose(...)(...) Для типизации хоков: если приходит компонент то его тип React.ComponentType При типизации хоков поменялась структура теперь это не стрелочкая функция: WCP - пропсы приходящего компонента export function withSuspense(WrappedComponent: React.ComponentType) { return (props: WCP) => { ... } } При типизации хока withAuth мы добавляли в пропсы isAuth из mapState... но нам не надо их передавать дальше поэтому деструктуризируем пропсы забирая isAuth а остатки передаем дальше let {isAuth, ...restProps} = props На этом этапе с толкнулся с проблемой, что у меня происходит анализ id профиля из url и который в props. Проблем было много, но если хотите чтобы редирект с профиля был только при попытке открыть свой профиль и иметь возможность просматривать другие профили, используйте этот (скорее всего гвоно) код let mapStateToPropsForRedirect = (state: appStateType) => ({ isAuth: state.auth.isAuth }) type mapStatePropsType = ReturnType & routerPropsType type routerPropsType = { router: { params: { userId: number } } } // // если авторизирован - то отображаем компоненту // // если не авторизирован и нет данных пользователя (props.router) - логинизация // // если не авторизирован и нет юсер айди - то на логиниацию // // если не автооризирован но есть юсер айди - то отображаем компоненту (скорее всего это профиль) // // используем только в компонентах, которые хотим защитить авторизацией export const withAuthRedirect = (Component: React.ComponentType) => { const RedirectComponent = (props: mapStatePropsType) => { if (props.isAuth ) { return }else if(!props.isAuth && !props.router){ return }else { if(!props.isAuth && !props.router.params.userId){ return } else { if(!props.isAuth && props.router.params.userId) return } } } return connect(mapStateToPropsForRedirect)(RedirectComponent); }

[@user-dp8xc9tx8n]

Ты даёшь бро. Знаешь как мотивировать и обучать

[@antonmaklakov]

Поздравляю с 60к подписчиками!🎂🎂🎂

[@klick998]

Только сейчас понял. Капец ты мне Леонида Бараца напоминаешь из "Квартет И". В хорошем смысле, конечно же) Reacr TypeScript Redux. Спасибо за материал!

[@ruslanla4654]

React TypeScript Большая типизация! Димыч Спасибо

[@user-iq3fs8ey7l]

#reactJS #typescript #практика #примеры #уроки #курс

[@n0escape]

Обновление 4: Столкнулся с проблемой версии react-router-dom v6 и выше. Проблема в импорте RouteComponentProps В версиях 'react-router-dom' 6 и выше RouteComponentProps был удален. Чтобы протипизировать данные url пришедшие из withRouter я типизировал так: type withRouterProps = { router: { location: Location; navigate: NavigateFunction; params: Record; }; } Если кому надо, вот моя вариация withRoouter, которой я оборачиваю profile import { useLocation, useNavigate, useParams } from "react-router-dom"; // wrapper to use react router's v6 hooks in class component(to use HOC pattern, like in router v5) export function withRouter (Component: React.ComponentType) { return (props: WCP) => { let location = useLocation(); let navigate = useNavigate(); let params = useParams(); return ( ); } }

[@Alexander-jf6ls]

Еще хотел добавить вместо params: Record использовать params: Record тогда userId будет типизирован

[@daniilpautkin]

Димыч! Уже Июль, оживай, пожалуйста)

[@aswonder5569]

Спасибо за превосходные лекции. Осталась недоделанная типизация Можно было бы сделать поиск по файлам проекта по ключевому слову "any". 1. В UsersReducer._followUnfollowFlow так и нет типа для параметра apiMethod. Я тоже не смог ничего придумать. 2. object-helper недоделан. Я его сделал так: type PropertyValueType = number // можно расширить. У нас пока userId:number type IndexableObjectType = {[item: string]:PropertyValueType} export function updateObjectInArray(itemsArray:Array, propValue:PropertyValueType, propName:string, newObjProps: any) { return itemsArray.map((item) => { return (item[propName] === propValue) ? { ...item, ...newObjProps } : item; }); } но чувствую, что это говнокод. P.S. Почти всю типизацию добил уже на 1:37:00, но осталась ошибка в ProfileContainer, с которой совладать не могу :-( - Argument of type xxx is not assignable to parameter of type 'MapDispatchToPropsNonObject'.

[@olehivanytskyi70]

2. Можливо написати так export const updateObjectInArray = (arr: Array, value: T[K], key: K, newObjProps: P):Array => arr.map(obj => obj[key] === value ? {...obj, ...newObjProps} : obj); й використовувати updateObjectInArray(state.users, action.userId, "id", {followed: true})

[@kurtmiller77]

Димыч, с тайпскриптом сразу видны косяки на проекте, то импорт не оттуда, то скобки не там, то еще всякая фигня и как оно только до этого нормально работало? )

[@olegkrugliansky1660]

Димыч, я еще на пути самурая 1.0, но хочу чтобы ты поглядзел мое сообщение и немного порадовался! Димыч, буду вас догонять, сейчас на 45 видео, еще чуть-чуть и прямо в космос, спасибо за то, что ты есть, я хочу от тебя детей

[@otto-vector]

протайкскрипил проект ещё несколько уроков назад, думал просто посмотрю, оказалось ещё рефакторинга на два дня :)

[@user-ei5zp2qi4j]

Спасибо, Димыч ты крут

[@sivkaburka1062]

Все перемещения файлов начались с 57:24, когда мы начали использовать typescript в папке Post

[@progi2409]

TS2305: Module '"react-router-dom"' has no exported member 'RouteComponentProps'. может кто-то нашел решение этой проблемы?

[@farbovaniylis315]

Получилось решить?

[@n0escape]

В версиях 'react-router-dom' 6 и выше RouteComponentProps был заменен на RouteProps. поидеи работатет так же

[@n0escape]

@@farbovaniylis315 пнул ответ (если еще надо)

[@mykhailostepanishchev6472]

фух,оч круто,спасибо.

[@yuritian8830]

Если выдает ошибку с ChangeEvent просто пропишите её примерно вот так import React, { ChangeEvent, useEffect, useState } from "react";

[@yuliyakurilchik3676]

RouteComponentProps. Кто нибудь знает чем можно заменить его, не переписывая классовую компоненту в функциональную? в 6 версии react-router-dom больше нет его

[@user-np9mq5xc7j]

Была та же проблема. Сделал так const params = useParams(); const id = params.id

[@yuliyakurilchik3676]

@@user-np9mq5xc7j пока осталась висеть ошибка "Module '"react-router-dom"' has no exported member 'RouteComponentProps'", но почему-то приложение перестало из-за нее крашится. Так что, пока что, я так и оставила. Но в дальнейшем, кроме как переписывания классовой на функциональную с хуками, - других вариантов и нет

[@user-np9mq5xc7j]

Скажите пожалуйста ошибка вызванная Promise у вас пофиксилась как у Димыча или нет? Просто у меня не получается. Я вижу пока единственный выход не писать then вообще в UI и вынести эту логику в BLL. НО еще думаю

[@yuliyakurilchik3676]

@@user-np9mq5xc7j Да, всё пофиксилось точно так же как у Димыча

[@user-bl4dl9ke7b]

Спасибо

[@user-qz4mq5tc8e]

30:49 Типизация withAuthRedirect урок 69 в Самурае 1

[@MrSvent0vit]

Урааа! ))

[@primatch777]

Димыч, не задумывался, что Камасутра - это Индия, а самураи - то японская темка))) надо было назвать чем то типа "Путь в тайпскриптовую нирвану")) (чисто новые шутке, не воспринимайте всерьез).

[@Abdul-hy4cy]

Димыч лучший !

[@feenthusiast]

30:05 можно просто withAuthRedirect выше чем connect поставить.

[@shsh01212]

Жестко брат, но я дойду до конца и зарефакторю

[@user-ls1yq8ti9t]

Круто!

[@StepanVorobiov]

было б круто выпуск про серверный рендеринг на react

[@user-ij9qf9yx8z]

Эх дим димыч, перестал ты тщательно объяснять, а ведь это твоя фишка была( Знаю что на 2 части мы многое сами должны делать, но TS это сложная штука, без повторений и подробностей не пройти

[@user-fu6vi1te3i]

Лично мне помогает ChatGPT со всеми вопросами, так что советую его освоить так сказать. А что касается курса по TS, то как по мне половина видосов по TS неактуальна, так как начал использоваться Redux-toolkit, и вот в нем например не надо явно типизировать Action-creator-ы к примеру. Также появилось много разных дженериков созданных уже библиотеками к примеру AxiosInstance, AxiosResponse в API которые используются, + благодарся toolkit есть createAsyncThunk, который оч помогает в типизации "Танков" и т.д. Да и редакс-форм никто не использует, есть формик, который типизируется двумя строками кода вместо миллиона. Много чего изменилось, поэтому только на Димыча рассчитывать не приходится.

[@Abdul-hy4cy]

Димыч красава !

[@kurtmiller77]

1:59:49 HeaderContainer из классовой в функциональную бы 2:05:14 Весьма частая ошибка, когда типы не совпадают, происхоодит как бы двойная работа - сначала описываем типы в стэйтах редакса, затем типы пропсов.Может быть есть решение, чтобы возвращать истинный тип из стейта редакса?

[@user-hb4vr5gq4u]

мляяя!!!! ну пушка!!!! я ещё на 57 уроке первого сезона. но захожу сюда чтобы послушать песенку!!! Взлетаеееем! коничива, самурай, коничива....!!!

[@Abdul-hy4cy]

React + TypeScript

[@VladislavAxt]

Пристегнитесь! Мы взлетаем!

[@Karifax]

Была ошибка на пропс pageTitle в App.tsx, решил тем что поменял типизацию compose в UserContainer на

[@yuritian8830]

Три рабочих дня ушло чтобы понять и пофиксить все баги. Это было прекрааааасно!!!

[@marina-ej4qd9kc1wh]

завидую, что тебе это понравилось

[@yuritian8830]

@@marina-ej4qd9kc1wh почему?

[@marina-ej4qd9kc1wh]

Ну, мне было скучновато на этом этапе. И я такая подумала, блин, может не мое все это. Хотя камасутру 1.0 с таким удовольствием учила.

[@yuritian8830]

@@marina-ej4qd9kc1wh не обязательно, что не ваше. Возможно посмотреть видеоуроки других. А вообще нужно отсекаться от видеоуроков и переходить на прямую к документации. Видеоуроки это как быстрый старт, которые дают общее представление об изучаемом. Да и мотивации будет больше, после изученного пунтка документации будет больше, включая растущую уверенность в себе. Потому как если сидеть только на видеоуроках, можно наткнуться на феномен "выученная беспомощность", с которым я не раз сталкивался. Может Вам это всё знакомо и вы уже это всё знаете. Просто решил поделиться своим махоньким опытом.

[@yuritian8830]

@@marina-ej4qd9kc1wh Попробуйте посмотреть других, хотя уже наверное это уже и делали) И с видеоуроков лучше переходить к документации. Дабы обойти феномен "выученная беспомощность", с чем я когда-то не однократно сталкивался.

[@n0escape]

Типизируем все часть 2: (присутствует ошибка с импортом экшнов в компоненту, чтобы они работали корректно надо их както передать в mapDispatchToProps вытащив из импортированного объекта action, иначе они просто не диспатчатся и не работают) Селекторы типизировать не надо, они подтягивают типы автоматом сократили запись джинерика типизации экшнов InferActionTypes: удаляем тип PropertyTypes и InferActionTypes на их месте создаем строчку: export type InferActionTypes = T extends { [key: string]: (...args: any[]) => infer U} ? U : never

[@user-de1qf3xl5g]

2021 все меньше и меньше лайков! остались самые сильные

[@amolotok]

летииим)))

[@user-pb3yt3bo9u]

TypeScript, React, Redux

[@StepanVorobiov]

Хочется видео по Сагам!)

[@shsh01212]

Блиииин, я всё жду когда Дима заорёт матом.

[@StepanVorobiov]

а Ant Design будет не скоро?

[@onebytesiteit30-75]

140 лайков и 0 дизов показатель. Красава!!!

[@gravityarm9240]

Где можна посмотреть исходник

[@aleksandrmatyka3118]

Стоит ли вообще если работаешь джуном на проекте учить какие то технологии которые в ближайший год не сможешь пощупать, к примеру если на поекте React,Redux,JS,TS есть ли смысл учить mobX, VueJS и тд, или лучше просто долбить js, react и углубляться в этих вещах а потом если возникнет необходимость в vue и тд то и так не будет проблем перейти

[@narutominer]

У меня в профилях всё немного по-другому, и пришлось пока в одном месте поставить any, а то ни сил ни терпения искать как это протипизировать у меня пока нет

[@sivkaburka1062]

Файл addPostForm виден на моменте 1:25:55

[@1ommy398]

Димыч ты куда пропал 😢

[@zmey852]

В реакте можно использовать псевдоклассы css типа hover и подобных(при наведении на условную кнопку она меняет свой стиль и выглядит как-то по другому)? Это ведь по идее нарушает flux круговорот. Как правильнее?

[@mrmicolka]

Стили - чисто внешний вид. На данные не влияют.

[@Karifax]

решил проблему в withAuthRedirect таким образом: export function WithAuthRedirect(Component: React.ComponentType) { class RedirectComponent extends React.Component { render() { if (!this.props.isAuth) return ; return ; } } let ConnectedAuthRedirectComponent = connect(mapStateToPropsforRedirect)( RedirectComponent ); return ConnectedAuthRedirectComponent; }; ----------------- type mapStateToPropsforRedirectPropsType = { isAuth: boolean } ------------------ let mapStateToPropsforRedirect = (state: AppStateType): mapStateToPropsforRedirectPropsType => { return { isAuth: state.auth.isAuth, }; };

[@xleb__b]

спасибо брат, обнял поднял

[@johnwaiaka1933]

Подскажите какой ноутбук подойдёт для обучения, есть игровые или не дорогой сойдёт?

[@sivkaburka1062]

Доделал до 1:58:42

[@olegzidane7099]

а какая сфера применения typescript? если его знать, то можно полностью решать на нем те же задачи что и на нативном js?

[@gazzati8494]

Димыч, в личном кабинете на сайте с апишкой статистика вроде с багой, там количество запросов за час и за 24 часа перепутаны

[@genapolyakov]

у меня вылетала ошибка в withAuthRedirect. Проверил все. Видно изменился синтаксис Написал немного подругами и ошибка ушла. Добавил extends MapPropsType export function withAuthRedirect(Component: React.ComponentType) Тогда и connect без ошибок и так работает, не нужно прописывать как дженерик.

[@oconnor4417]

Кайф, мне помогло!

[@akionka]

Димыч, пожалуйста, оставляй ссылку на гитхаб в описании видео)