TypeScript & Patterns — Start Here
These guides cover the TypeScript features and design patterns that show up repeatedly in real codebases. Each one is explained with concrete TypeScript examples — not abstract UML diagrams.
Assumed knowledge: You know JavaScript and have used TypeScript on at least one project. You’re comfortable with classes and interfaces.
Start Here — TypeScript Generics
Generics are the foundation. Most patterns become significantly cleaner once you understand them.
- 📄 Mastering TypeScript Generics: The Ultimate Guide — constraints, conditional types, mapped types, and utility types with real examples
Creational Patterns — How Objects Are Made
These patterns control how and when objects are created. Start with Singleton, then Factory.
- 📄 Singleton Pattern — one instance, controlled global access
- 📄 Factory Pattern — create objects without specifying the exact class
- 📄 Prototype Pattern — clone objects instead of building from scratch
Structural Patterns — How Objects Are Composed
These patterns define relationships between objects. Adapter and Facade solve the most common real-world problems.
- 📄 Adapter Pattern — make incompatible systems work together
- 📄 Facade Pattern — hide complexity behind a simple interface
- 📄 Decorator Pattern — add behaviour without changing the original class
Behavioural Patterns — How Objects Communicate
- 📄 Iterator Pattern — traverse any collection the same way
Performance & CSS
Two guides on the fundamentals that affect every frontend project.
- 📄 Master the Critical Rendering Path — how browsers paint pixels and how to make it faster
- 📄 Unlock the Hidden Power of CSS Units — rem, em, vw, vh, ch, clamp() explained
Get the Weekly Guide
Every week: one TypeScript pattern, one Angular or Next.js technique, or one AI engineering concept — explained for developers who ship to production.
About the Author
Mahmoud Hussien is a frontend engineer with 19 years of experience across web design, PHP, and modern frontend development with Angular, Next.js, and TypeScript. He founded MasterCodeCraft to share the patterns he uses in production — not the ones that only work in tutorials.