How to use Typescript with Node.js | Building a Node.js App with TypeScript

If you are using Javascript to build your application it's fine if that is a small application but once your application becomes big, it's really hard to manage the code quality.

To write the manageable and typed Javascript we started using Typescript. Typescript is just the superset of Javascript which is strictly typed.

The issue with Typescript is, it can't simply run on the browser or V8 engine. We need to transpile the Typescript to Javascript. Here in this article, we are going to use TSC to transpile the Typescript to Javascript. ...  Read More

Share This:


Custom Directives in Angular 8 | Angular Directive Tutorial With Example

I think directives are the most important bit in an Angular application. There are 3 types of directive in Angular which is listed below.

  1. Component Directive
  2. Attribute Directive
  3. Structural Directive

Component Directive:

The component directive is something which is the core thing of angular application. We create components by using @Component decorator. The best example of component directive is AppComponent.

Attribute Directive:

Creating a directive is pretty similar to a component, we user @Directive decorator for creating the directives. Attribute directives are used as attributes of elements. Let me explain this with an example: ...  Read More

Share This:


Difference between find() and filter() in JavaScript | ES6 some() and every() functions example

Many time we need to traverse the array data while building the application. Fortunately, JavaScript provides many array functions to do that but use case of these functions are different. Here in the below description, we'll discuss the ES6 array functions find() and filter().

If we only wanted to return the first matching element in the array: We use find() for this. .find() will look and stop after the first match. Let me explain with an example:

Let say we have a products array and we wanted to find the price of TV in below example:

The output of the above script will be:

Now If we run filter() function in the same case then it will return the array of objects whose name is TV. .filter() will continue searching through the entire array.

The output of the above script will be:

find() and filter() are only used when we wanted to return the matching results and use them but if we just wanted to check the existence of matching result, in that case, we can use some() and every() ES6 functions...  Read More

Share This:


MongoDB - Update objects in a document's array | MongoDB update object in Array

Sometime in MongoDB, we need to update the object in the array for the particular matching document. We need to update either the first matching object or all the matching objects in the array. Let me give you an example of the documents. Let say I have the following collection whose name is items.

Now I wanted to update the latest price of the item whose name is "my_item_two".

We achieve this through the positional operator ($). The positional operator is used to performing the operation on the particular position. Let me write the query for that:

This will update the first matching array element but sometime we may need to update all the matching array elements and we can do that by using the $[]. The all positional operator $[] indicates that the update operator should modify all elements in the specified array field.

  ...  Read More

Share This:


Angular 8 - Reactive Forms Validation Example | Angular Form Validation Example

Forms are always an integral part of our application. In angular, we build the form in  2 ways either template-driven or model-driven/reactive forms.

Here we are going to discuss reactive forms with Angular. Reactive forms are more scalable and can be managed easily. It's much simple way to validate the reactive forms. There are a number of validations which are commonly used in our application. Here we'll discuss the following validations:

  1. Confirm Password Validation in Angular 8
  2. URL Validation in Angular 8
  3. Age-Old Validation in Angular 8
  4. Up to Decimal Point Validation in Angular 8
  5. Number Validation in Angular 8
  6. Alpha Numeric Validation in Angular 8
  7. Email Id Validation in Angular 8
  8. Credit Card Validation in Angular 8

Code for all the above validations can be found here



Let me create a service which I'll use to validate the forms in my application: src/app/Services/validation.service

Now let me create a validation message component. This is the common component which will be used throughout the forms to show the validation message. ...  Read More

Share This:


MongoDB find match in array of objects || MongoDB where condition with array of objects | $elemMatch or dot notation match

In MongoDB, $elemMatch and dot notation are used to find the match in the array of objects. But both have some difference.
Let me explain this with an example. Let say we have a document like:

Now let me find the class name whose students has scored greater than 86.

If using the dot notation then here is the example:

The result will be :

Now If I find the class name whose students has scored greater than 86 and their section is A by using dot notation.

The result will be:

Hence if we are using dot notation, Any condition match in students array, like score or section will be returning document.



But what if we wanted to match every condition?  The answer is: We use $elemMatch for that. ...  Read More

Share This:


TypeScript Interfaces | Why use interfaces in angular typescript

  • An interface defines the syntax that an entity must have to follow.
  • Interfaces are only at compile time.
  • Interfaces contain only the declarations of the members.
  • A deriving class must define the required members.
  • It is also helpful in providing a structure.

Let me give you an example with users interface: i-users.ts

And now let say we have a users service and inside that, we have a function 'updateUser' to update the user info.

 

Here in the above code snippet, we are passing a parameter userData of type IUsers. This means we can not pass any other format except the IUsers.
But did you notice we have a question mark (?) at property phone and which means phone is optional.

So I can pass data something like:

Here above userData is valid data to pass the API.
Now let's have another example of invalid parameters:

Here this is invalid data because we have not declared the city in our interface and that's why this will result in an error at compile time.



Interfaces are also helpful when sometime we forgot to pass a required parameter and this will help you at the compile time by telling that a particular member is not defined. ...  Read More

Share This:


Angular 8 feature | Using loadChildren to Lazy-Load your Module | Angular 8 dynamic EcmaScript imports

Lazy loading is the beautiful feature which Angular provides. We can load the modules only when the user navigates to their routes for the
first time. It will increase the application performance and also will reduce the initial bundle size.
The Angular Router has always supported lazy loading but now in Angular 8, we can dynamically import the lazy-loaded module only when it is needed.
It is promise based and gives you access to the module whenever the module is called.

Let's create a transaction module for demonstrating the angular 8 dynamic EcmaScript imports:

This will create a transaction list, detail and create components. ...  Read More

Share This:


Push multiple objects into MongoDB array document | Append Multiple Objects to an Array in MongoDB

Normally we use $push to push or append the element or object into an array in mongoDB. But sometime we may need to push the multiple objects into mongoDB array document. Here below I'll try to explain how we can do that.

Let say I have a collection of favorite products and the collection name is favorite_products.

Now in the above document, I wanted to push/append the multiple user objects into the users array whose product id is 124.



 ...  Read More

Share This:


MongoDB distinct with array of objects | Getting distinct values from object array MongoDB

Let say we have a collection transactions which contains some document and documents contain payments which is array of objects.
Now my task is to get the unique types in payments array of every document.

Expected Result: Debit Card, Internet Banking, Credit Card, UPI



which is unique values of payment types in transctions collection and the MongoDB query for that is given below:

Here we first unwind the data so that every payments array can be converted to objects and then we are grouping the type of payments document in transctions collection. ...  Read More

Share This: