Tutorial Series
Deep-dive into comprehensive multi-part tutorials. Learn complex topics with structured learning paths designed for real-world application.
Indie Dev Toolkit
Modern tools and workflows for solo full-stack developers. Ship faster, maintain less, build more.
NX Introduction & Architecture
Learn the core concepts of NX monorepos, workspace architecture, library organization patterns and common NX commands.
Build Your First NX Workspace
Build your first NX workspace from scratch with hands-on exercises covering plugins, tasks, and CI/CD.
Interactive Tutorials
Build a User Profile Page with React, Tailwind and HeroUI
This tutorial shows you how to build a modern user profile page with React and HeroUI. You'll create reusable components to show user info, add a photo carousel, and display posts and photos—while learning key React and UI design skills.
Setup and initialize a new React project
Building the FeaturePhotos component
Designing the Profile Information Section
Creating the Profile Stats Section
Implementing the Profile Post Timeline
Implementing the Profile Photo Timeline
Implementing the Profile Timeline Tabs
Putting it All Together
Build a Flight Booking UI with React, Tailwind and HeroUI
This tutorial walks you through building a clean, user-friendly flight booking page using React and HeroUI. You'll create reusable components, add filters and sorting, and learn the basics of React and UI design along the way.
Setup and initialize a new React project
Building Flight Header Component
Building Flight Card Component
Building Flight List Component
Building Flight Filter Form Component
Building Flight Filter Drawer Component
Building Flight Sort Menu Component
Building Flight Preferences Component
Putting It All together
Understanding TypeScript Generics
Generics are a fundamental feature in statically-typed languages like TypeScript. They allow you to define components, functions, or data structures that work with a variety of types while maintaining type safety. This improves flexibility, reusability, and helps remove repetitive code.
What are generics in TypeScript?
Making Your Code Flexible with Generics
Generic Parameter Defaults
Generic Constraints
Conditional types with generics
Closing thoughts
Follow Upskills.dev
Stay updated with our latest tutorials and coding tips.