Friday, June 29, 2018

Interview BostonByteLLC

1. Difference between visibility hidden and display none.
Ans : display :none  remove the element from DOM while hidden will not remove it will hide only.

2. Life Cycle hook 
Ans : https://interview-preparation-for-you.blogspot.com/2018/02/lifecycle-hook-of-component.html
3. What happen in ngDoCheck?
Ans :
DoCheck function is used to catch any changes within the angular component that cant be caught in any other way. so basically this “ngDoCheck()” function will run every time there is any kind of changes happen in the Angular Component. it will run when a variable value is changed that basic things also can be captured from this function.

4. How to optimize the preformance of angular application?
5. Where do we add java script library in angular?
Ans: There are three ways 1. Adding in HTML <html lang="en"> <script src="https://nexplayer.nexplayersdk.com/latest/nexplayer.js"> </script> <head> </head> <body> <app-root></app-root> </body> </html> 2. Adding in angular.json or .angular-cli.json "scripts": [ "../node_modules/jsplugin/dist/js/plugin.js", //Other script files ], 3. adding in component import * as Timeline from '../assets/js/timeline.js'; 6. How and when will you do code review in angular?
Ans : https://www.evoketechnologies.com/blog/code-review-checklist-perform-effective-code-reviews/
7. What is cors?
Ans : https://interview-preparation-for-you.blogspot.com/2018/03/easy-ploicy.html
8. How will you implement security in angular?
Ans : https://interview-preparation-for-you.blogspot.com/2018/12/security-in-angular.html
9. What is man in middle attack?
Ans
A man-in-the-middle (MitM) attack is when an attacker intercepts communications between two parties either to secretly eavesdrop or modify traffic traveling between the two. Attackers might use MitM attacks to steal login credentials or personal information, spy on the victim, or sabotage communications or corrupt data.
10. How will you create enum in mysql?
Ans : At the time of table creation we can create eunm CREATE TABLE shirts ( id INT PRIMARY KEY AUTO_INCREMENT, name VARCHAR(35), size ENUM('small', CONCAT('med','ium'), 'large', 'x-large') );
https://www.javatpoint.com/mysql-enum
11. What is DOCTYPE in html?
Ans : Doctype stands for Document Type Declaration. It informs the web browser about the type and version of HTML used in building the web document. This helps the browser to handle and load it properly.
https://www.bitdegree.org/learn/doctype-html
12. What is interceptor?
Ans : Interceptors are a unique type of Angular Service that we can implement. Interceptors allow us to intercept incoming or outgoing HTTP requests using the HttpClient. By intercepting the HTTP request, we can modify or change the value of the request.
https://ultimatecourses.com/blog/intro-to-angular-http-interceptors
13. How will you do caching in interceptor?
Ans : https://blog.logrocket.com/caching-with-httpinterceptor-in-angular
14. How component will communicate?
Ans using Input, Output, ViewChild and services
15. How will you get the data from Route?
Ans: using AcivateRoute
16. Lazy loading in angular?
Ans : https://interview-preparation-for-you.blogspot.com/2018/12/lazy-loading-in-angular.html
17. Any challenge you have faced in angular application ?
18. How will you send value form parent to child using Input explain step by step?
19. Have you worked on any Continution Integration tool?
20. Deploying process of app in IOS on app store.
21. What is trigger in SQL Server?
22. What do you know about responsive design?
23. Why do we not use table layout in html?
Ans :

It's better for SEO not to use tables
Why? Can anybody show some evidence that it is? Or a statement from Google that tables are discouraged from an SEO perspective?

Tables are slower.

An extra tbody element has to be inserted. This is peanuts for modern web browsers. Show me some benchmarks where the use of a table significantly slows down a page.

24. Difference between relative and absolute position.
Ans : https://interview-preparation-for-you.blogspot.com/2021/05/what-is-relative-positioningwhen-you.html
25. What is push notification in IOS development?
26. What is new in angular5?
Ans : https://interview-preparation-for-you.blogspot.com/2018/12/difference-between-angular-4-and.html

Thursday, June 28, 2018

Encapsulation in Angular

CSS Encapsulation with Angular Components

If no encapsulation used than each component will have there own style and they will not affect others.

Global style defined in style.css and embedded in index.html are global for all components and will be applied to all.

If classes defined in child component have same style as in global css then child component style will be applied on child html.

We have an app component(parent) and two child component

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

@Component({
  selector: 'demo-app',
  template: `
    <h3>CSS Encapsulation with Angular</h3>
    <div class="cmp">
      App Component
      <first-cmp></first-cmp>
      <second-cmp></second-cmp>
    </div>
  `
})
export class App {
  constructor() { }
}


We link a separate style sheet into our index.html that has a single global style rule that will be applied to any element with the CSS class of cmp.


.cmp {
  padding: 6px;
  margin: 6px;
  border: 2px solid red;
}

There are three mode of Encapsulation
Emulated (default)
Native
None

1. Emulated (default)

When using this mode Angular will identify each component using two unique attributes: _nghost-* and _ngcontent-*. Any component styles will be added to the head using these attributes to isolate the styles as in the example below.

Create a different style for component which has used Emulated.

<head>
  <style>
    .container[_ngcontent-ikt-1] { ... } 
  </style>
</head>
<body>
  <my-app>
    <song-track _nghost-ikt-1>
      <div _ngcontent-ikt-1 class="container"></div>
    </song-track>
  </my-app>
</body>

Note the attributes added to the root and content of our component in bold. You can explicitly activate this mode by using the code below

@Component({
  selector: 'song-track',
  encapsulation: ViewEncapsulation.Emulated
})

2. Native

Turning on this feature will force browsers to use the Shadow DOM. For browsers that understand the Shadow DOM this creates a new rendering context for a given element that is completely isolated from the rest of the DOM. This is true native CSS encapsulation but it is not enabled by default in Angular. So lets look at the code and the generated output.

If we want that our component will not inherit styles from global style.css than use Native.

Create a completely different element using shadow dom and style so tag will not be affected by other styles.

Disable CSS Encapsulation

If you want to disable CSS encapsulation use ViewEncapsulation.None.

there are occasions where we would like a component’s CSS to not be encapsulated and apply globally to our application. Angular offers an easy way to disable CSS encapsulation. In this case  Child component style will overrride parent style.

So in case of style and element will not be updated they will remain same and get affected by last one defined.

Tuesday, June 19, 2018

ngNonBindable

If you want to display a string in curly braces than use ngNonBindable. ngNonBindable prevent angular to parse a tag.
<p ngNonBindable > ((hello)) <p>

Monday, June 11, 2018

Interview

1. Write synchronous and asynchronous code in only javascript.
A
ns : Synchronous code
console.log('1');
console.log('2');
console.log('3')
Asynchronous code
console.log('1')
setTimeout(function afterTwoSeconds() {
console.log('2')
}, 2000)
console.log('3')

2. What is typescript
Ans : TypeScript is an open-source language which builds on JavaScript.

 
3. What is transpilation
Ans : Transpilers, or source-to-source compilers, are tools that read source code written in one programming language, and produce the equivalent code in another language.

4. In test.js we have written console.log("Hello"); Now i have changed the test.js to test.ts. Is that print "Hello". there is no node js is installed. How can we print "Hello" without using any IDE like VS Code, Visiual Studio.

Ans : TypeScript is its own thing which isn't tied to any framework/library. You can use it with regular JS, other frameworks like React, etc. You can even use it on the server-side with Node.
Then, install TypeScript globally by running this in your terminal:
$ npm install -g typescript
Then, all you have to do is create a TypeScript file like script.ts and write TypeScript inside of it. When you want to compile it, just run this in your command line:
$ tsc script.ts
If you're working on a larger project with multiple TS files, it helps to set a TypeScript configuration file to handle how TypeScript works with your project. You can do so by running:
$ tsc --init
This will automatically create a tsconfig.json file for you which will allow you to start using TypeScript in your project. To compile the entire project, you just need to run:
$ tsc

5. Which version of node js is using.
6. Suppose there are version 9.4.3, 8.2.1, 7.4.6, and you are using 5.2.1..then which version you will upgrade yourself.
Ans : Last stable version (LTS)

7. In version x.y.z  what is the meaning of x, y ,z.
Ans : Major Minor Build
 
8. Write promise code.
Ans : var promise = new Promise(resolve,reject){
resolve(10);
}

9. How to start Node Js application from scratch.
Ans : 1. npm init (this will create package.json) 2. npm install express ( for require module you have required express)

 
10. Supoose you have a folder name "yourproject" in any drive. and you run npm start, what depencies it will download or what it will do.

11. What is package.json
Ans : https://interview-preparation-for-you.blogspot.com/2018/12/what-is-use-of-packagejson.html

12. If i removed package.json, then what will be happen.

13. What information package.json have.
Ans : https://interview-preparation-for-you.blogspot.com/2018/12/what-is-use-of-packagejson.html

14. If i deployed a project in deployment server and i remove the package.json. Then what will be happen.
15. If nothing is happen after removing the packegae.json what will the future impact.
16. Which version of express i am using.
17. What is export keyword. what is does.
18. suppose we have two scenarion like below
A) Export class One
{
//something...
}
B) Export class One(same name)
{
//something
}
Is there is any clash in name, because we are using same name.
If not how the Node JS handle this
19. What is my project architecture
20. Explain ICP2 
21. Which stream i am using
22. What are the different stream avalable in Node JS
23. What are Module used in project
24. Overloading in express like app.use('myName', handler) and app.use(sender)...difference between them.
25. What is PM2.
26. How to run application using PM2.
27. Whice module are using for MongoDb.
28. What is diferent between ('mongodb').MongoClient and Mongoose
29. How to handle if the connection is broken with node js application
30. Which version of mongodb is using
31. How it is difference from SQL server or any other traditinal database
32. what are others NoSql DB, like redish or any other he was asking i forgot name.
33. How you will choose the technology for building the Application like C#, MVC or Node Js
34. Why you have choosen MongoDB.
35. What is AWS and how to use it.
36. How Node JS handle the Multiple request and how c# handle the multiple request.
38. HMO(High availablity in mongoDB). Means replica set. Master Slave working of MongoDb
39. LibUV

Friday, June 8, 2018

Cold vs Hot Observables

Hot obserbvable like live play  if anyone would come late the show will not be repeated while cold observable like recorded movie if any one would come late he can back forward on his channel.

Observables can be classified into two main groups: hot and cold Observables. Let's start with a cold Observable.

const obsv = new Observable(observer => {

  setTimeout(() => {
    observer.next(1);
  }, 1000);

  setTimeout(() => {
    observer.next(2);
  }, 2000);

  setTimeout(() => {
    observer.next(3);
  }, 3000);

  setTimeout(() => {
    observer.next(4);
  }, 4000);

});

// Subscription A
setTimeout(() => {
  obsv.subscribe(value => console.log(value));
}, 0);

// Subscription B
setTimeout(() => {
  obsv.subscribe(value => console.log(`>>>> ${value}`));
}, 2500);
View Example

In the above case subscriber B subscribes 2000ms after subscriber A. Yet subscriber B is starting to get values like subscriber A only time shifted. This behavior is referred to as a cold Observable. A useful analogy is watching a pre-recorded video, such as on Netflix. You press Play and the movie starts playing from the beginning. Someone else can start playing the same movie in their own home 25 minutes later.

Means: Each subscribe method will re execute Observable logic. And production will start only if there is a subscribe.

On the other hand there is also a hot Observable, which is more like a live performance. You attend a live band performance from the beginning, but someone else might be 25 minutes late to the show. The band will not start playing from the beginning and the latecomer must start watching the performance from where it is.

We have already encountered both kind of Observables. The example above is a cold Observable, while the example that uses valueChanges on our text field input is a hot Observable.

Converting from Cold Observables to Hot Observables
A useful method within RxJS API is the publish method. This method takes in a cold Observable as its source and returns an instance of a ConnectableObservable. In this case we will have to explicitly call connect on our hot Observable to start broadcasting values to its subscribers.

Means: Each subscribe method will not execute Observable logic. And production will start even if there is no subscribe.

const obsv = new Observable(observer => {

  setTimeout(() => {
    observer.next(1);
  }, 1000);

  setTimeout(() => {
    observer.next(2);
  }, 2000);

  setTimeout(() => {
    observer.next(3);
  }, 3000);

  setTimeout(() => {
    observer.next(4);
  }, 4000);

}).publish();

obsv.connect();

// Subscription A
setTimeout(() => {
  obsv.subscribe(value => console.log(value));
}, 0);

// Subscription B
setTimeout(() => {
  obsv.subscribe(value => console.log(`      ${value}`));
}, 2500);
View Example

In the case above, the live performance starts at 1000ms, subscriber A arrived to the concert hall at 0s to get a good seat and our subscriber B arrived at the performance at 2500ms and missed a bunch of songs.

Another useful method to work with hot Observables instead of connect is refCount. This is an auto connect method, that will start broadcasting as soon as there is more than one subscriber. Analogously, it will stop if the number of subscribers goes to 0; in other words, if everyone in the audience walks out, the performance will stop.

Source : https://angular-2-training-book.rangle.io/handout/observables/cold_vs_hot_observables.html

Thursday, June 7, 2018

RSystem

Code review.....which parameter is based on code review.

2. How to do unit testing.

3. Any testing tool is used or not
Ans :  n-unit frame work 

4. Task runner angular

5. Performance optimization

6. Load balancing of user hitting the website

7. How to check sp is slow in SQL
Ans : using Activity Monitor or using SQL Server Profiler

8. How to run web api on both internet and intranet. What will be the architecture?
Ans : 

9. Authentication in Angular
Ans : Can be achieved using Auth gaured

10. ZWT token for angular

11. What is Lazy Loading in angular?
Ans : Can be achieved using loadChldren. 

12. What is ChangeDetectionStrategy in angular?

Helm

1. What is pure function?
Ans : Function which has same out for same input are called pure function.

2. How to write closure in c#
Ans : using func delegate we write closure

3. Difference between func and action delegate
Ans Func used for function that return value, Action used for function that does not return value.

4. What is functional programming?

5. What are automatic properties in c#?

6. How use caching in angular?

7. Describe event sourcing pattern.
8. What is templateref, Containerref?

@Inject()

@Inject used for useValue provider type, If there is a value that should in injected instead of class than use @Inject.


The only time we’d need to use @Inject is alongside something like an OpaqueToken - which creates a unique blank token to be used as a dependency injection provider.

The reason we use @Inject is because we cannot use an OpaqueToken as the type of a parameter, for instance this will not work:

const myToken = new OpaqueToken('myValue');

@Component(...)
class ExampleComponent {
  constructor(private token: myToken) {}
}
Here, myToken is not a Type, it’s a value - which means TypeScript cannot compile it. However, when we introduce @Inject alongside an OpaqueToken, things will work out nicely:

const myToken = new OpaqueToken('myValue');

@Component(...)
class ExampleComponent {
  constructor(@Inject(myToken) private token) {
    // use the provider for `token`
  }
}

This gives you an example of using @Inject for manually specifying tokens to be injected, as well as showing that the token can be anything. This means, we’re not restricted to what TypeScript classifies as a “type”.

@Injectable() Angular

It’s a common misbelief that this is a required decorator on any class that we plan on injecting into a component/service in our apps. This may change however, as there is a current issue to make @Injectable() mandatory (however this is pretty fresh and may not land for a while, or ever).

When using Angular decorators, the decorated class stores metadata about itself in a format that Angular can read - this includes the metadata about what dependencies it needs to fetch and inject.

If no Angular decorator has been used on a class there is no way for Angular to read what dependencies it requires. This is why we need to use @Injectable().

If our service injects providers we must add @Injectable(), which providers no extra functionality, to tell Angular to store that metadata it needs.

Therefore, if our service looks like this:

export class UserService {
  isAuthenticated(): boolean {
    return true;
  }
}
We don’t need to decorate it to be able to inject it into a component for example, because it doesn’t inject any providers itself.

However, if our service looks like this and contains a dependency (Http):

import { Http } from '@angular/http';

export class UserService {
  constructor(private http: Http) {}
  isAuthenticated(): Observable {
    return this.http.get('/api/user').map((res) => res.json());
  }
}
This would break as the Http provider metadata would not be stored for Angular to compose it correctly.

We can simply add @Injectable() to solve this:

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

@Injectable()
export class UserService {
  constructor(private http: Http) {}
  isAuthenticated(): Observable {
    return this.http.get('/api/user').map((res) => res.json());
  }
}
At this point, Angular is aware of the Http token and can supply it to http.

Source : https://toddmotto.com/angular-dependency-injection

Friday, June 1, 2018

Closure in C#

Using Func delegate we can achieve Closure in C#.

static void Main(string[] args)
{
    var inc = GetAFunc();
    Console.WriteLine(inc(5));
    Console.WriteLine(inc(6));
}

public static Func GetAFunc()
{
    var myVar = 1;
    Func inc<int,int> = delegate(int var1)
                            {
                                myVar = myVar + 1;
                                return var1 + myVar;
                            };
    return inc;
}

Or you can write with lambda


public static Func GetAFunc()
{
    var myVar = 1;
    Func inc<int,int> = (var1)=>
                            {
                                myVar = myVar + 1;
                                return var1 + myVar;
                            };
    return inc;
}


Output
7
9

Followers

Link