Complete TypeScript course in an hour | Typescript for beginners

💎 Get a premium subscription - htmllessons.ru/premium?...
❤️ Reviews here - t.me/htmllessons_reviews
🎁 Draw in TG - t.me/redgroupchannel
New big video on the channel, today I'm posting the complete Typescript course for beginners. This material will allow you to learn Typescript in an hour from scratch (only knowledge of JavaScript is important). Count it as 20 TS lessons in one video. Last time I did a quick course on TypeScript, but it wasn't complete. I will also answer some of the questions that are encountered at the interview for the Junior Front-end developer. We can say this is a fundamental course in TypeScript from A to Z. Enjoy watching!
I hope you appreciate my efforts, please like and subscribe. 🔥 2000 likes and I continue the rubric of full courses.
If you have any questions about this topic - let me know in the comments!
Download 🖥 project folder - htmllessons.ru/storage#storag...
⚡️ List of intensives by subscription - htmllessons.ru/list-intensive...
🍥 Theme to Editor/IDE - Ayu Mirage Theme, font Iosevka
👉 Useful links from the video:
Complete course on React - • Полный курс React JS д...
Full course on Next.js - • Полный курс по Next js...
Full course on Redux + RTK Query - • Полный курс Redux Tool...
Rutube 2.0 - • 🚀 RUTUBE и ТОЧКА. Разр...
00:00:00 - Entry
00:00:10 - What will be in this video
00:02:50 - Installing and configuring TypeScript
00:06:40 - tsconfig.json config file
00:08:50 - Basic types
00:10:14 - Structure of objects
00:17:06 - Arrays
00:18:56 - Tuples
00:20:00 - Functions and their types
00:22:55 - Rest parameters and types
00:23:18 - Functional overloads
00:25:20 - Classes and types
00:29:18 - Interfaces
00:30:00 - Types vs. Interfaces
00:31:58 - Enum and its types
00:35:12 - Assertions
00:37:11 - Generic
00:45:22 - Type utilities
00:50:55 - Decorators
00:54:27 - Extended types
00:57:14 - React and TypeScript
00:58:30 - Creating components with TypeScript
00:59:45 - Event typing (e.g. onClick, onChange)
01:00:40 - Using Hooks and their types (useState)
01:01:17 - Where to see the full typing of React, Redux, Next.js
01:01:37 - How strongly do you need to type?
01:02:29 - If TS doesn't swear, should it be typed?
01:04:13 - Tips for further learning TypeScript
#TypeScript #TypeScript #TS #RedGroup
💡 Personal TG channel - t.me/hardmaxchannel
👉 All links (+ editor setting) and information about me - redlinks.tech/
Watch the video UNTIL THE END, subscribe to the channel, put 👍 and the bell 🔔

[@REDGroup]

Спасибо за 2000 лайков! Новому курсу быть 🔥

[@trust6077]

Все усилия рано или поздно окупаются. Очень ценю те курсы которые ты выпускаешь на Ютуб канале. Все доступно и очень сильные знания предоставляешь бесплатно, спасибо большое ❤

[@mur4ever]

Благодарю за бесплатный материал! Он был очень полезен и профессионально подготовлен. Спасибо!

[@snejochekvlogs3189]

Первая обучалка, которую я посмотрела на скорости *1 - зачитываешь, как Эминем)))

[@user-ry4gk1kb1h]

До этого ролика в моей жизни было всё отлично

[@di0kGG]

До тс было всё отлично😂

[@Kaputishka]

До момента пока мне не сказали, что в новой платформе вместо c# нужно будет программировать на ts, у меня тоже все было отлично(((

[@user-ry4gk1kb1h]

@@Kaputishka так с# типизировный, разве нет?

[@Kaputishka]

@@user-ry4gk1kb1h да, типизированный. Меня не типизация смущает, а то, что нужно учить еще один новый язык, еще и фронтендный.

[@gagarin6580]

​@@user-ry4gk1kb1hда, типизированный

[@ximik6452]

Круто! Давно хотел увидеть курс по тайпскрипту в твоём исполнении

[@ruwz]

Автор, огромный тебе респект! Обожаю твои видосы, очень много полезной информации! Очень люблю полные курсы и крупные проекты!

[@user-rg1bz1jx8p]

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

[@ni4egonepridumal]

Много проделано полезной работы, спасибо за твой труд !

[@MuhTimur]

Классные ролики, удобно и можно быстро вспомнить теорию перед собеседованием

[@elixzez]

Спасибо за такой материал ! Ждем еще больше годного контента ! 😇

[@olegsozonik94]

Все доступно и очень сильные знания предоставляешь бесплатно, спасибо большое ❤

[@hiItIsDaria]

Спасибо большое за ролики! 😊 Очень нравится, как всё структурировано, прям на одном дыхании смотрю)) Ваши усилия заметны и я искренне ценю это. Продолжайте в том же духе, ребята! Держите мотивацию, потому что у вас тут целая армия фанатов! Ждём новых шедевров от вас! 👍🎉

[@REDGroup]

Спасибо, Даша! 🚀

[@FredZirov]

Спасибо большое за контент который вы делаете для нас!

[@_zubokryl_]

Буду рада полному курсу!! И любым другим от Вас. Вы хорошо объясняете. Спасибо!

[@lovelyboy8056]

Отличный урок Макс, успехов!

[@twentythe1st]

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

[@vlladimirr21]

Максим! Спасибо за видео! Урок получился очень хорошим! Все четко : вопрос - далее Ответ)

[@sailoks8411]

Спасибо за Вашу работу!

[@user-hz5vm9tn8n]

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

[@paroletatel]

Очень крутое видео! Ещё не смотрел, но по содержанию - конфетка

[@Lloyd2281]

Отличное видео, благодарю Макс!!!

[@nikolassmakovsky4032]

Макс, лучший, спасибо! P.S. Сам TS знаю, но для новичков это просто шикарный курс!

[@user-fo2nu8nv7w]

Спасибо за ваши старания!

[@user-wd3tl2rx9p]

Отличный курс по TypeScript ) Максим, важна дистанция )

[@_GreenSnake_]

Спасибо за Ваш труд

[@awwwesoman]

Видео понравилось, лайк прожал, надеюсь наберем 2к и будут выходить новые курсы, это нужный формат и у тебя он хорошо получается 👍

[@user-ep4ty4mj3r]

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

[@user-zq1vt4hb8p]

Здорово 👍, полный курс по тс вышел, осталось сделать практику практику используя ts

[@REDGroup]

Гляньте на канале Amazon 2.0

[@Xtemple135]

Пасиба, готовлюсь к собесам и твое видео прям отличный способ освежить знания!

[@ArtemMindsurfer]

что может быть лучше чем проснуться с утреца в воскресенье и досмотреть такой информативный ролик?)

[@user-jh8oq4uw6e]

Да, запишите пожалуйста курсы по эти новым темам! React и другие фишки !!!

[@Serhii_lolovich]

ts в связке с ректом очень интересная тема, лайк

[@TheWorldPeace]

Братан харош, курс в кайф. Спасибо большое!

[@ivanpost4079]

Большое спасибо за Ваше видео! Отличная, просто бесценная информация в бесплатном доступе... Вау! Спасибо за Ваш труд и Ваше время))

[@REDGroup]

Пожалуйста

[@user-wq6vf9qo2h]

Благодарю, все по делу!

[@user-oe9wl1zq4o]

Можно как и в случае с "... arr: string[] ..." и "... arr: Array ..." вместо "... arr: ReadonlyArray ..." писать "... arr: readonly string[] ...", и не только с массивами.

[@sofyap.2153]

Полезное видео) один ньюанс - обычное подобные уроки смотрю в 2Х, но тут даже возникло желание сделать 0.5🤔

[@Wunderwaffe2333]

by me too

[@babyzonechanell]

Спасибо большое я как раз хотел прейти в Ts курс очень понятный и еффективный рекомендую всем

[@whitespace2925]

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

[@user-ng8nn9em4t]

Спасибо за твои труды

[@REDGroup]

💎 Оформить премиум подписку - htmllessons.ru/premium 🎁 Розыгрыш в ТГ - t.me/redgroupchannel Надеюсь Вы оцените мои старания, с Вас лайк и подписка. 🔥 2000 лайков и я продолжаю рубрику полных курсов. Если есть какие то вопросы по этой теме - дай знать в 💬 комментариях!

[@narzullayev_developer]

Мир вам! Бро, я хотел спросить тебя об одном. Где вы выучили javascript? от удемы или самообучения? Где ты научился бэкенду?

[@REDGroup]

Все учил сам, тупо делая проекты. У меня большой стаж разработки проектов, наверно поэтому каждый раз по кусочку собирался мой опыт и знания

[@narzullayev_developer]

@@REDGroup Какой у тебя уровень? Средний или старший? Нужны ли вам математика и кодовые войны, чтобы стать фронтенд-разработчиком? Вы изучали алгоритмы и структуры данных в JavaScript?

[@REDGroup]

Математика не нужна. Теорию никогда не учил, не люблю это. Люблю разрабатывать проекты. Уровень upper middle. Но некоторые говорят что senior.

[@narzullayev_developer]

@@REDGroup Да, так что вы учитесь, делая проект! Вы совсем не смотрели видео урок?

[@laza1961]

Благодарю за бесплатный материал! Он был очень полезен и профессионально подготовлен. Спасибо! 💯

[@user-kb4le4me2d]

Спасибо за видео, толковые объяснения. Только мне как новичку высокий темп

[@user-hw3co1xx4c]

Спасибо , ща глянем

[@user-br6nj4gn6q]

Большое спасибо за Ваше видео!

[@smykoil]

T - type.. Поэтому T и пишут.. Но если типов больше одного или вы можете как-то уточнить, как этот тип будет использоваться, нужно не просто букву писать, а название типа. Как и над названиями пропсов в функциях, над ними стоит подумать.. Названия - очень важно.. Самый простой пример:

[@markcoderss]

искал два дня нормальный курс, и вот курс сам меня нашёл:)

[@REDGroup]

Добро пожаловать!

[@reze1337]

Супер!! Жду курс по tanstack query

[@domikpriklyocheniu3611]

есть пет проект который положил в резюме стоить переделать на тайпскрипт + реакт с просто реакт?

[@nursultansarazhiev9821]

Разница между type и interface в том что если мы укажем 2 type с одинаковым названием будет ошибка. А с interface он соберет их в едино, то есть будет считать его как один interface

[@REDGroup]

Да, забыл упомянуть. Но это редкий случай такой практики

[@_SPIRICH_]

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

[@user-yf2er5vr8q]

супер спасибо быстро и ясно

[@gywen]

Спасибо за контент 😊

[@RewCSharp]

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

[@user-gg7cg7gz9o]

бро спасибо за курс !!!! ты мощь !!! еще такой вопрос,какая тема в vs code стоит у тебя. ?)) у тебя всегда какие то вкусняшки )))

[@REDGroup]

Обычно в описании пишу

[@andreinov5642]

Спасибо. Супер !!!!

[@AlexGabber]

Как всегда лайк :) Но немножечко озвучу критики со своего бока. В целом сталкивался почти со всем, парочку приемов подхватил, со всем согласен, контент очень крутой. Но с декораторами ты не разобрался, я и сам в них вскользь совсем, но то что я знаю, в 5 версии тс как раз их серьезно переработали (если мне память не изменяет). Ну а в целом, максимально сжатый и полезный курс по тс, такого мне не хватало на старте. Те, кто только начинает свой путь в тс, это отличное пособие.

[@REDGroup]

Да, я не изучал 5 версию. Я писал декораторы как обычно их пишу

[@ali_mov_f]

брат спасибо за твой труд мы будем тебя поддерживать)

[@REDGroup]

Спасибо

[@user-ks5bg9ni4p]

Css модули не работают с TS, что делать? Cannot find module './Single.module.css' or its corresponding type declarations.

[@user-iw7wr5yk1d]

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

[@user-iw7wr5yk1d]

я просто уже 3 раз смотрю этот ролик с каждым разом всё яснее )

[@kara3744]

Привет, Макс. В некоторых видео я видел что лучше не писать I prefix в интерфейсах, да и в инете погуглил, что лучше не писать, и в тс самом пишут лучше так не делать. Что скажешь по этому поводу?

[@REDGroup]

Привет, почему? Что там пишут в интернете

[@kara3744]

@@REDGroup Ну вот допустим: "Using the I prefix or Interface suffix for interfaces, as well as Abstract for abstract classes, is an anti-pattern. It has no place in clean code. Differentiating interface names, in fact, obscures OOP principles, introduces noise into the code, and complicates development."

[@REDGroup]

Так а кто это говорит. В каждом проекте свои правила, никакого анти паттерна тут точно нет. Это конвенция которая у каждой команды своя.

[@kara3744]

@@REDGroup okay

[@user-ep8md8vs7j]

Макс вы МОЛОДЦЫ. продолжайте в том же духе. с нас лайк подписка и ком

[@focusedzed]

В ролике не увидел, но полезно знать. Кортежи, которые не помечены как readonly, или которые не имеют as const - нормально реагируют на push. То есть мы можем запушить в кортеж что угодно. Но при этом, если мы попытаемся воспользоваться запушенным значением, то TS скажет, что длина как бы осталась неизменной. Таким образом объект будет присутствовать в кортеже, но с ним ничего нельзя будет делать. Поэтому по возможности пробрасывайте readonly или as const)

[@focusedzed]

Ещё если развернуть rest-оператор конкретного типа и пушить в кортеж. То TS проигнорирует входной тип. И можно будет пушить сколько угодно и что угодно. С этим тоже следует быть аккуратным.

[@alexeline473]

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

[@haibova_irisha]

класс , очередное полезное видео !

[@Evgeniy-pro]

Спасибо за видео)

[@racman9964]

Мужик, красавчик! Спасибо тебе большое. Повторил теорию быстро благодаря тебе

[@REDGroup]

Пожалуйста 🙏

[@user-zw6bd5wo6t]

Как сделать так, чтобы я нажимал на строку, в которой ошибка и мне показывался текст ошибки? У меня в vscode ничего не происходит

[@user-mh6jz7jo8k]

чувакк! твои видосы неплохо заходят! продолжай!

[@REDGroup]

Отлично!

[@ruslangilyazov7733]

Спасибо большое за ролики!

[@user-ub1mz5ok1r]

48:04 передайте лайк монтажеру

[@user-kb5kd7ln3h]

По React Quеry было бы просто шикарно)))

[@zohidmustafoyev2448]

спасибо тебе и твоей команде

[@REDGroup]

Пожалуйста

[@devcodingitstudio2764]

Топчик. Как всегда на высоте!

[@user-yr5gb8tl4x]

Спасибо большое))

[@vovik815]

Спасибо за курс

[@hitahita2342]

проблема с типами в нативном js отчасти решается хорошей ide с анализом кода, типа webstorm'а. хотя конечно далеко не на том же уровне что в ts

[@darad2759]

Курс просто🔥🔥🔥

[@user-zc2op2db8z]

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

[@khannanov2]

Спасибо!

[@user-wu3vq1mb1g]

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

[@sarxanabdullayev6440]

Спасибо за урок

[@Sweet-Bubaleh]

В некоторых источниках встречал, что FC уже не рекомендуется использовать при типизации ф-компонентов. Так ли это?

[@REDGroup]

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

[@zorkisak4738]

Доброго времени суток. Я новичок в этом, и хотел спросить. Без знания JS в TSе делать нечего. Я правильно понял?

[@REDGroup]

Да

[@zorkisak4738]

@@REDGroup спасибо за обратную связь 👍

[@ivangorbynov3044]

Спасибо большое за ваш контент

[@REDGroup]

Пожалуйста

[@smykoil]

Лица типов на собеседовании, когда их спросили про наследования типов, но они не досмотрели видео до 54:38 - 🗿

[@testtesste9972]

Привет, как ты разворачиваешь стрелочную функцию и приэтом он преписывает уже FC к твоей функции?

[@REDGroup]

Мои сниппеты, настройка была на канале

[@testtesste9972]

@@REDGroup Скиньте ,please

[@REDGroup]

Найдите на канале видео настройка vs code. Также в телеге в закрепах

[@JazkiPlay]

*Очень круто объясняешь, сразу понимаю суть. До этого 2 видосика по TS просмотрел и не все понял, а тут прям разнос )) Спасибо за такой видос! Продолжай в том же духе, контент прям дикий. TS изучаю сейчас и хочу больше его видеть.*

[@fred_001]

Привет. Вопрос по реакту. В 2023 процесс работы с классовыми компонентам актуален?

[@REDGroup]

Классовые компоненты не актуальны

[@fred_001]

@@REDGroup понял. Спасибо что ответил)

[@user-jb3bd5zz9g]

Looking forward to the course on react query

[@lucian8118]

Reduxtoolkit query is already on this channel,last video if im not mistaken

[@user-jb3bd5zz9g]

@@lucian8118 redux yes is no react query

[@anyway_a]

За ts правда спасибо 👍

[@user-zg4ef9in6s]

спасибо за контент:) лайк, подписка, комментарий)

[@user-iw7wr5yk1d]

спасибо за урок Макс пожалуйста чуть помедленнее объясни пожалуйста на следующих уроках )

[@REDGroup]

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

[@riseofkingdoms6183]

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

[@moviequotesproduction]

Круто и спасибо

[@daniilthegunner843]

объясни пожалуйста что за d.ts файлы, для чего они нужны, я сколько читал так и не понял.

[@REDGroup]

Декларативные файлы, я плох в теории. Я их использую для расширения типизации библиотек.

[@user-gp5zx6xu1r]

Спасибо за видео! Вопрос про магию утра, долго привыкал вставать в 5 утра?

[@REDGroup]

Первые полгода наверно

[@etemax]

от души за видос, бро

[@Ksen14]

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

[@azizoid]

1:01:00 я иногда использую useState() тогда он автоматически number | undefiled