Practical TypeScript - Course for Beginners

  Переглядів 117,785

freeCodeCamp.org

freeCodeCamp.org

День тому

Master TypeScript from basics to advanced concepts through hands-on tutorials covering type annotations, generics, data fetching, Zod library, and more, with practical challenges for effective real-world application.
Code: github.com/john-smilga/typesc...
Course developed by @CodingAddict
⭐️ Contents ⭐️
⌨️ (0:00:00) Intro, Type Annotations, Arrays
⌨️ (0:55:40) Objects and Functions
⌨️ (1:54:57) Alias and Interface
⌨️ (3:02:53) Tuples and Enums
⌨️ (3:59:10) Type Guards
⌨️ (4:31:02) Generics
⌨️ (5:10:25) Fetch Data
⌨️ (5:43:05) Classes
⌨️ (6:05:17) Tasks
⌨️ (6:47:18) React with TypeScript
🎉 Thanks to our Champion and Sponsor supporters:
👾 davthecoder
👾 jedi-or-sith
👾 南宮千影
👾 Agustín Kussrow
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Justin Hual
👾 Otis Morgan
👾 Oscar Rahnama
--
Learn to code for free and get a developer job: www.freecodecamp.org
Read hundreds of articles on programming: freecodecamp.org/news

КОМЕНТАРІ: 100
@tusharghildiyal6814
@tusharghildiyal6814 Місяць тому
i love how john just uploads a big chunk of his paid courses on youtube for free. been following him since 2019. i have bought his react and node courses on udemy. such a selfless man 🔥
@imdtap1448
@imdtap1448 Місяць тому
Same...He's hella cool. His teaching is clear and concise
@hellokevin_133
@hellokevin_133 Місяць тому
He's the absolute worst lol
@yashjainme
@yashjainme Місяць тому
@@hellokevin_133 why do you think he is worst 😕?
@ajaymishra-jg2qe
@ajaymishra-jg2qe 24 дні тому
This is just for marketing bro
@hammedadeleke7798
@hammedadeleke7798 Місяць тому
I just landed a job that requires typescript experience and this course came at the right time
@thej_
@thej_ Місяць тому
You don't know how much i need this course right at this moment. FCC you are a saviour for me
@nasiffuad292
@nasiffuad292 Місяць тому
Same here xD
@Booyamakashi
@Booyamakashi Місяць тому
Me too, me too.
@kaziprosper2229
@kaziprosper2229 Місяць тому
John is an awesome Teacher. When I set to learn Nodejs, I watch his videos and that has extremely helped me! Thank John, for the good work
@khantanoliggg
@khantanoliggg Місяць тому
From yesterday night I was looking for typescript courses that could cover all the fundamentals and intermediate concepts and today I got this gem. THANK YOU XD
@firstlastcode
@firstlastcode Місяць тому
I love how you explain every concept bit by bit. I have followed and learned a lot of content from you, and today I'm better SE. Thank you and the freecodecamp community
@codesinger-zc3bm
@codesinger-zc3bm Місяць тому
Started learning Typescript last week and the ones I have seen aren't this detailed. I hope to learn alot from this
@thedevelopermind
@thedevelopermind Місяць тому
John is a great teacher.
@Booyamakashi
@Booyamakashi 26 днів тому
This is pure gold. Im going to watch it couple of times. I recommend to pause and do challenges before watching the answer - it makes learning better. PS. There is custom speed setting on youtube, you can run videos at 1.1x for example.
@ViniciusEmprego
@ViniciusEmprego 14 днів тому
That course is perfect! He explains everything so well
@sherazakrampro8099
@sherazakrampro8099 Місяць тому
I really needed this course. Thank you so much ❤
@eacardenase
@eacardenase Місяць тому
I learned programming with John back in 2021, and that helped landed me a job as a web developer that year. He's an absolute beast on his own.
@shahirantalukdar2387
@shahirantalukdar2387 Місяць тому
Are you from CS background ?
@eacardenase
@eacardenase Місяць тому
@@shahirantalukdar2387 no, I was a psychologist.
@eacardenase
@eacardenase Місяць тому
@@shahirantalukdar2387 I'm a psychologist that switched career to software development.
@jamielujan5640
@jamielujan5640 11 днів тому
Just finished the 10 hour batch here. Great stuff and incredibly clear and helpful. You really do learn javascript so much better once you get the hang of typescript. Looking forward to repeating some of the challenges a few times. Thanks a ton.
@fluxsiarski
@fluxsiarski 12 годин тому
I finally finished it! It took me 1 month [ about 1 hour each day ]. Some people say the host voice is bad, but for me it wasn't a problem. #Stillgood
@CasualCosta
@CasualCosta Місяць тому
Just what I needed. Thank you, John! Thank you, FCC!
@th3ja
@th3ja 11 днів тому
Top notch content and instructor! Awesome as always FCC!
@AyushmaansinghxX
@AyushmaansinghxX Місяць тому
I was about to start learning typescript from tomorrow and here you dropped this gem ❤
@khantanoliggg
@khantanoliggg Місяць тому
Me too
@marketdilemma
@marketdilemma Місяць тому
They read your mind, 😂
@marketdilemma
@marketdilemma Місяць тому
@FreeCodeAcademy , have make an algo with ts to read there subscriber mind
@akshaykumar-xu2be
@akshaykumar-xu2be Місяць тому
Looking for a good full course and there it is.. What a timing.
@vytenisumbrasas3524
@vytenisumbrasas3524 29 днів тому
Thank you for the nice course. Enjoyed fine narrator diction and tempo.
@zamsosam
@zamsosam Місяць тому
This man is legend
@BlastbeaterPT
@BlastbeaterPT Місяць тому
The Goat Smilga ❤
@AbhishekTiwari-cf8sp
@AbhishekTiwari-cf8sp Місяць тому
Finally my wait is over. Hey Brad(TM) it's you as a instructor 😂❤
@indrakhatiwada9860
@indrakhatiwada9860 Місяць тому
No it's john
@raksalim5860
@raksalim5860 Місяць тому
you sir. are a god
@oreyon9514
@oreyon9514 Місяць тому
Man, john smilga is really good teacher for me. His method is easy to follow up.
@_stanlymathai
@_stanlymathai Місяць тому
And who the F are you?
@oreyon9514
@oreyon9514 Місяць тому
just a student
@3polygons
@3polygons Місяць тому
Thank you!!
@serial_coder
@serial_coder Місяць тому
I just recognized him with his voice. My favorite Js/Node teacher John Smilga.
@alexref955
@alexref955 Місяць тому
What’s wrong with his voice? I remember speaking him normally
@serial_coder
@serial_coder Місяць тому
I think he is high on drugs.
@firstlastcode
@firstlastcode Місяць тому
My favorite instructor is here
@gregfredder8645
@gregfredder8645 Місяць тому
I love John Smilga
@DarkGT
@DarkGT Місяць тому
My boss wants me to learn it at some point for writing test cases. Wish me luck.
@themountains1701
@themountains1701 Місяць тому
# ⭐ Contents ⭐ ## ⌨ Intro, Type Annotations, Arrays - (0:00:00) ## ⌨ Objects and Functions - (0:55:40) ## ⌨ Alias and Interface - (1:54:57) ## ⌨ Tuples and Enums - (3:02:53) ## ⌨ Type Guards - (3:59:10) ## ⌨ Generics - (4:31:02) ## ⌨ Fetch Data - (5:10:25) ## ⌨ Classes - (5:43:05) ## ⌨ Tasks - (6:05:17) ## ⌨ React with TypeScript - (6:47:18) #### ⌨ Component returns in React - (6:55:35) #### ⌨ Props - (7:00:15) #### ⌨ State - (7:12:57) #### ⌨ Handling events in React - (7:24:45) #### ⌨ TypeScript with ContextAPI - (7:57:40) #### ⌨ TypeScript with useReducer hook - (8:15:55) #### ⌨ Fetching Data in React - (8:30:13) #### ⌨ Fetching Data using Axios and React Query - (8:44:55) #### ⌨ Redux Toolkit - (8:54:18) #### ⌨ Tasks Application - (9:14:13)
@swayambadhe
@swayambadhe Місяць тому
John smilga strikes again
@AjayKumar-fd9mv
@AjayKumar-fd9mv Місяць тому
Awesome
@hooho491
@hooho491 12 днів тому
Very good course but I'm overwhelmed by the amount of information overall, especially in React section. It's difficult to use all the information in a real project 😕
@toystory3167
@toystory3167 Місяць тому
8:33:30 fetch useeffect 8:16:30 reducers
@soldishero_YY
@soldishero_YY Місяць тому
9 hours? OMG. Let's begin
@user-dj1lj6tn4l
@user-dj1lj6tn4l Місяць тому
Thanks ❤
@eleah2665
@eleah2665 Місяць тому
Hi John!
@firstlastcode
@firstlastcode Місяць тому
We are not intimidated by DEVIN AI at all. We are feeling that new energy already.
@waqarrajpt7031
@waqarrajpt7031 Місяць тому
Nyc sir
@eliodrallag4806
@eliodrallag4806 Місяць тому
great
@omers.143
@omers.143 Місяць тому
I love you guys
@frq9293
@frq9293 10 годин тому
At 3:20:03, how did the role property go from 0 to "Admin" in the console?
@pabitrakumar4564
@pabitrakumar4564 Місяць тому
Finally my wait is over😅
@juanmacias5922
@juanmacias5922 Місяць тому
LOL I don't know if it's because I have a newer version, mostlikely because I'm using Bun, but my website crashed. 31:13 Edit: interesting, only diff is that vite is 5.2.0 for me, so I assume it was Bun that caused the TS error ha 32:23
@GiftMthimunye
@GiftMthimunye Місяць тому
CAN we PLEASE have FLET tutorial 🙏🙏🙏
@raghav_sridhar
@raghav_sridhar Місяць тому
❤🎉
@orlandoferazzani3639
@orlandoferazzani3639 Місяць тому
at 2:12:50 couldnt we set up the book type like this type Book = { id: number; name: string; price: number; discount?: number; };?
@Not_Aran8276
@Not_Aran8276 27 днів тому
Yes you can, it’s just different formatting and if you use something like Prettier formatter, it’ll do it automatically.
@toystory3167
@toystory3167 Місяць тому
8:54:30 rtk
@ashieraslam
@ashieraslam Місяць тому
Is it for absolute beginner ? Or one's should have knowledge of any sort of programming language?
@juanmacias5922
@juanmacias5922 Місяць тому
Knowledge of JS would probably help, try it out, see how far you get.
@allsparky
@allsparky 20 днів тому
2:16:02 omg he's so right
@Sonyemman97
@Sonyemman97 Місяць тому
How do people successfully finish these courses? I want to escape tutorial hell and I find myself there whenever I start these courses.
@ramatjyotsingh2643
@ramatjyotsingh2643 Місяць тому
Stop watchin tutorial beside just some syntax and basic stuff then start building a project on your own , you'll learn alot that way
@CasualCosta
@CasualCosta Місяць тому
For me, it was watching 15 minutes a time and then trying to re-create what he did from memory and checking only if needed. I did it for his React projects and it took me 2 months to finish everything, but it really did teach me how the library works.
@omogbemeiyere6475
@omogbemeiyere6475 Місяць тому
The legend himself John f*cking Smilga so happy you dropping this course man ❤❤❤❤🎉🎉🎉
@marg5019
@marg5019 Місяць тому
No Closed Caption I can't hear it.
@viktorbutanski
@viktorbutanski 29 днів тому
Two and a half hours in - loving it already. Does anyone know if this yellow marker showing the function scope like here ukposts.info/have/v-deo/gnh2dm2Jn4B4ko0.html is an extension of VS Code setting?
@MehmoodHussain-lk2qg
@MehmoodHussain-lk2qg 16 днів тому
Do we need to know basic javascript for this course?
@hooho491
@hooho491 12 днів тому
absolutely.
@deepakjoshi3347
@deepakjoshi3347 16 днів тому
Nice voice
@rodrigolopez-qi5ez
@rodrigolopez-qi5ez Місяць тому
Where is the second part of this course?
@flash0p
@flash0p 10 днів тому
its paid you can look at his website codingaddict
@fluxsiarski
@fluxsiarski Місяць тому
2:16:02 😹
@LokeshKumar-tk7ri
@LokeshKumar-tk7ri Місяць тому
what about Devin?
@Famelhaut
@Famelhaut Місяць тому
🚭
@0x-003
@0x-003 Місяць тому
So this video isnt the full course?
@freecodecamp
@freecodecamp Місяць тому
It is a full course. But you can pay to get an extra project to build.
@umaralifayzullayev
@umaralifayzullayev Місяць тому
First
@Nemesis-db8fl
@Nemesis-db8fl Місяць тому
This is the kind of video where i turn off my adblocker
@kim92se64
@kim92se64 Місяць тому
3h03m
@povdata
@povdata Місяць тому
toilet voice
@manishgautam2424
@manishgautam2424 Місяць тому
nothing is free there
@hellokevin_133
@hellokevin_133 Місяць тому
Why does this guy sound like this? don't other people feel irritated listening to him? he's also a massive spammer, just tries his best to make his courses unnecessarily long.
@Oncopoda
@Oncopoda Місяць тому
Course should be called TypeScript for absolute beginners. 😴
@knowledgetogo92
@knowledgetogo92 Місяць тому
sorry, but this is like listening to grandpa when he is almost dying. This is so slow and boring. AI will help me now to learn TypeScript....
@muhammadyafizhambatubara461
@muhammadyafizhambatubara461 Місяць тому
please don't talk about devin, its demotivated me
@kvelez
@kvelez 15 годин тому
{ "compilerOptions": { "target": "ESNext", "module": "CommonJS", "outDir": "./dist", "strict": true, "forceConsistentCasingInFileNames": true }, "include": [ "src/**/*.ts" ], "exclude": [ "node_modules" ] }
@AlexanderYaremchuk
@AlexanderYaremchuk 4 дні тому
Thank you very much! I've completed this course. it took me a whole month.. (I actually expected me to be swifter) negative stuff: * the voice is specific but I got used to it rather quickly. * instant tooltips covering lots of screen are annoying. you pause the video to check out the whole code but see the dumb tooltip. (editor.quickSuggestionsDelay and editor.hover.delay help to fight it in vs.code). overall I'm happy I did the course - it helped me a lot to get acquainted with React.
Best OS for programming? Mac vs Windows vs Linux debate settled
8:41
Learn TypeScript Generics In 13 Minutes
12:52
Web Dev Simplified
Переглядів 196 тис.
Піхотинці - про потребу у людях
00:57
Суспільне Новини
Переглядів 918 тис.
Ах Ты Ж Су... Не Провоцируй Меня! @NutshellAnimations
00:15
Глеб Рандалайнен
Переглядів 3 млн
ОДИН ДОМА #shorts
00:34
Паша Осадчий
Переглядів 5 млн
React Tutorial for Beginners
1:20:04
Programming with Mosh
Переглядів 2,4 млн
Node.js: The Documentary | An origin story
1:02:49
Honeypot
Переглядів 465 тис.
Software Architecture Explained In 3 Minutes - From Junior To CTO
2:23
Engineer Explains
Переглядів 1 тис.
Generics: The most intimidating TypeScript feature
18:19
Matt Pocock
Переглядів 158 тис.
TypeScript Tutorial for Beginners
1:04:28
Programming with Mosh
Переглядів 1,1 млн
Deflated · Made by shykids with Sora
3:39
OpenAI
Переглядів 38 тис.
I Cannot Believe TypeScript Recommends You Do This!
7:45
Web Dev Simplified
Переглядів 155 тис.
This VS Code AI Coding Assistant Is A Game Changer!
14:27
codeSTACKr
Переглядів 108 тис.
How to use TypeScript with React... But should you?
6:36
Fireship
Переглядів 894 тис.
How Did I Not Know This TypeScript Trick Earlier??!
9:11
Josh tried coding
Переглядів 198 тис.
Піхотинці - про потребу у людях
00:57
Суспільне Новини
Переглядів 918 тис.