TypeScript
-
How to Start Learning TypeScript – A Beginner’s Guide
JavaScript is the most widely-used programming language for web development. But it lacks type-checking support, which is an essential feature of modern programming languages. JavaScript was originally designed as a simple scripting language. Its loose nature and absence of crucial Object-Oriented Programming (OOP) features pose certain challenges for developers: Limited documentation and auto-completion. Inability to utilise OOP concepts. Lack of type safety, leading to runtime errors. Challenges in refactoring and maintenance. Absence of interfaces and integration points. TypeScript solves these…
-
Building a Weather Service With Genkit and AI
Overview This project demonstrates how to build an AI-enhanced weather service using Genkit, TypeScript, OpenWeatherAPI, and GitHub models. The application showcases modern Node.js patterns and AI integration techniques. Prerequisites Before you begin, ensure you have the following: Node.js installed on your machine GitHub account and access token for GitHub APIs An OpenWeatherAPI key for fetching weather data Genkit CLI installed on your machine Technical Deep Dive AI Configuration The core AI setup is initialized with Genkit and GitHub plugin integration.…
-
Learn Async Programming in TypeScript: Promises, Async/Await, and Callbacks
Async programming is a programming paradigm that allows you to write code that runs asynchronously. In contrast to synchronous programming, which executes code sequentially, async programming allows code to run in the background while the rest of the program continues to execute. This is particularly useful for tasks that may take a long time to complete, such as fetching data from a remote API. Async programming is essential for creating responsive and efficient applications in JavaScript. TypeScript, a superset of…
-
Implement a Geographic Distance Calculator Using TypeScript
When developing educational games, providing accurate and meaningful feedback is crucial for user engagement. In this article, I’ll share how we implemented a geographic calculation system for Flagle Explorer, a flag-guessing game that helps users learn world geography through interactive feedback. The Technical Challenge Our main requirements were: Accurate distance calculations between any two points on Earth Precise bearing calculations for directional guidance Normalized proximity scoring Real-time performance for instant feedback Implementation Details 1. Core Data Structure First, we defined…
-
How to Enforce Type Safety in FormData with TypeScript
When working with the FormData interface in JavaScript, where data is appended as key/value pairs, there’s no built-in way to enforce type safety on the keys you append. This can lead to typos, missing keys, and unexpected runtime errors. But in TypeScript, we can solve this by enforcing strict key validation. I needed this solution myself when sending my form values to an API. I later realized that I had made several typographical errors in more than one key/value pair…
-
Branded Types in TypeScript
When you model entities with TypeScript, it is very common to get an interface like this: TypeScript interface User { id: number username: string … } interface Order { id: number userId: number title: string year: number month: number day: number amount: { currency: ‘EUR’ | ‘USD’, value: number } … } The Problem The properties’ types have no semantic meaning. In terms of types, User.id, Order.id, Order.year, etc. are the same: a number, and as a number…
-
JavaScript for Beginners: Assigning Dynamic Classes With ngClass
In web apps it’s a common requirement to tailor an element’s appearance based on a condition. There are a few ways of accomplishing this, but if you’re working with Angular, your choice is clear. The ngClass directive provides a myriad of ways to dynamically assign class names to elements or components. Its syntax is both concise and yet supports fairly complex logic to provide us with fine-grained control over both our class names as well as the criteria for setting…
-
Serverless Computing and GraphQL: Modern App Development
In this article, I will guide you through the process of creating a serverless GraphQL API using TypeScript, AWS Lambda, and Apollo Server. Serverless Computing Serverless computing is a cloud-computing execution model where cloud providers automatically manage the infrastructure for running applications. In this model, developers write code, and the cloud provider takes care of running, scaling, and maintaining the servers, meaning developers don’t need to worry about server management, infrastructure provisioning, or scaling. The term “serverless” doesn’t mean that…
-
What are Type Predicates in TypeScript? Explained with Code examples
Type predicates are an interesting syntactical feature in TypeScript. While they appear in the same place as return type annotations, they look more like short affirmative sentences than typical annotations. This gives you greater control over type checking. With the release of TypeScript 5.5, working with type predicates has become more intuitive now because it can infer them automatically in many cases. But if you’re navigating slightly older code-bases, you’re likely to encounter handwritten type predicates more often. In this…