Go beyond syntax to understand the principles and concepts—if TypeScript still feels confusing no matter how much you study, it's time to learn it properly! We will turn you into a TypeScript Wizard🧙🏻♀️.
Reviews from Early Learners
5.0
wjdgksak
Captain Pangyo's TypeScript, Zerocho's TypeScript, as someone who has heard them all, this is the best. The lecture quality is good and the price is cheap. It's a blessing. I especially liked how easy it was to understand the generics part!
5.0
eko09
It was a really good lecture ㅎㅎ Personally, I want to see a lecture that comprehensively applies what I learned in parts 1 and 2, such as a lecture on how to create a project with React + TS as the third lecture!! ㅎㅎ
5.0
MJ JI
A lecture that robbed an old man's pocket!! You are the true leader of React lectures!! A lecture that two people can eat and one will die without knowing!! Lee Jeong-hwan, React cut into bite-size pieces!!!
TypeScript
The Necessity and Features of TypeScript
A deep understanding of type systems
Understanding types as sets
Using TypeScript with React
Click the image to go to the roadmap.
> Roadmap link: https://link.onebitefe.com/r/5cdagw
Series Lecture Links
> React from Scratch:https://inf.run/v3XAj
> TypeScript from Scratch: https://inf.run/FpLm4
> Next.js from Scratch: https://inf.run/v3XAj
Even in the AI era, TypeScript remains an unavoidable trend in frontend development,
and now is the time to truly master it! 😎
🧐 TypeScript is confusing no matter how much you learn;
now it's time to learn it properly
TypeScript has now become an unavoidable trend!
If you've only roughly learned the syntax without properly understanding the principles,
you won't even be able to properly handle TypeScript code generated by AI.
Do you really understand TypeScript well?
Check if you can sufficiently answer the questions below.
This lecture goes beyond a simple list of syntax rules that an AI could provide.
We will explore not only the syntax but also why TypeScript works the way it does in a very easy and fun way.
After the course is over!
You will be a true TypeScript wizard
who can easily fix type errors even in code written by AI. 🧙🏻♀️
A handbook is also provided to accompany the lectures, as shown in the image below!
Because TypeScript is a language that operates based on mathematical 'set theory,'
it can be difficult to fully understand its principles through words and text alone.
That's why I've prepared various visual materials and examples.
No matter how difficult or complex the concepts are, we will explore them in an easy and fun way.
| 
|
Those who have finished learning JavaScript and are looking to learn TypeScript for the first time
Those who have learned TypeScript but still find many points confusing
Those who want to understand the precise concepts and operating principles of TypeScript
Those who want to try using React and TypeScript together
I believe that learning with clean, beautiful, and cool visual materials helps you concentrate better and stay in your memory longer.
Since these are all images I created myself, feel free to capture them and use them in your study blog posts. 😃
| 
|
| 
|
Visual materials are the best for understanding things more easily and quickly, right? That's why I bought a tablet for handwriting specifically to film this lecture. We're going to dive deep into TypeScript along with visual notes.
It would be a shame to just store the practice codes you worked so hard on anywhere, wouldn't it? I've taken care to organize and store the code by section so that you can come back and review it at any time.
To save you the trouble of re-watching the entire lecture for review, we provide free lecture notes.
Learning never ends.
Even after this course is over, let's gather in the student-only community
to share knowledge and various news while growing together 🌱
[Section 0 Chapter 2: Joining the Student Community] to
find the link and password for the student-only open chat room
| 
|
| 
|
📌 SECTION 1. Introduction to TypeScript
To understand a technology well, it is necessary to know the background in which it was born. Therefore, in Section 1, we will look into the background of TypeScript's creation to examine in detail what problems it aimed to solve and what characteristics it possesses.
| 
|
| 
|
📌 SECTION 2~3. Mastering TypeScript Basics
We will explore the most fundamental syntax of TypeScript. At the same time, we will examine exactly what TypeScript defines as a "type," how these types relate to one another, and how they operate.
📌 SECTION 4~6. Exploring TypeScript Syntax
We will explore various features and syntax of TypeScript, such as function type definitions, function overloading, interfaces, and classes.
📌 SECTION 7~9. Manipulating Types Like a Wizard
We will explore type manipulation, one of TypeScript's most unique and powerful features. We will look at a wide variety of TypeScript's type manipulation syntaxes, including Generics, Indexed Access Types, Mapped Types, the Keyof operator, and Conditional Types.
📌 SECTION 10. Using Utility Types
We will explore the various utility types provided by default in TypeScript. Additionally, we will implement these utility types ourselves using the knowledge we have learned so far.
📌 SECTION 11. (Bonus +) Using TypeScript in React
It would be a shame to end it just like this, right? That's why I've prepared a bonus section. We will build a very simple to-do list together and look into how to apply TypeScript to a React project.
Q. I know JavaScript, but not very well. Can I still take this course?
Yes. As long as you aren't a complete beginner, you can take this course. Whenever prerequisite knowledge of JavaScript is required, I have included JavaScript study materials that I personally created in the lecture notes. Also, if the syntax is difficult, you can get help by asking questions in the student community.
JavaScript Learning Materials (Excerpt from the book "React in Bite-Sized Pieces")
Q. I am a Node.js backend developer. I'm not a frontend developer; can I still take this course?
Yes. You can take all the lessons except for the final bonus section (React + TypeScript).
Q. Can I capture the lecture PPT or screen and post it on my blog?
Yes! You are free to use them. Just please do not sell them. 🥲 Additionally, as a small favor, I would appreciate it if you could include a link to my course as the source.
Prerequisite Knowledge
Precautions
I am an educator who believes there is a way to explain anything easily and enjoyably. I created the course "React in Bite-Sized Pieces," which produced approximately 5,000 students on Inflearn and Udemy within just one year of its release. To help aspiring developers, I created and have been operating DEVSTU, a developer knowledge-sharing site, for about two years. Since 2022, I have also opened and managed an open chat room for those studying React. Additionally, I served as the CTO of a service startup for junior developers for two years.
Experience
Who is this course right for?
Those who are starting TypeScript for the first time
Those who have learned TypeScript but lack confidence
Those who want to understand and use the principles of TypeScript.
Frontend Developer
Node.js Backend Developer
Need to know before starting?
JavaScript (ES6)
To listen to the bonus section, React.js
38,238
Learners
2,820
Reviews
1,635
Answers
4.9
Rating
19
Courses
Shall we take a bite-sized look at Web Front-end?!
Hello 🙇♂
I am someone who believes there is a way to explain anything easily and in an entertaining way, and
I am someone who wants to create the warmest developer community in the world.
📚 Books
"Bite-sized Next.js" published
"React Bite-Sized" Published
📹 Lectures
Bite-Sized Next.js
Bite-sized TypeScript
React.js Bite-Sized
All
64 lectures ∙ (10hr 31min)
Course Materials:
7. Hello TS World!
09:34
All
657 reviews
5.0
657 reviews
Reviews 36
∙
Average Rating 4.9
Reviews 13
∙
Average Rating 3.1
Reviews 14
∙
Average Rating 4.9
Reviews 1
∙
Average Rating 5.0
5
I took this class after the React class and it's really great 👍👍👍 1. He explains new concepts with various examples 2. He answers questions in a quick and easy-to-understand way 3. It's good to quickly look through or review with the handbook provided - especially to review examples from the class 👍 4. He cuts it into bite-sized pieces so that you can easily look at one or two at a time without feeling burdened! 5. He teaches with accurate diction and at a slow pace! I listened at a faster speed when reviewing, but the diction was good so there was no problem! 6. I think it's a really well-organized, basic lecture! I kept putting it off, but I participated in the challenge that the instructor gave and completed it. Those who are listening, please participate in the challenge too!
Reviews 22
∙
Average Rating 5.0
5
I took both React and TypeScript lectures. Sometimes detailed and sometimes simple and clear, so I understand it very well. The pictures and photos used to explain the lectures are simple, so I can understand them at a glance. It's also good for beginners!! I really like this lecture. I'll listen to it over and over again!!
Check out other courses by the instructor!
Explore other courses in the same field!
$37.40
![[1 Hour] JavaScript for Developers (of other languages)Course Thumbnail](https://cdn.inflearn.com/public/files/courses/337877/cover/01jyvwkxfmyxtq5ny0e5fmwmqp?w=420)
![[Code Factory] [Beginner] NestJS REST API Backend Complete Conquest Master Class - NestJS CoreCourse Thumbnail](https://cdn.inflearn.com/public/courses/331985/cover/f0501069-2139-4112-aafa-a9b3a2932860/331985-eng.png?w=420)
![[Revised 3rd Edition] Node.js Textbook - From Basics to Project PracticeCourse Thumbnail](https://cdn.inflearn.com/public/courses/330181/cover/47e0125e-75ad-4946-96d3-54bbc444a188/330181-eng.jpg?w=420)