Executor Framework

Executor Interface

  • The most important root interface in executor interface.
  • It has only one method
    void execute(Runnable task);

ExecutorService Interface

  • Extends Executor interface.
  • Provides an lifecycle to an executor i.e an initialization phase, service phase and destruction phase.
  • Some of the methods provided by ExecutorService are
    <T> Future <T> submit(Callable<T> task)
    <T> Future <T> submit(Runnable<T> task)
    void shutdown()
    List<Runnable> shutdownNow()
    boolean isShutdown()

Executors Class

  • It is a factory class that constructs and returns various kinds of instances of ExecutorService with commonly used Executors setting.
  • public static ExecutorsService newFixedThreadPool(int nThreads);
    • Specifies the number of threads you want in the pool.
  • public static ExecutorsService newCachedThreadPool(int nThreads);
    • This kind of ExecutorsService keeps on creating thread until no thread is available
  • public static ExecutorsService newSingleThreadExecutor();
    • Background thread that executes one by one from a queue sequentially
    • Never executes more than one thread simultaneously
  • public static ExecutorsService newSingleThreadScheduledExecutor();
    • Executes only one thread at a time.
    • Can schedules the delay when the thread has to be executed.

Simple Jenkins Job

First we will create a simple java program which will be executed by Jenkins

File nam : Demo1.java

public class Demo1 {
	public static void main(String[] args) {
		System.out.println("Hello Jenkins");
	}
}

Make sure your Jenkins service is running and hit the below URL
http://localhost:8080/

It will ask you to login and login into it and you will see below screen.Click on the New Item hyperlink.

After click one New Item, below screen will appear :

  • Enter the item name as “HelloWorld”
  • Select “Freestyle project” using mouse click and press on OK button.

In the build section :

And click on Save

After Clicking on Jenkins in the left top cornor you will be able to screen as above.
You build the project by clicking on the right side of the job.

That is how you create a jekins job.

Install Jenkins

Download jenkins from https://pkg.jenkins.io/debian-stable/

Jenkins URL After installation will be :
http://localhost:8080/

Jenkins Unlock using below file:
/var/lib/jenkins/secrets/initialAdminPassword

Use the text inside the file to unlock jenkins
o999be21ce834c8cb202f8671d46d999

Commands to stop start and check status of jenkins

  • sudo systemctl status jenkins
  • sudo systemctl stop jenkins
  • sudo systemctl start jenkins
  • sudo systemctl restart jenkins

Routing in Angular

We create a project in angular using angular cli and add three components into it.

ng new RouterDemo
ng g c home
ng g c reptiles
ng g c animals

We edit out app.module.ts file as per below :

import { Routes, RouterModule } from '@angular/router';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule, Component } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BirdsComponent } from './birds/birds.component';
import { ReptilesComponent } from './reptiles/reptiles.component';
import { HomeComponent } from './home/home.component';

const appRoutes: Routes = [
  { path: '', component: HomeComponent},
  { path: 'birds', component: BirdsComponent},
  { path: 'reptiles', component: ReptilesComponent}
]

@NgModule({
  declarations: [
    AppComponent,
    BirdsComponent,
    ReptilesComponent,
    HomeComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot(appRoutes)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {

}

We edit the app.component.html file as below :

<div>

  <ul class="nav nav-tabs">
    <li class="nav-item">
      <a class="nav-link" href="/">Home</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="/birds">Birds</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="/reptiles">Reptiles</a>
    </li>
  </ul>

</div>
<router-outlet></router-outlet>

We edit home.component.html file as below :

<p>Welcome to the Zoo</p>

We edit birds.component.html file as below :

<p>Welcome to the Bird Sanctuary</p>

We edit reptiles.component.html file as below :

<p>Welcome to the world of reptiles</p>

And the output looks like below :

Service and Dependency Injection

First to demonstrate Service in Angular we need to create a demo project using angular CLI and make a child component and a service using the Angular CLI

ng new ServiceDemo
ng g c child
ng g s date

Now modify the date.service.ts as per below.

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class DateService {
  showTodayDate() {
    return new Date();
 }
}

Modify app.component.html as below :

Todays Date time displayed in Parent Component : {{todaysDate}}
<app-child></app-child>

Modify app.component.ts as below :

import { DateService } from './date.service';
import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent{
  title = 'ServiceDemo';
  todaysDate;

  constructor(private dateService: DateService) {}

  ngOnInit() {
    this.todaysDate = this.dateService.showTodayDate();
 }
}

Modify child.component.html as below :

<p>Hi This is child component!</p>
Todays date time displayed in child component{{todaysDate}}

Modify child.component.ts as below :

import { Component, OnInit } from '@angular/core';
import { DateService } from '../date.service';

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.css']
})
export class ChildComponent implements OnInit {

  todaysDate;

  constructor(private dateService: DateService) {}

  ngOnInit() {
    this.todaysDate = this.dateService.showTodayDate();
 }
}

Note : We need to add the service in the providers section of app.module.ts file as below :

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { ChildComponent } from './child/child.component';
import { DateService } from './date.service';

@NgModule({
  declarations: [
    AppComponent,
    ChildComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [DateService],
  bootstrap: [AppComponent]
})
export class AppModule { }

Output will look like below :

Angular CLI Commands

$ node –v
(to check the version of node)

$ npm install –g @angular/cli
(to install the Angular CLI globally on our machine)

$ ng –v
(to verify the version of Angular CLI)

$ ng new FirstApp
(to generate a new app of name FirstApp)

$ ng new FirstApp –-dry-run
(this command will only report the files and not write them)

$ ng new FirstApp –-skip-install
(this command will generate a new app without running the npm install)

$ ng new –-help
$ ng new -h
(will list out all the flags associated with the ng new command)

$ ng new FirstApp –-style scss
(will be using sass instead of css in the generated app)

$ ng new FirstApp –-prefix YourName
(will set the default selector as YourName)

$ ng new FirstApp –-skip-test
(will not generate the spec files while creating the app)

$ ng new FirstApp –-routing
(will generate a new app with a default routing module)

$ ng new FirstApp –-routing –-style scss –-prefix YourName
(example of the above flags in a command combined)

$ ng lint
(will do the linting of the TypeScript code)

$ ng lint –-help
(will list out all the options available with the lint command)

$ ng lint –-format stylish
(will lint and format the output in a coloured manner)

$ ng lint –-fix
(will lint and fix all the problems if any)

$ ng generate component User
$ ng g c User
(g --> alias for generate, c --> alias for component)
(will create user.component.ts)

$ ng g c star –-flat
(Will not create a /star folder)

$ ng g c star --inline-template --inline-style 
$ ng g c star –it –is
(Will not create template/html and css file, it will be inline in ts file)

$ng g c star --spec false
(Will not create a spec file)

$ ng g c star --prefix pj
(Prefix the component with pj-)


$ ng generate service user-data
$ ng g s user-data
(will create user-data.service.ts)

$ ng generate class user-model
$ ng g c user-model
(will create user-model.ts)

$ ng g module admin
$ ng g m admin 
(It will create admin.module.ts)

$ ng g m sales --routing
(It will create sales.module.ts and sales-routing.module.ts)


LifeCycle hooks in Angular

  • ngOnChanges
    • If a new component is create in Angular and if angular is responsible to create the component then ngOnChanges() method is called.
    • This lifecycle hook is also called when the value of variable decorated with @Input decorator changes.
  • ngOnInit
    • This lifecycle hook calls methos ngOnInit() and it is called when a component is initialized.
    • It does not mean the component has been rendered into the DOM but only means the object has been initialized.
    • ngOnInit() method is called after the constructor of that class.
  • ngDoCheck
    • This lifecycle hooks will run multiple times.
    • This method will be called whenever change detection runs.
    • In run when every there is a change on the DOM like a button press
  • ngAfterContentInit
    • This lifecycle hook is called whenever the content of ng-content has been projected into the view.
  • ngAfterContentChecked
    • Called when change detection happens to ng-content in our component.
  • ngAfterViewInit
    • Called when the view of the component has been finished initialising.(View has been rendered)
  • ngAfterViewChecked
    • Called when all the changes detected by change detection has been completed.
    • Or even when no changes has been detected in our component by change detector.
  • ngOnDestroy
    • Called once the component is about to be destroyed.
    • Best place to do the cleanup work

Using LocalReference with @ViewChild

  • Can be used in place of property binding.
  • Designed to send data between components
  • We can change the DOM data using Element Ref value of ViewChild but it not recommended to use in that way.
  • After Angular8 @ViewChild annotation takes two values.

Changes in app.component.html

    <label>Enter text here</label>
    <input type="text" #textBoxRef>
    <button (click)="onButtonClick()">Click Me</button>
    <p>The text entered in the text box is {{msg}}</p>

Changes in app.component.ts

import { Component, ViewChild, ElementRef } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  @ViewChild('textBoxRef', {static: true})
  textBoxRef: ElementRef;
  title = 'LocalReferenceDemo';
  msg: string;
  onButtonClick(){
    this.msg = this.textBoxRef.nativeElement.value;
  }
}

Output :