TypeScript & React. Полный курс

Поділитися
Вставка
  • Опубліковано 9 січ 2025

КОМЕНТАРІ • 135

  • @Alex_Delina
    @Alex_Delina 4 роки тому +32

    Крутяцкий курс, как и предыдущий по TypeScript. Все очень дельно структурировано, по делу и без лишней воды. Благодарочка)

  • @BigBoss-vs9xx
    @BigBoss-vs9xx 2 роки тому +3

    спасибо за ваш труд.
    настолько понятного объяснения TS и TS+React не встречал нигде

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 роки тому +1

      Спасибо больщое за отзыв

  • @CTILET
    @CTILET 2 роки тому +3

    Лайк подписка и коммент! Все что могу делаю!

  • @maksymdudyk1718
    @maksymdudyk1718 4 роки тому +9

    У Евгения талант к преподаванию. Так мало кто может - и излагать просто, и материал подбирать актуальний. Респект!

    • @YauhenKavalchuk
      @YauhenKavalchuk  4 роки тому

      Спасибо большое за отзыв)

  • @Призма-б9б
    @Призма-б9б 3 роки тому +2

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

  • @jozef5555
    @jozef5555 3 роки тому +1

    Лучший туториал по TypeScript + React!

  • @Reporter665
    @Reporter665 2 роки тому

    Это самый топовый материал по TS и React что я видел, хоть и 2 года прошло)

  • @Alex-ip4on
    @Alex-ip4on 4 роки тому +1

    Лайк однозначно. Неплохо припекало от типизации событий, теперь после объяснения все встало на свои места e: React.EventType. Еще и пустую тишину во вступлении убрал, стало приятнее слушать. Красавчек!

  • @ГеннадийГорохов-ц8н

    Супер курс то-что надо. Спасибо!!!!

  • @romanprokopets3693
    @romanprokopets3693 2 роки тому +2

    спасибо за урок, было полезно

  • @victormog
    @victormog 2 роки тому +1

    Очень полезно и подробно!

  • @yourbadapple
    @yourbadapple 3 роки тому +1

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

  • @olhas4933
    @olhas4933 3 роки тому +1

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

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      Спасибо за поддержку. На счёт обновления, подумаю

  • @eugenia9999
    @eugenia9999 4 роки тому +2

    лайк полностью !!)) всё очень понравилось !!))) благодарочка !!))

  • @Nikita-xe5kv
    @Nikita-xe5kv 3 роки тому +1

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

  • @yakut54
    @yakut54 2 роки тому +1

    Спасибо, Жень!

  • @alienspro
    @alienspro 4 роки тому +5

    Ох как вовремя! Спасибо!

  • @stephenkilonzo1263
    @stephenkilonzo1263 4 роки тому +3

    Thank you, This is what i was looking for

  • @СергейУстинов-ф3щ
    @СергейУстинов-ф3щ 3 роки тому +1

    Отличный курс, спасибо )

  • @sergeyplotnikov5031
    @sergeyplotnikov5031 4 роки тому +1

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

  • @АлМ-ы8ъ
    @АлМ-ы8ъ 3 роки тому

    Все как в методичке для института. Надо каждый вопрос на практике показывать. Желательно на простом примере написанном с нуля чтобы показать сам принцип. Многие иностранные (и не только) авторы так делают. По моему такая подача эффективнее. Успехов вам, Евгений

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      Учту для будущих курсов

    • @АлМ-ы8ъ
      @АлМ-ы8ъ 3 роки тому +1

      @@YauhenKavalchuk молодец, я уважаю людей которые мне отвечают. Я из Сибири

  • @РусланСаржин
    @РусланСаржин 4 роки тому +1

    спасибо большое. отличный урок

  • @fedoskamcha3768
    @fedoskamcha3768 3 роки тому +1

    ВАААААаааааа спасибо. Просто шикарноооооо

  • @olhas4933
    @olhas4933 3 роки тому +2

    Отдельное спасибо за разбор классовых компонентов. Очень полезно было.
    Обьясните пожалуйста значение знака ! при типизации. Не совсем поняла зачем он.
    Вот пример кода "context!: React.ContextType"

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому +1

      Not-null, not-undefined

    • @ringnull
      @ringnull Рік тому

      @@YauhenKavalchuk а в случае useRef(null!)

  • @Nikita-xe5kv
    @Nikita-xe5kv 3 роки тому +2

    Спасибо!

  • @Maxart92
    @Maxart92 4 роки тому +5

    спасибо за видео, если не сложно, обьясни пожалуйста почему в примере про типизацию ХОК-ов если удалить весь BaseProps, все компилируется без ошибок ?

  • @yakut54
    @yakut54 2 роки тому +2

    7:41 во Flutter/Dart как раз такая концепция.....

  • @sergy9119
    @sergy9119 2 роки тому +1

    Очень понравился курс, грамотное и полное изложение материала. Единственное, возможно я чего-то не понимаю, но...Как мне клонировать к себе репозиторий с веткой урока, чтобы в ней был код не на конец урока, когда все типы уже расставлены, а на момент начала урока, чтобы руками все делать?

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 роки тому

      Спасибо за отзыв. К сожалению, никак. В ветках только финальный код

  • @sharomet
    @sharomet 4 роки тому +3

    Круто. Спасибо) Интересно было бы посмотреть react-ts на реальном проекте с api.

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      Спасибо за отзыв, подумаю...

  • @irinakoshlakova5584
    @irinakoshlakova5584 3 роки тому +4

    Подскажите, а почему в типизации HOC из второго примера вы пишете , а не ?

  • @victormog
    @victormog 2 роки тому +1

    А как типизировать событие для возможности нажатия на кнопку как мышью, так и кнопкой (Enter или Space, например)?

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 роки тому +1

      Аналогичным образом, как описано в курсе, просто в качестве типа указываете один из специализированных, для каждого события он свой

    • @victormog
      @victormog 2 роки тому +1

      @@YauhenKavalchuk т.е. объединение типов?

  • @saswwer
    @saswwer 2 роки тому

    49:23 не совсем понял, почему у базового компонента тип ComponentType, а не FC, это же функциональный компонент. Или разницы нету?

  • @FlashViolet
    @FlashViolet 3 роки тому

    32:03 - объясни, пожалуйста, синтаксис записи типа дженерика? class Form Extends Component . Почему так? Пытался поискать инфу о такой записи, ничего не нашел =/

    • @aleksandralando3812
      @aleksandralando3812 3 роки тому +1

      это типизация классового компонента через generic types в скобочках сразу после Component. Первым передается типизация props, если их вообще не будет, то просто ставишь {}, вторым типизация state. В этом видео об этом говорится с 13:54. Так как есть типизация FormState, он ее сделал через type (в этом видео он виден на 32:01 и на 9 строке кода), он просто передает этот type в типизацию вторым параметром.

  • @dimd8824
    @dimd8824 3 роки тому +1

    привет! есть одна беда..
    на vsCode esLint c typeScript не работает, приложение сыпется..
    как это победить ? как можно настроить и подружить vscode eslint и typescript
    в esLint есть очень хорошие зависимости для хуков..

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому +1

      Можно попробовать воспользоваться пакетом: typescript-eslint

    • @dimd8824
      @dimd8824 3 роки тому

      @@YauhenKavalchuk спасибо, уже разобрался

  • @khalexspbru
    @khalexspbru 4 роки тому +1

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

    • @YauhenKavalchuk
      @YauhenKavalchuk  4 роки тому +1

      Вкладка на канале - плейлисты. Там все курсы

  • @testwebdevelopment4287
    @testwebdevelopment4287 3 роки тому

    Евгений, спасибо!
    По архитектуре с typeScript не планируете ничего? По cors? Gj

  • @ВладИванов-х3п
    @ВладИванов-х3п 4 роки тому

    PropTypes нужен, потому что typescript проверит типы в момент сборки, PropTypes же работает в рантайме. Однако, описывать PropTypes действительно нет необходимости, так как существует пакет для генерации их из typescript описаний

    • @ВладИванов-х3п
      @ВладИванов-х3п 4 роки тому

      Правда для этого в проекте нужен babel github.com/milesj/babel-plugin-typescript-to-proptypes

  • @borisoffdenis
    @borisoffdenis 4 роки тому +1

    мало что понятно) надо будет пересмотреть потом

    • @YauhenKavalchuk
      @YauhenKavalchuk  4 роки тому +2

      Если совсем непонятно, то можете пересмотреть курс TypeScript, он тоже есть на канале

  • @ДимаРапид-ф5ъ
    @ДимаРапид-ф5ъ Рік тому

    При таком написании у меня почему то пишет что BaseProps не используется(((

    • @YauhenKavalchuk
      @YauhenKavalchuk  Рік тому +1

      Сверьтесь с репозиторием, это всё что могу посоветовать не видя вашего кода

    • @ДимаРапид-ф5ъ
      @ДимаРапид-ф5ъ Рік тому

      @@YauhenKavalchuk Я уже все исправил, спасибо за обратную связь.

    • @ДимаРапид-ф5ъ
      @ДимаРапид-ф5ъ Рік тому

      @@YauhenKavalchuk А кстати, какая у вас версия node?

  • @aleksandralando3812
    @aleksandralando3812 3 роки тому

    43:07 , а если нам необходимо будет держать ссылку на setInterval или clearInterval, это понятное дело не работает, так как это не элементы. Выдает ошибку "Тип "Timeout" не может быть назначен для типа "HTMLElement"." Пыталась найти инфу об этом, сломала голову. Если пишешь Timeout тоже не работает, хелп..

  • @varanakonda
    @varanakonda 4 роки тому

    VSCode пишет что TSLint устарел и нужно использовать ESLint...

    • @YauhenKavalchuk
      @YauhenKavalchuk  4 роки тому +1

      Значит используйте ESLint. На момент записи курса TSLint был актуален

  • @XxXxColdDeathxXxX
    @XxXxColdDeathxXxX 3 роки тому

    Вы когда создавали проект - использовапи npx, а потом вдруг решили запустить с помощью yarn. Что? Как это вообще? Откуда внезапно взялся yarn, если проект по-другому создавали?

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      По сути npm и yarn запускают аналогичные процессы. Так что если есть yarn, то можно использовать и его

  • @карлсонкрыша-м3п
    @карлсонкрыша-м3п 2 роки тому +2

    походу что то изменилось за 2 года. children без React.ReactNode больше не определяется

    • @егорлетов-я8б
      @егорлетов-я8б 2 роки тому +1

      ага... тоже заметил.

    • @yakut54
      @yakut54 2 роки тому

      const Title: React.FC = ({children, title}) => (

      {title}
      {children}

      )
      const App: React.FC = () => (

      huj

      )
      export default App

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 роки тому +1

      👍

  • @haibova_irisha
    @haibova_irisha 2 роки тому

    здравствуйте , видео еще актуалено ?

  • @elatishev8007
    @elatishev8007 3 роки тому

    У тебя очень крутые и подробные видео, спасибо тебе большое автор!! Я уже очень долго пытаюсь понять как настроить vsCode так, чтобы были всплывающие подсказки, как у тебя например на 16:36 можешь подсказать пожалуйста, очень нужно, буду очень сильно тебе благодарен нигде найти не могу(

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      Я в первом видео рассказывал о расширении TypeScript

  • @НикитаРешетняк-ф5б

    почему я повторяю за тобой код, и начиная с хуков и у меня все красное????

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      Расширение фалов не tsx, не установлены нужные зависимости

  • @Adisey
    @Adisey 4 роки тому

    Этот курс писался точно в 2020? :(

  • @elford9337
    @elford9337 3 роки тому

    тебе нимбус ночью не мешает своим светом ? (P.s типа ты святой)

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      Я понял) Нет, не мешает) спасибо за отзыв

  • @antonryuben2528
    @antonryuben2528 4 роки тому

    забыл самое главное - указать тему vscode)))
    будь лучше, будь как майки, указывай тему vscode везде x)

    • @YauhenKavalchuk
      @YauhenKavalchuk  4 роки тому

      Я не указывал тему, потому что тема стандартная, я её не меняю

    • @antonryuben2528
      @antonryuben2528 4 роки тому

      @@YauhenKavalchuk ну по крайней мере в это ролике она не стандартная)

    • @YauhenKavalchuk
      @YauhenKavalchuk  4 роки тому

      Стандартная)

  • @ivolokha9146
    @ivolokha9146 3 роки тому

    лайк, но там где классы пропускал...

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      Зря, из опыта могу сказать, что разница в типизации минимальна. Единственное что действительно имело смысл пропускать - это методы жизненного цикла

    • @awenn2015
      @awenn2015 3 роки тому

      @@YauhenKavalchuk сейчас классами мало кто пользуется , то есть инфа по сути не актуальна, вот типизация хуков другое дело

  • @dimanazdratenko
    @dimanazdratenko 4 роки тому

    исправь ошибку в названии видео)

  • @awenn2015
    @awenn2015 3 роки тому

    Чет слишком много классовых компонентов ими еще кто то пользуется ? Эт ж неудобно

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      Вы правы, ими уже никто, кроме меня, не пользуется

    • @awenn2015
      @awenn2015 3 роки тому

      @@YauhenKavalchukпривычка или просто удобнее ?

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому

      Этот курс записывался когда хуки только-только появились

    • @awenn2015
      @awenn2015 3 роки тому

      @@YauhenKavalchuk не знал что хуки только не давно появились

  • @violentiner
    @violentiner 4 роки тому

    асинхронная типизация чета ад какой то

  • @lopsonbalzhinimaev642
    @lopsonbalzhinimaev642 4 роки тому

    100 реклам в одном видео)

  • @artemkrasnogir4673
    @artemkrasnogir4673 3 роки тому +1

    Жалко , что читаешь по бумажке на уже заснятый видос, а не в живую, перемотка кода на х3 это не о чем, ты курс, как памятку себе оставил?

    • @YauhenKavalchuk
      @YauhenKavalchuk  3 роки тому +3

      Как показали отзывы и опросы такой формат нравится всем. Без воды, слов паразитов и без лишней траты времени. Вы первый кому этот не «зашло». Ну а формат и подачу материала я менять не собираюсь

  • @yaroslav8609
    @yaroslav8609 3 роки тому

    последние 3 раздела нихера не понятно

  • @BearVodkaAndValenki
    @BearVodkaAndValenki 2 роки тому +2

    Спасибо!!!