Blog - Ramin Ahmadi | Personal website of Ramin Ahmadi

Creating tree from flat array in Angular

03 May 2020 Angular, front-end development, JavaScript

So I needed to create a tree component from a flat array recently. It took me sometime to put it together so I decided to share my code with you. A flat array is an array of objects where a property on the object refers to id of another one and ...

A proposal to better estimate and plan Agile projects

11 January 2020 Project management

To understand how agile came about, we need to discuss earlier software development processes. The waterfall model, is one of the earliest software development approaches. When talking about waterfall, people think about a process where project starts with definition of requirements, a solid design based on the requirements, then implementation ...

Difference between null and undefined in JavaScript

12 February 2019 JavaScript

As a front end developer you might have checked value of variables for null value or undefined. For example asking for a non-existing property of an object. let cars = {};console.log(cars.BMW); //returns undefine now a simple if statement will tell you if BMW exists in cars variable. Here is how to check ...

Minimum contrast ratio between text and background for WCAG 2 (Level AA)

14 January 2019 Design, front-end development

Some users with visual impairments require a strong contrast between text and background color. Consider a user with protanopia (color blindness), they might not be able to see the text in your website properly which possibly leads to less meaningful visual indication. to make sure text is readable by users, ...

Creating a table with inline editable cells using Angular 6

11 November 2018 Angular, front-end development

in this article, I’m going to discuss how to create a table with inline editable cells. As a developer, you have been asked to present one view for presentation and edit of content because of user experience requirements. Recently I have been working on a component that does that and ...

What is HTTP method OPTIONS?

12 September 2018 front-end development, JavaScript

The HTTP OPTIONS method is a type of HTTP call that explains what are the options for a target resource such as API endpoint. a client can use target resource’s URL to use OPTIONS method or use * to target the entire server. public GetOtaAdaptor(): Promise<Model.OtaAdapter> { ...

Creating custom element with Angular 6

26 July 2018 Angular, front-end development

Angular elements are framework agnostic custom HTML elements that are made out of Angular components. This is the latest, and in may I add the coolest, Angular 6 feature that allows maximum re-usability of components as they can be used in a wide variety of frameworks and environments. But what is ...

How to make a Collapsible card with Angular and material design

18 July 2018 Angular, front-end development

Collapsible panes are useful when you want to show big amount of data in a container. In this example I developed a collapsible panel with Angular and material design. To start you should know what data needs to be always visible and what needs to be visible after the panel collapses. ...

Web sockets and how they work

29 June 2018 front-end development

Foundation of web as we all know is based on Hypertext Transfer Protocol (HTTP) which uses request-response protocol. This, in a nutshell, means a web browser submits an HTTP request message to server and server which, holds resources, returns appropriate response message. However, servers weren’t allowed to send messages to ...