Are public and private variables really public or private? Consider the below example - class MathOp { public x: number; private y: number; } const op = new MathOp(); op.x; // no problem If you try to access the private variable.. op.y; // Error: Property 'y' is private and only accessible within class 'MathOp' What does private even mean? From our earlier definitions, the behaviour seems ok. Or, is it? Just compile the above code block to JS. tsc test1.ts And, the compiled Javascript file is - ...

With ’type’ in its name, Typescript lives up to its reputation of being a typed language. But, what exactly are the supported types? At a high-level we can classify types as built-in (basic & special ) and additional types including user-defined types. Built-in Types (Basic) Similar to Javascript implicit types, we have number, string, boolean to form the three core built-in types. let num: number = 1; let planet: string = "earth"; let isHappy: boolean = true; We also have null, and undefined as additional basic built-in types. ...

Use onclick rather than submit in HTML forms. A typical HTML form has a few fields and a button to submit the data to some back-end server. And, the typical way to do the form submission is through the submit method. <form action="/helloMessage.php"> <input type="text" id="name" /> <button type="submit"></button> </form> On clicking the button, the page will submit data to helloMessage.php, receives any response from PHP page, and (can be configured to) displays the response. [Or, the page could redirect somewhere else based on the submission status, but we will not discuss that here] ...

URL shorteners shorten your URLs. You have many many products in the market - bit.ly being the most popular. However, with a bit of help from amazing people who have built them, we can use our own URL shorteners. Again, nothing magical here - this was quite an old problem. People wanted to always mask their URL or make it easier for sharing. Here are three open source and free URL shorteners that you can use today! ...

Get started with object oriented programming in Typescript. Typescript behaves like a language with built-in support for OOP concepts, and does not carry the quirks of Javascript in that respect. Classes and Objects Define classes and objects like how you define in any of the popular OOP languages. class Fruit { public name: string; private grownIn: Array<string>; constructor(name: string, grownIn: Array<string>) { this.name = name; this.grownIn = grownIn; } getGrownIn(role: string): Array<string> { if (role == "admin") return this.grownIn; else return []; } private } let appleFruit = new Fruit("apple", ["India", "China"]); console.log(appleFruit.name); // apple We have defined a simple class ‘Fruit’ and provided it with - ...

I had been fascinated by Typescript and have been going back and forth on making it my primary programming language. In a few posts and with as much less information as possible, let’s see why anyone should bother with Typescript. What is Typescript? Typescript is a typed Javascript. No, I am kidding - it is more than that. Typescript is not only strongly typed language that acts as a super-set of Javascript, but also is compiled and object oriented language. What distinguishes Typescript is not the language alone but the tooling that surrounds the language. ...

Adding PWA to your Hugo static site is quite easy. What is PWA and why should I add it? Progressive web applications (PWA) are a nice way to give your websites an “app makeover”. Using PWAs your sites are perceived to load faster, are available offline, and in general improve user experience. PWAs are supported by all web browsers. Using PWAs on single page applications have shown remarkable improvement in site speed and have provided us the ability to continuing to serve static content even when the connectivity is down. ...

What is your preferred way of showing role-based menus and buttons in toolbar and navigation menus? A typical application may have many toolbars and navigation bars, each relevant to a specific set of users. You can then show/hide the elements based on the user role. In smaller applications, I simply choose to show or hide the menu items on a single navigation bar. This is easier to develop and to maintain. ...

Here’s a quick way to prevent emails from going out in test environments in AdonisJS. We typically end up getting production data in part or in whole to test environments for a “proper” round of testing on real data. But all the data attributes cannot be so “real”. We typically end up changing fields like emails so that customers do not start receiving emails from non-production environments. In addition to the above change, we try to specify an explicit opt-in to communications so that people who are not associated with testing do not get confused with test transactions - even when the said people are within the client organization. ...

While we love to have production-like environments for user testing, managing data and the test environments can present unique challenges. In today’s enterprises it is fairly common to have multiple test environments including staging, system / user testing environments and so on. These environments expect production-like features but only for specified users. For example - Validations have to work as they are in production Document templates and document merge has to work Email and SMS communications have to work for select users Logins have to work for select users A few staging environments may need data in volume - what better data can you find outside of your own production environment? As is the norm for typical enterprise applications, I tend to - ...