Complete TypeScript course in an hour | Typescript for beginners

  Рет қаралды 98,588

RED Group

RED Group

Күн бұрын

💎 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 🔔

Пікірлер: 280
@REDGroup
@REDGroup Ай бұрын
Версия 2024 - kzfaq.info/get/bejne/b8hzodqBvKmVdoU.html
@trust6077
@trust6077 Жыл бұрын
Все усилия рано или поздно окупаются. Очень ценю те курсы которые ты выпускаешь на Ютуб канале. Все доступно и очень сильные знания предоставляешь бесплатно, спасибо большое ❤
@mur4ever
@mur4ever Жыл бұрын
Благодарю за бесплатный материал! Он был очень полезен и профессионально подготовлен. Спасибо!
@ximik6452
@ximik6452 Жыл бұрын
Круто! Давно хотел увидеть курс по тайпскрипту в твоём исполнении
@user-rg1bz1jx8p
@user-rg1bz1jx8p Жыл бұрын
Спасибо за то что рассказал про типизацию реакта и дал ресурсы где более подробно описана его типизация
@elixzez
@elixzez Жыл бұрын
Спасибо за такой материал ! Ждем еще больше годного контента ! 😇
@ruwz
@ruwz Жыл бұрын
Автор, огромный тебе респект! Обожаю твои видосы, очень много полезной информации! Очень люблю полные курсы и крупные проекты!
@ni4egonepridumal
@ni4egonepridumal Жыл бұрын
Много проделано полезной работы, спасибо за твой труд !
@MuhTimur
@MuhTimur Жыл бұрын
Классные ролики, удобно и можно быстро вспомнить теорию перед собеседованием
@snejochekvlogs3189
@snejochekvlogs3189 11 ай бұрын
Первая обучалка, которую я посмотрела на скорости *1 - зачитываешь, как Эминем)))
@hiItIsDaria
@hiItIsDaria 10 ай бұрын
Спасибо большое за ролики! 😊 Очень нравится, как всё структурировано, прям на одном дыхании смотрю)) Ваши усилия заметны и я искренне ценю это. Продолжайте в том же духе, ребята! Держите мотивацию, потому что у вас тут целая армия фанатов! Ждём новых шедевров от вас! 👍🎉
@REDGroup
@REDGroup 10 ай бұрын
Спасибо, Даша! 🚀
@Jake58031
@Jake58031 Жыл бұрын
Спасибо большое за контент который вы делаете для нас!
@olegsozonik94
@olegsozonik94 Жыл бұрын
Все доступно и очень сильные знания предоставляешь бесплатно, спасибо большое ❤
@Lloyd2281
@Lloyd2281 Жыл бұрын
Отличное видео, благодарю Макс!!!
@REDGroup
@REDGroup Жыл бұрын
Спасибо за 2000 лайков! Новому курсу быть 🔥
@lovelyboy8056
@lovelyboy8056 Жыл бұрын
Отличный урок Макс, успехов!
@twentythe1st
@twentythe1st 9 ай бұрын
Спасибо, все детально разобрано и передано, очень информативно и полезно!
@_zubokryl_
@_zubokryl_ Жыл бұрын
Буду рада полному курсу!! И любым другим от Вас. Вы хорошо объясняете. Спасибо!
@sailoks8411
@sailoks8411 Жыл бұрын
Спасибо за Вашу работу!
@user-ep4ty4mj3r
@user-ep4ty4mj3r 4 ай бұрын
Отличный курс, все емко и крайне полезно, до этого смотрел другой курс и твой помог разложить и устаканить базовое понимание TS.
@user-fo2nu8nv7w
@user-fo2nu8nv7w Жыл бұрын
Спасибо за ваши старания!
@TheWorldPeace
@TheWorldPeace Жыл бұрын
Братан харош, курс в кайф. Спасибо большое!
@user-wq6vf9qo2h
@user-wq6vf9qo2h Жыл бұрын
Благодарю, все по делу!
@vlladimirr21
@vlladimirr21 Жыл бұрын
Максим! Спасибо за видео! Урок получился очень хорошим! Все четко : вопрос - далее Ответ)
@awwwesoman
@awwwesoman Жыл бұрын
Видео понравилось, лайк прожал, надеюсь наберем 2к и будут выходить новые курсы, это нужный формат и у тебя он хорошо получается 👍
@REDGroup
@REDGroup Жыл бұрын
💎 Оформить премиум подписку - htmllessons.ru/premium 🎁 Розыгрыш в ТГ - t.me/redgroupchannel Надеюсь Вы оцените мои старания, с Вас лайк и подписка. 🔥 2000 лайков и я продолжаю рубрику полных курсов. Если есть какие то вопросы по этой теме - дай знать в 💬 комментариях!
@narzullayev_developer
@narzullayev_developer Жыл бұрын
Мир вам! Бро, я хотел спросить тебя об одном. Где вы выучили javascript? от удемы или самообучения? Где ты научился бэкенду?
@REDGroup
@REDGroup Жыл бұрын
Все учил сам, тупо делая проекты. У меня большой стаж разработки проектов, наверно поэтому каждый раз по кусочку собирался мой опыт и знания
@narzullayev_developer
@narzullayev_developer Жыл бұрын
@@REDGroup Какой у тебя уровень? Средний или старший? Нужны ли вам математика и кодовые войны, чтобы стать фронтенд-разработчиком? Вы изучали алгоритмы и структуры данных в JavaScript?
@REDGroup
@REDGroup Жыл бұрын
Математика не нужна. Теорию никогда не учил, не люблю это. Люблю разрабатывать проекты. Уровень upper middle. Но некоторые говорят что senior.
@narzullayev_developer
@narzullayev_developer Жыл бұрын
@@REDGroup Да, так что вы учитесь, делая проект! Вы совсем не смотрели видео урок?
@1akai1k
@1akai1k Жыл бұрын
Здорово 👍, полный курс по тс вышел, осталось сделать практику практику используя ts
@REDGroup
@REDGroup Жыл бұрын
Гляньте на канале Amazon 2.0
@user-hz5vm9tn8n
@user-hz5vm9tn8n 4 ай бұрын
Красиво, качественно, по делу. Спасибо! Тяжеловато конечно с быстрой речью, но никто не запрещает перемотать назад и прослушать для понимания еще раз.
@whitespace2925
@whitespace2925 Жыл бұрын
спасибо братуха ) отличный курс
@user-wd3tl2rx9p
@user-wd3tl2rx9p Жыл бұрын
Отличный курс по TypeScript ) Максим, важна дистанция )
@user-ry4gk1kb1h
@user-ry4gk1kb1h Жыл бұрын
До этого ролика в моей жизни было всё отлично
@di0kGG
@di0kGG Жыл бұрын
До тс было всё отлично😂
@Kaputishka
@Kaputishka 11 ай бұрын
До момента пока мне не сказали, что в новой платформе вместо c# нужно будет программировать на ts, у меня тоже все было отлично(((
@user-ry4gk1kb1h
@user-ry4gk1kb1h 11 ай бұрын
@@Kaputishka так с# типизировный, разве нет?
@Kaputishka
@Kaputishka 11 ай бұрын
@@user-ry4gk1kb1h да, типизированный. Меня не типизация смущает, а то, что нужно учить еще один новый язык, еще и фронтендный.
@gagarin6580
@gagarin6580 10 ай бұрын
​@@user-ry4gk1kb1hда, типизированный
@_GreenSnake_
@_GreenSnake_ Жыл бұрын
Спасибо за Ваш труд
@paroletatel
@paroletatel Жыл бұрын
Очень крутое видео! Ещё не смотрел, но по содержанию - конфетка
@user-hw3co1xx4c
@user-hw3co1xx4c 10 ай бұрын
Спасибо , ща глянем
@Xtemple135
@Xtemple135 5 ай бұрын
Пасиба, готовлюсь к собесам и твое видео прям отличный способ освежить знания!
@user-br6nj4gn6q
@user-br6nj4gn6q 10 ай бұрын
Большое спасибо за Ваше видео!
@user-jh8oq4uw6e
@user-jh8oq4uw6e Жыл бұрын
Да, запишите пожалуйста курсы по эти новым темам! React и другие фишки !!!
@user-ng8nn9em4t
@user-ng8nn9em4t Жыл бұрын
Спасибо за твои труды
@Serhii_lolovich
@Serhii_lolovich Жыл бұрын
ts в связке с ректом очень интересная тема, лайк
@reze1337
@reze1337 Жыл бұрын
Супер!! Жду курс по tanstack query
@user-yf2er5vr8q
@user-yf2er5vr8q Жыл бұрын
супер спасибо быстро и ясно
@andreinov5642
@andreinov5642 Жыл бұрын
Спасибо. Супер !!!!
@babyzonechanell
@babyzonechanell Жыл бұрын
Спасибо большое я как раз хотел прейти в Ts курс очень понятный и еффективный рекомендую всем
@gywen
@gywen Жыл бұрын
Спасибо за контент 😊
@nikolassmakovsky4032
@nikolassmakovsky4032 Жыл бұрын
Макс, лучший, спасибо! P.S. Сам TS знаю, но для новичков это просто шикарный курс!
@Evgeniy-pro
@Evgeniy-pro Жыл бұрын
Спасибо за видео)
@devcodingitstudio2764
@devcodingitstudio2764 Жыл бұрын
Топчик. Как всегда на высоте!
@ArtemMindsurfer
@ArtemMindsurfer 8 ай бұрын
что может быть лучше чем проснуться с утреца в воскресенье и досмотреть такой информативный ролик?)
@RewCSharp
@RewCSharp 8 ай бұрын
Спасибо за урок!
@ivanpost4079
@ivanpost4079 11 ай бұрын
Большое спасибо за Ваше видео! Отличная, просто бесценная информация в бесплатном доступе... Вау! Спасибо за Ваш труд и Ваше время))
@REDGroup
@REDGroup 11 ай бұрын
Пожалуйста
@laza1961
@laza1961 3 ай бұрын
Благодарю за бесплатный материал! Он был очень полезен и профессионально подготовлен. Спасибо! 💯
@_SPIRICH_
@_SPIRICH_ Жыл бұрын
Спасибо за видео
@user-yr5gb8tl4x
@user-yr5gb8tl4x 11 ай бұрын
Спасибо большое))
@ruslangilyazov7733
@ruslangilyazov7733 6 ай бұрын
Спасибо большое за ролики!
@user-ks5bg9ni4p
@user-ks5bg9ni4p Жыл бұрын
Css модули не работают с TS, что делать? Cannot find module './Single.module.css' or its corresponding type declarations.
@haibova_irisha
@haibova_irisha Жыл бұрын
класс , очередное полезное видео !
@user-wl1vk6zr1c
@user-wl1vk6zr1c 28 күн бұрын
Отлично прочитано!
@etemax
@etemax Жыл бұрын
от души за видос, бро
@domikpriklyocheniu3611
@domikpriklyocheniu3611 9 ай бұрын
есть пет проект который положил в резюме стоить переделать на тайпскрипт + реакт с просто реакт?
@user-ze5tp3gu9q
@user-ze5tp3gu9q 2 ай бұрын
все оптимально и по делу. зашло
@khannanov2
@khannanov2 10 ай бұрын
Спасибо!
@user-zw6bd5wo6t
@user-zw6bd5wo6t Жыл бұрын
Как сделать так, чтобы я нажимал на строку, в которой ошибка и мне показывался текст ошибки? У меня в vscode ничего не происходит
@vovik815
@vovik815 11 ай бұрын
Спасибо за курс
@user-iw7wr5yk1d
@user-iw7wr5yk1d Жыл бұрын
спасибо за урок всё очень была круто продолжай в том же духе )
@user-iw7wr5yk1d
@user-iw7wr5yk1d Жыл бұрын
я просто уже 3 раз смотрю этот ролик с каждым разом всё яснее )
@JazkiPlay
@JazkiPlay Жыл бұрын
*Очень круто объясняешь, сразу понимаю суть. До этого 2 видосика по TS просмотрел и не все понял, а тут прям разнос )) Спасибо за такой видос! Продолжай в том же духе, контент прям дикий. TS изучаю сейчас и хочу больше его видеть.*
@user-ep8md8vs7j
@user-ep8md8vs7j Жыл бұрын
Макс вы МОЛОДЦЫ. продолжайте в том же духе. с нас лайк подписка и ком
@alexeline473
@alexeline473 9 ай бұрын
но внутри кортежа можно использовать спред оператор, и как тогда он себя поведёт?
@AlexGabber
@AlexGabber Жыл бұрын
Как всегда лайк :) Но немножечко озвучу критики со своего бока. В целом сталкивался почти со всем, парочку приемов подхватил, со всем согласен, контент очень крутой. Но с декораторами ты не разобрался, я и сам в них вскользь совсем, но то что я знаю, в 5 версии тс как раз их серьезно переработали (если мне память не изменяет). Ну а в целом, максимально сжатый и полезный курс по тс, такого мне не хватало на старте. Те, кто только начинает свой путь в тс, это отличное пособие.
@REDGroup
@REDGroup Жыл бұрын
Да, я не изучал 5 версию. Я писал декораторы как обычно их пишу
@user-zc2op2db8z
@user-zc2op2db8z Жыл бұрын
Огромное спасибо
@user-kb4le4me2d
@user-kb4le4me2d 3 ай бұрын
Спасибо за видео, толковые объяснения. Только мне как новичку высокий темп
@Ksen14
@Ksen14 Жыл бұрын
Спасибо за годное видео
@moviequotesproduction
@moviequotesproduction Жыл бұрын
Круто и спасибо
@markcoderss
@markcoderss Жыл бұрын
искал два дня нормальный курс, и вот курс сам меня нашёл:)
@REDGroup
@REDGroup Жыл бұрын
Добро пожаловать!
@meiranuarbekov8737
@meiranuarbekov8737 Жыл бұрын
Топ видео, качество 🔥
@user-wu3vq1mb1g
@user-wu3vq1mb1g 11 ай бұрын
Отличный урок, спасибо за тру
@ali_mov_f
@ali_mov_f Жыл бұрын
брат спасибо за твой труд мы будем тебя поддерживать)
@REDGroup
@REDGroup Жыл бұрын
Спасибо
@zohidmustafoyev2448
@zohidmustafoyev2448 Жыл бұрын
спасибо тебе и твоей команде
@REDGroup
@REDGroup Жыл бұрын
Пожалуйста
@user-mh6jz7jo8k
@user-mh6jz7jo8k Жыл бұрын
чувакк! твои видосы неплохо заходят! продолжай!
@REDGroup
@REDGroup Жыл бұрын
Отлично!
@sarxanabdullayev6440
@sarxanabdullayev6440 6 ай бұрын
Спасибо за урок
@hitahita2342
@hitahita2342 Жыл бұрын
проблема с типами в нативном js отчасти решается хорошей ide с анализом кода, типа webstorm'а. хотя конечно далеко не на том же уровне что в ts
@user-lf9xi8gn8x
@user-lf9xi8gn8x Жыл бұрын
🔥🔥🔥 крутой выпуск
@user-zg4ef9in6s
@user-zg4ef9in6s 3 ай бұрын
спасибо за контент:) лайк, подписка, комментарий)
@darad2759
@darad2759 Жыл бұрын
Курс просто🔥🔥🔥
@anyway_a
@anyway_a Жыл бұрын
За ts правда спасибо 👍
@focusedzed
@focusedzed Жыл бұрын
В ролике не увидел, но полезно знать. Кортежи, которые не помечены как readonly, или которые не имеют as const - нормально реагируют на push. То есть мы можем запушить в кортеж что угодно. Но при этом, если мы попытаемся воспользоваться запушенным значением, то TS скажет, что длина как бы осталась неизменной. Таким образом объект будет присутствовать в кортеже, но с ним ничего нельзя будет делать. Поэтому по возможности пробрасывайте readonly или as const)
@focusedzed
@focusedzed Жыл бұрын
Ещё если развернуть rest-оператор конкретного типа и пушить в кортеж. То TS проигнорирует входной тип. И можно будет пушить сколько угодно и что угодно. С этим тоже следует быть аккуратным.
@user-em4nd2vk8c
@user-em4nd2vk8c Жыл бұрын
Спасибо
@EuegenTv
@EuegenTv Ай бұрын
Без тайп скрипта можно документировать код например при помощи js doc ) На мой взягд проблема, которую вносит ТС в проекты это то, что типы зачастую начинают иметь свою сложную логику, что повышает порог входа в проекты написаные на ТС. Но в целом ТС хороший инструмент для документирования кода, если не выдумывать велосипеды с типизацией.
@ivangorbynov3044
@ivangorbynov3044 Жыл бұрын
Спасибо большое за ваш контент
@REDGroup
@REDGroup Жыл бұрын
Пожалуйста
@thefact4529
@thefact4529 Жыл бұрын
great work
@user-ql6md1eh4h
@user-ql6md1eh4h 9 ай бұрын
Coooool. Thanks
@user-xp8gn7cm4e
@user-xp8gn7cm4e Жыл бұрын
вперед Спасибо)))
@SplinterCellGoGo
@SplinterCellGoGo Жыл бұрын
Крутое видео! Больше лайков)))
@racman9964
@racman9964 6 ай бұрын
Мужик, красавчик! Спасибо тебе большое. Повторил теорию быстро благодаря тебе
@REDGroup
@REDGroup 6 ай бұрын
Пожалуйста 🙏
@user-gg7cg7gz9o
@user-gg7cg7gz9o 2 ай бұрын
бро спасибо за курс !!!! ты мощь !!! еще такой вопрос,какая тема в vs code стоит у тебя. ?)) у тебя всегда какие то вкусняшки )))
@REDGroup
@REDGroup 2 ай бұрын
Обычно в описании пишу
@azizoid
@azizoid Жыл бұрын
1:01:00 я иногда использую useState() тогда он автоматически number | undefiled
@smykoil
@smykoil Жыл бұрын
T - type.. Поэтому T и пишут.. Но если типов больше одного или вы можете как-то уточнить, как этот тип будет использоваться, нужно не просто букву писать, а название типа. Как и над названиями пропсов в функциях, над ними стоит подумать.. Названия - очень важно.. Самый простой пример:
@user-jb3bd5zz9g
@user-jb3bd5zz9g Жыл бұрын
Looking forward to the course on react query
@lucian8118
@lucian8118 Жыл бұрын
Reduxtoolkit query is already on this channel,last video if im not mistaken
@user-jb3bd5zz9g
@user-jb3bd5zz9g Жыл бұрын
@@lucian8118 redux yes is no react query
@user-oe9wl1zq4o
@user-oe9wl1zq4o 3 ай бұрын
Можно как и в случае с "... arr: string[] ..." и "... arr: Array ..." вместо "... arr: ReadonlyArray ..." писать "... arr: readonly string[] ...", и не только с массивами.
@user-kb5kd7ln3h
@user-kb5kd7ln3h Жыл бұрын
По React Quеry было бы просто шикарно)))
@kara3744
@kara3744 Жыл бұрын
Привет, Макс. В некоторых видео я видел что лучше не писать I prefix в интерфейсах, да и в инете погуглил, что лучше не писать, и в тс самом пишут лучше так не делать. Что скажешь по этому поводу?
@REDGroup
@REDGroup Жыл бұрын
Привет, почему? Что там пишут в интернете
@kara3744
@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
@REDGroup Жыл бұрын
Так а кто это говорит. В каждом проекте свои правила, никакого анти паттерна тут точно нет. Это конвенция которая у каждой команды своя.
@kara3744
@kara3744 Жыл бұрын
@@REDGroup okay
Я обещал подарить ему самокат!
01:00
Vlad Samokatchik
Рет қаралды 3,3 МЛН
Heartwarming Unity at School Event #shorts
00:19
Fabiosa Stories
Рет қаралды 22 МЛН
Clown takes blame for missing candy 🍬🤣 #shorts
00:49
Yoeslan
Рет қаралды 41 МЛН
Почему я закрыл веб студию?
15:39
RED Group
Рет қаралды 12 М.
React + GSAP | Базовые анимации
8:19
Типичный Веб Разработчик
Рет қаралды 3 М.
Что такое TypeScript?
5:28
Merion Academy
Рет қаралды 29 М.
ПЕЧАЛЬНОЕ БУДУЩЕЕ NEXT JS
9:02
RED Group
Рет қаралды 18 М.
TypeScript - Быстрый Курс за 70 минут
1:08:00
Владилен Минин
Рет қаралды 628 М.
AWS Certified Cloud Practitioner Training 2020 - Full Course
3:58:01
freeCodeCamp.org
Рет қаралды 5 МЛН
React и Next js убивают фронтенд!
9:11
Миша Ларченко
Рет қаралды 47 М.
Я обещал подарить ему самокат!
01:00
Vlad Samokatchik
Рет қаралды 3,3 МЛН