Angular Best Practices

Hi Friends, This is Lakshman here. Welcome back to the Series Angular Best Practices Today, We will go through Part 2 of your First Testing in Angular App. If you do not check Part-1 Check this out Angular Testing In this blog, we will discuss the multiple options of testing Services. The Service consists of * Fetch or Post Data to get Response from API. * Common Functionality such as Validation, Data Conversion, etc., The Difficult part only for API Calls because we can't use the API directly. We need to Mock the API to get the Response. Sample Testing for Service as below, import { HttpClient } from '@angular/common/http'; import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing'; import { getTestBed, TestBed } from '@angular/core/testing'; import { environment } from '@env/environment'; import { TempTests } from './test.service.mockdata'; import { TestService } from './test.service';

Hi Friends, This is Lakshman here. Welcome back to the Series Angular Best Practices Today, We will go through, how to Create you First Testing in Angular App. Angular Testing As we develop the application, we usually validate the functionality via Serving the Application and check it's working or not. What if we need to check for multiple workflows per functionality either way as Positive & Negative Scenario. As a default, it has two types of tests, Unit Testing (via Karma ) End-To-End Testing (via Protractor ) Unit Testing On Unit Testing, its available for * Components * Service In Testing, we can test the two elements such as * HTML Testing * Code Testing Testing Files will be available with extension as .spec.ts By Default, angular generate the template below, import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { HelloComponent } from './hello.component'; describe('HelloComponent', () => { let comp

Hi Friends, This is Lakshman here. Welcome back to the Series Angular Best Practices Today, We will go through the best practices for handling REST API Call on App. REST API Call In our day-to-day development, we use REST API for below, Fetch information. Fetch information with Params. Post Data for either Create / Update / Delete. For each request, we required certain things to do. API Url HTTP Headers Content Type either XML or JSON. Authentication Token In HTTP Header Content-Type & Authentication Token is common. So we required to store in Common Service to Set it. It better to have a Function to generate Header with ContentType ContentType with Auth. So we can access it. The Function will look like below, getHeader() { const headers = new HttpHeaders({ 'Content-Type': 'application/json' }); return headers; } getHeaderAuth() { const headers = new HttpHeaders({ 'Content-Type': 'application/json