Фишки TypeScript о которых ТЫ НЕ ЗНАЛ!

Ғылым және технология

В этом ролике мы разберем интересные моменты в TypeScript, которые можно будет применять на практике. Поговорим про Union типы, подсветку ошибок, тайпгуарды, утилитарные типы, generic компоненты, условные типы и кортежи, разница между enum vs as const object
Мой курс "Продвинутый Frontend. В production на React" - ulbitv.ru/frontend
Ссылка на мой телеграм канал - t.me/ulbi_tv
Таймкоды:
00:00 ➝ Введение
00:50 ➝ 1 лайфхак. Exhaustive check
03:50 ➝ 2 лайфак. Typeguard is
06:20 ➝ 3 лайфхак. Enums vs const enum vs as const object
14:00 ➝ 4 лайфхак. ReturnType, Parameters
16:20 ➝ 5 лайфхак. Conditional types. Условные типы
18:45 ➝ 6 лайфхак. Кортежи (tuple)
20:00 ➝ 7 лайфхак. Immutable, readonly
21:20 ➝ 8 лайфхак. Utility types
26:10 ➝ 9 лайфхак. Generic component React
27:50 ➝ Наглядный пример работы Event loop в коде
30:10 ➝ Не забудь поставить лайк и написать комментарий для
продвижения видео, всем спасибо за поддержку!)
Поддержать меня и мой канал вы можете по ссылкам ниже.
Ссылка на мой телеграм канал - t.me/ulbi_tv
Patreon/boosty (доступ к бонусам) - boosty.to/ulbitv
Qiwi кошелек - qiwi.com/n/BODYE821
Яндекс деньги - yoomoney.ru/to/4100116193037469

Пікірлер: 262

  • @VasjaG
    @VasjaG Жыл бұрын

    Ulbi, красавчик! Можно вот этого вот побольше?

  • @MrTruth-rc2fr

    @MrTruth-rc2fr

    Жыл бұрын

    Хахах, знакомые слова)

  • @user-wk5ij2je3z

    @user-wk5ij2je3z

    Жыл бұрын

    Контент в кайф!

  • @VasjaG

    @VasjaG

    Жыл бұрын

    @@MrTruth-rc2fr Это ЧатГПТ (подмигивает)

  • @anatoliiilescu839

    @anatoliiilescu839

    Жыл бұрын

    чтобы вы еще хотели ? думаю ради вас все будет!!!

  • @VasjaG

    @VasjaG

    Жыл бұрын

    @@anatoliiilescu839 Порядочные люди знают, что здесь не стол заказов. Но ради продвижения ролика было бы хорошо устроить срач в комментах.

  • @dzmitrypasavetsdimapolonez2644
    @dzmitrypasavetsdimapolonez2644 Жыл бұрын

    Пили ещё. Не затянуто, познавательно, хотелось бы увидеть, весь список подобных лайфхаков которые ты перечислил в видосе.

  • @BOCbMOU
    @BOCbMOU Жыл бұрын

    27:43 Если нужно добавить один дженерик в функцию и нет необходимости экстендить его от чего-то, то можно просто добавить запятую: В таком виде это уже не будет JSX, а будет именно дженерик. И это актуально только для .tsx файлов, в .ts файлах с этим проблем нет.

  • @maksimtsvetkov3764
    @maksimtsvetkov3764 Жыл бұрын

    На 24 минуте (Utility Types) при объявлении типа с таким же набором полей как у одного из полей интерфейса, как альернативный вариант записи можно просто записать type Birthday = User['birthday'], тогда конструкция valueOf не потребуется и читабельность будет чуть проще. Спасибо за видео!

  • @ixplo

    @ixplo

    Жыл бұрын

    это проблема TS. почти любой тип можно описать почти бесконечным количеством вариантов. И никто не знает всех лучших вариантов ) я не знаю ни одного настоящего синьора в TS. Все постоянно в поиске. И это дико. Дико, что TS втыкается в 90% проектов, но никто не умеет в него нормально )

  • @SeverHolod
    @SeverHolod Жыл бұрын

    Братан, хорош, давай, давай, вперёд! Контент в кайф, можно ещё? Вообще красавчик! Можно вот этого вот почаще?

  • @IzyLifeVlog
    @IzyLifeVlog Жыл бұрын

    Да, это здоровский формат! Быстрая иньекция новой информации, каждый день по 30 мин и уже будешь знать больше чем многие колеги!

  • @geek-peek
    @geek-peek Жыл бұрын

    По поводу enum: они бывают не только строковые, ещё и числовые - хотя в рантайме это просто число, но на этапе разработки ты можешь писать не === 1, а что-нибудь имеющее смысл. И зачем они нужны: 1. Чтобы не использовать строки в коде, и чтобы не было соблазна их повторять 2. Чтобы обрабатывать входящие данные: у меня на проекте есть типы газоанализаторов, и приходят они как число 0-255, а на фронт нужно отдать название. Здесь помогли 2 enum - числовой и строковый

  • @falsetrue7910
    @falsetrue7910 Жыл бұрын

    Узнал новое, не смотря на то, что с ТС давно на ты Спасибо!

  • @gigor1433
    @gigor1433 Жыл бұрын

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

  • @MrRbSecond
    @MrRbSecond Жыл бұрын

    Братан, хорош, давай, вперёд! Контент в кайф, можно ещё? Вообще красавчик! Можно вот этого вот почаще?

  • @bulatsafin-cg3tg
    @bulatsafin-cg3tg Жыл бұрын

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

  • @elena_sva
    @elena_sva Жыл бұрын

    В примере где с помощью ValueOf берём тип birthday можно просто взять TypeNameWithBirthday['birthday']

  • @UlbiTV

    @UlbiTV

    Жыл бұрын

    Справедливо, если нужно одно поле, пиком можно несколько цепануть

  • @BOCbMOU

    @BOCbMOU

    Жыл бұрын

    @@UlbiTV если надо достать тип значений из нескольких полей, то как раз пик тут лишний, по прежнему можно несколько ключей перечислить: TypeNameWithBirthday['id' | 'age' | 'birthday'] Пик всё же как раз для создания нового объекта с некоторыми старыми ключами и изначальными типами ключей. Доставать через него значение нелогично.

  • @dmitrykabanov9458
    @dmitrykabanov9458 Жыл бұрын

    Было бы круто посмотреть видео про микрофронтенд. Условно - есть базовый Шелл, в котором есть базовый роутинг. И каждый роут это отдельный сервис, который прописан в ремоутс

  • @ixplo

    @ixplo

    Жыл бұрын

    как меня триггерят такие темы :) микрофронты -- это решение, когда полный бардак в конторе надо как-то спасать. Микрофронты -- это приговор, когда всё просрали имхо

  • @parabellum577

    @parabellum577

    Жыл бұрын

    @@ixplo ну да, не могу представить кейс, когда такое говно реально нужно применять

  • @ixplo

    @ixplo

    Жыл бұрын

    @@parabellum577 кейсы есть, но почти всегда за сопоставимое вложение ресурсов можно сделать что-то другое, что не повлияет на качество продукта

  • @tagnati5585
    @tagnati5585 Жыл бұрын

    Какой же офигенный видос. Спасибо большое за материал

  • @shittywizzard5727
    @shittywizzard5727 Жыл бұрын

    Лаконично и ёмко, хорош, давай еще)

  • @user-vm2db5cq1g
    @user-vm2db5cq1g Жыл бұрын

    Супер видео! буду ждать продолжения и по тайпскрипту и по другим темам! отличный формат!

  • @BobbyBob21
    @BobbyBob21 Жыл бұрын

    Ещё офигенная вещь это inner. Для динамических типов это просто незаменимая вещь.

  • @DubinArtur
    @DubinArtur9 ай бұрын

    12:50 если надо, чтобы функция принимала стоки, которые относятся к enum, нужно в качестве аргумента функции указать ‘${UserRole}‘. Функция пропустит и enum значения как UserRole.Admin, так и "admin"

  • @ArtyomSamsonchik
    @ArtyomSamsonchik Жыл бұрын

    На 23:50 можно вытянуть тип Birthday гораздо проще. У TS есть синтаксис доступа к типу по индексу, и выглядит это так: type BirthDay = User['birthDay'] И не нужны ни Pick, ни ValueOf.

  • @maximkarpov4405

    @maximkarpov4405

    Жыл бұрын

    так его valueOf по сути тоже самое

  • @valentinaicheva7846
    @valentinaicheva7846 Жыл бұрын

    Очень полезно! Хочется еще подобный контент с фишками💥

  • @farruhsydykov8420
    @farruhsydykov8420 Жыл бұрын

    Супер! Давай больше о TS, backend, web3!

  • @vladimirliankevich1361
    @vladimirliankevich1361 Жыл бұрын

    Спасибо тебе большое за такие познавательные видео!!!!!!! Как всегда по полочкам

  • @user-cd2jj9ho6c
    @user-cd2jj9ho6c Жыл бұрын

    Как всегда коротко и по делу, очень полезное видео!

  • @user-bu5mw7jz6m
    @user-bu5mw7jz6m Жыл бұрын

    Спасибо за видео, очень полезно. Хотелось бы видеть больше таких видео

  • @dmitrykabanov9458
    @dmitrykabanov9458 Жыл бұрын

    Про тайпгарды понравилось. Хороший пример

  • @reversoid8170
    @reversoid8170 Жыл бұрын

    Очень круто и полезно! Не знал про Exclude)

  • @foldisnomistake
    @foldisnomistake Жыл бұрын

    круто, нужны еще такого плана видосы!

  • @user-ou5ok8fs9c
    @user-ou5ok8fs9c Жыл бұрын

    Как всегда годный контент. React, Typescript форева😂

  • @holfizz7868
    @holfizz7868 Жыл бұрын

    это какой то п**дец. Я еле еле что то вкурил. И я понял что надо учиться и учиться. Тимур ты реально крут. Спасибо тебе❤❤

  • @dmitrykabanov9458

    @dmitrykabanov9458

    Жыл бұрын

    По сути, все что показано в данном видео это вспомогательные инструменты ТС. Это не обязательно использовать но надо знать, по тому что эти инструменты помогают писать код таким образом, чтобы предотвращать не корректный код. Если интересно, почитай про тайп гарды, анкноун и Невер. Всякие енамы, как по мне, не нужны. Они просто побыстрее работают

  • @holfizz7868

    @holfizz7868

    Жыл бұрын

    @@dmitrykabanov9458 Я обязательно займусь этим но позже. Мне очень сложно это воспринимать так рано:)

  • @frednoby8531
    @frednoby8531 Жыл бұрын

    Интересные нюансы, благодарю!

  • @demetrx7972
    @demetrx7972 Жыл бұрын

    Всё, что нужно, в одном месте, быстро и понятно 💣💥

  • @Quentinrei
    @Quentinrei Жыл бұрын

    Ещё не досмотрел, но уже заходит, крутой ролик

  • @ksushakiseleva2644
    @ksushakiseleva2644 Жыл бұрын

    Спасибо за твой труд! ❤ Твои видео очень полезные 👍

  • @gluktd
    @gluktd Жыл бұрын

    Нижайший поклон добрый человек! Очень понравилось! knowledge sharing в массы

  • @user-of8fm9py9b
    @user-of8fm9py9b Жыл бұрын

    Быстрые гайды офигенно заходят!) Правда слушаю на 1.75, поэтому они прям супер быстрые)) Материал полезный, даже если все знаешь, лишний раз повторишь. Спасибо за труды!

  • @YuryGoltsman
    @YuryGoltsman Жыл бұрын

    Пару новых штуковин узнал. Спасибо

  • @Levitizen
    @Levitizen Жыл бұрын

    Круто, спасибо. Можно вот этого вот почаще

  • @dkaygorodov
    @dkaygorodov Жыл бұрын

    Тимур, спасибо большое. Очень полезное видево!)

  • @ekaterina1991
    @ekaterina1991 Жыл бұрын

    Реакт и js такого формата очень жду

  • @luckytima2315
    @luckytima2315 Жыл бұрын

    Бро давай побольше TS, он сейчас везде просто нужен )) Ну и фишки ванильного JS тоже хотелось бы узнать))

  • @user-nx5cp5no8n
    @user-nx5cp5no8n Жыл бұрын

    очень интересный обзор! спасибо большое!

  • @MrDANPTZ
    @MrDANPTZ Жыл бұрын

    Просто супер! Полезного было достаточно, что приятно Спасибо за ролик!

  • @alexanderkomanov4151
    @alexanderkomanov4151 Жыл бұрын

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

  • @Ramosok
    @Ramosok Жыл бұрын

    Круто, очень много нового узнал.

  • @max_mgtow
    @max_mgtow Жыл бұрын

    Вперёд братан, контент в кайф! 👍👏🔥

  • @bambalbino
    @bambalbino Жыл бұрын

    Очень круто!!! Спасибо

  • @sergeymalakhov2438
    @sergeymalakhov2438 Жыл бұрын

    Классное видео.Очень зашёл такой контент

  • @egorpobylets6597
    @egorpobylets6597 Жыл бұрын

    Супер, спасибо. Очень интересно и полезно!

  • @denispepper2830
    @denispepper2830 Жыл бұрын

    Спасибо! Круто! Норм формат!

  • @_GyG_
    @_GyG_ Жыл бұрын

    Коммент в поддержку) как всегда все круто!

  • @user-ov8xk7cn9e
    @user-ov8xk7cn9e17 күн бұрын

    Крутые ролики у тебя, смотрю и практикуюсь) !спасибо!

  • @l1mejkeee628
    @l1mejkeee628 Жыл бұрын

    Больше такого контента!!!! Пожалуйста!!!

  • @user-jm7dy8ks7w
    @user-jm7dy8ks7w10 ай бұрын

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

  • @user-td3bz8st6v
    @user-td3bz8st6v Жыл бұрын

    Действительно интересные приемы которые хотелось бы попробовать в деле.

  • @user-ci6pr6oy6q
    @user-ci6pr6oy6q Жыл бұрын

    1 кейс что пришел на ум, когда ты используешь не константный объект а через ValueOf получаешь типы и потом используешь строки или что там в readonly то если надо заменить значение ты будешь бегать по проекту и менять занчения везде, если же использоать константный объект (импортировать его да) то значение нужно заменять в одном месте

  • @sergsergey4251
    @sergsergey4251 Жыл бұрын

    Спасибо за полезное видео

  • @Moishe_Rubinstein
    @Moishe_Rubinstein Жыл бұрын

    strapi сделай бро! :)

  • @v.demchenko
    @v.demchenko8 ай бұрын

    Интересная тема по поводу типизированых переиспользуемых компонентов. Наткнулся на много проблем типизации от создании темы до типизации пропсов.

  • @user-mn9tg3sc6p
    @user-mn9tg3sc6p Жыл бұрын

    очень полезно, спасибо

  • @natalyaiv3414
    @natalyaiv3414 Жыл бұрын

    Тимур, спасибо! 👍

  • @17u5h
    @17u5h Жыл бұрын

    крутяк! Заскринил некоторые моменты, записал в "заметки"

  • @user-yq4yd1qz6w
    @user-yq4yd1qz6w Жыл бұрын

    Спасибо, довольно полезный контент

  • @MrJettann
    @MrJettann Жыл бұрын

    Топ, испытываю проблемы с тс постоянно, с подобным контентом становится проще!

  • @lLoseControll
    @lLoseControll Жыл бұрын

    Круто, продолжай)

  • @stmihan_
    @stmihan_ Жыл бұрын

    Очень круто, но надеюсь ты сделаешь всё-таки видео по react query.

  • @vladimirkuban426
    @vladimirkuban426 Жыл бұрын

    Супер!

  • @igortrifonov9339
    @igortrifonov9339 Жыл бұрын

    По поводу первого случая, не нужно делать функцию, это лишнее. Можно просто написать const _: never = car.brand, и TS будет ругаться, если мы попадет в дефолт.

  • @BOCbMOU

    @BOCbMOU

    Жыл бұрын

    Есть ещё проще вариант на 4.9+ версии: car.brand satisfies never;

  • @user-im3nr6he9m

    @user-im3nr6he9m

    Жыл бұрын

    @@BOCbMOU Огонь! Не знал что такое есть

  • @infodusha
    @infodusha Жыл бұрын

    Привет! в первом примере надо возвращать результат функции never чтобы вычисляемый тип значения был правильный (а то иначе туда добавится undefined)

  • @STELLS541
    @STELLS541 Жыл бұрын

    Видос просто 🔥. Можно такого больше? ☺️ В конце про дженерики - это прям топ, как раз на днях увидел это в курсе и сразу понял тут, как это фиксить. А еще функцию онЧенч внутри селекта можно переписать через опшионал ченинг, что сделает ее чуточку короче.

  • @nothingg1759
    @nothingg1759 Жыл бұрын

    Очень заходит! Понравится всем, спасибо большое!

  • @Quentinrei
    @Quentinrei Жыл бұрын

    Больше таких роликов !

  • @---Maksim---
    @---Maksim--- Жыл бұрын

    Спасибо, на 1.25 смотрится отлично)

  • @user-pg6sg1hu7x
    @user-pg6sg1hu7x Жыл бұрын

    Оч интересно, контент топ, идея топ

  • @TheProfessionalGambler
    @TheProfessionalGambler Жыл бұрын

    Интересные фишки, спасибо) 20:40 пример не совсем корректный, когда мы делаем объект константой _obj as const_ , то мы его поля не сможем изменить, а в функцию мы передаем аргументом объект с похожим типом и он никак не связан с obj. То есть ТС только проверяет на соответствие типов параметра и аргумента, а не логику внутри функции. 23:30 пример для Extract лучше с доки _type T0 = Extract;_ по простому это как пересечение. В твоём примере непонятно зачем указывать union, который и получаем.

  • @alexmarch
    @alexmarch Жыл бұрын

    хочу собеседования ! но любой контент твой хорош

  • @DemetriyArh
    @DemetriyArh Жыл бұрын

    Круть. А о декораторах можешь рассказать?

  • @raff_m_d6971
    @raff_m_d6971 Жыл бұрын

    контент топ, продолжай

  • @spadar1602
    @spadar1602 Жыл бұрын

    Думаю, можешь добавить Module Augmentation, помогает когда нужно расширить тип из либы, чтобы, например подмешать свое данные в аргументы какого-то метода из либы

  • @ruslanla4654
    @ruslanla4654 Жыл бұрын

    круто!!

  • @qwe-rty-
    @qwe-rty- Жыл бұрын

    Супер, надеялся еще на MappedTypes посмотреть, по ним видосик будет?)

  • @tesohi
    @tesohi9 ай бұрын

    супер! спасибо)

  • @Orlov_Developer
    @Orlov_Developer Жыл бұрын

    Полезно, рубрика классная

  • @famemax8264
    @famemax8264 Жыл бұрын

    Зашло, спасибо

  • @user-mv7wk1ey9v
    @user-mv7wk1ey9v Жыл бұрын

    Привет, я давно смотрю твои видео, очень интересный контент, нравится твоя манера говорить и способность вести диалоги. Ты в каком-то видео говорил, что для начинающих программистов крайне важно попасть на хорошую работу, с хорошим начальником и коллективом, и я хотел бы узнать твое мнение, я очень начинаешь бэкэндер и фронтэндер, учился по разным курсам в интернете и твоим видео, подтянул JS, HTML и CSS, наконец-то подвернулся вариант с работой, которую долго искал, и согласился на первый же вариант, и тут началось: рамках обучения мне дали задание сделать фулстек проект, разработать приложение для ведения реестра, с базой данных на 10 таблиц, с 15000 строк, осуществить все в laravel при помощи php, сказали: ну делай, а теперь спустя небольшое время, начинается возмущение, что я медленно делаю и ничего не успеваю, сижу просто учусь. И я не знаю, так и должно быть, и это я правда медленно развиваюсь или все же должна быть какая-то помощь? Очень интересно твое мнение, буду рад, если ты ответишь, заранее больше спасибо P.s. я тоже закончил РТУ МИРЭА в 2021)

  • @skobanev
    @skobanev9 күн бұрын

    Добрый день. Спасибо Вам огромное. А существует курс по TS для новичков в Вашем формате? Вы просто идеально информацию преподносите.

  • @user-rn1th5om2u
    @user-rn1th5om2u Жыл бұрын

    формат огонь. можно ли погрузиться глубже в дженерики с след видео ?

  • @riendlyf
    @riendlyf Жыл бұрын

    Вот это супер было !!!!

  • @ruslangilyazov7733
    @ruslangilyazov77337 ай бұрын

    Больше type script & react & redux, please! Я знаю что есть много на канале про это но еще хочется

  • @alexsandrkalenichenko5599
    @alexsandrkalenichenko5599 Жыл бұрын

    Круто! давай еще

  • @JenechekDv
    @JenechekDv Жыл бұрын

    стильно, модно, молодёжно. Давай ещё.

  • @abdurazzoxabdullayev3705
    @abdurazzoxabdullayev3705 Жыл бұрын

    Было бы хорошо если сделал видосики как Michigan TypeScript по ts

  • @abdurazzoxabdullayev3705

    @abdurazzoxabdullayev3705

    Жыл бұрын

    Атак все твои видео прям топпп!!!

  • @NikOroferov
    @NikOroferov Жыл бұрын

    Контент зашёл, даю знать

  • @vanmihaylovich
    @vanmihaylovich Жыл бұрын

    Видео о том, как обойти грабли TS.

  • @dontcode

    @dontcode

    Жыл бұрын

    Тс и есть грабля, поверх джаваскрипта)

  • @macmasek

    @macmasek

    Жыл бұрын

    Шаг 1: перестаньте использовать Typescript

  • @dannysas8460
    @dannysas8460 Жыл бұрын

    Спасибо

  • @dimabaturo2492
    @dimabaturo2492 Жыл бұрын

    Как обычно контент в кайф

  • @ValentinProtasevich
    @ValentinProtasevich Жыл бұрын

    спасибо!

  • @user-hb2vj1hh4o
    @user-hb2vj1hh4o Жыл бұрын

    Годнота!🎉

  • @user-lg3uy2lx9h
    @user-lg3uy2lx9h Жыл бұрын

    да/ интересно конечно)

  • @GPTalksZone
    @GPTalksZone Жыл бұрын

    Батя, контент топчик, наваливай ещё! 1.5 года работаю с TS. Дофига нового)

  • @tojiboyevumidjon
    @tojiboyevumidjon Жыл бұрын

    Спасибо большое! Боже я только что узнал то что я зря мучился целый день

Келесі