This is sapna pandey. I have 2 years of experience as a angular developr.

Coming to my skill sets include

html, css, bootstrap, javascript, jquery, angular. I previously worked in Magneq business solutions LLP. I
worked in a projects like building company's websites such as trading, digital agency. ecommerce
website. selling the products. Mif I talk about my roles and responsibilities. I worked in creating ui
templates . some API integration.Creating components, fixing the bugs. I also involve in client
interactions.

I worked on version 16.

javascript is a high level scripting language. it helps in building web application and interacting web
pages. ts is the superset of js. It adds type to the variable when its declared. so it a strict type language.
js is dynamic type language. it guess the type.

Feature16: reactivity, angular signal,rxjs , server side rendering and hydration enhanced, improved
tooling, configure zone.js,jest testing,

Angular 16 developed by google may 2023, js is library, angular is client side framework helps in
developing web application,

Speed and performance, smaller application, modular application, cross platform, use ts, spa-1html,
other components,

Building block of angular- component, modules, directives, data binding, templates, meta data, services,
dependency injection

Module: it is a class decorated with @ngmodule. Angular application should have atleast 1 module ie.
Root module, app.module.ts. It has metadata such as declaration which has components, import which
contains modules, providers which injects services, bootstrap which tells compiler to operate app
component.

Component: It is a class with the template that deals with the view of application and contains core logic
for the page. It is decorated with @component. It has a metadata such as selector which is an instance
and loads app-root, templateurl which links html file and styleurl which links css file. Url takes path.

Template: Every component has html file which is a component view. It is used for design code.

Services: It is also a class which helps in code reusability. Perform API integration in services. It helps in
transferring data from one component to other just by adding function to the service. Change in
function or values will reflect on other components.

Directive: It changes the structure and behavior of DOM element. It includes loops. Types are:
Structural, Component, Attributes
Dependency injection: Service is a dependency created by provider and injected in the components to
perform its function

Data binding: Communication between view and component . Types: one way data binding, two way
data binding.

Directive: It is used in template.

Service is used only in component.

Style.css file is a global css.

Setup development environment includes IDE(code editor), Nodejs, Npm, Angular CLI(npm i –g
@angular/cli)

Ng new my-app

Ng v

Why nodejs in angular: it host application locally in a system, it contains NPM which manages
dependencies in package.json, it allows third party dependency through angular cli, it transpiles ts to js.

Angular cli: Command line interface which maintains application directly from command shell.

Routing: Loading dynamic components

Interview questions:

1. Pointers: It is a type of variable which stores memory address of another variable

Let a= {value:10}

Let b=a;

In js only object reference variable is a pointer. Value stores in two types of memories. One is heap
stores dynamic data such as object, array and function and another is stack stores static data such as
number, Boolean. Now both variable points value in same memory heap.

2. One way data binding: Binding ts data with html. Types: Interpolation {{ }}, property binding [ ],
attribute binding.
Interpolation: binding any variable in expression
Property binding: binding any property in square bracket with variable
3. Two way binding: update and display same property at same type. It is short cut of onchange()
function. Binding of data in two direction.
4. Directives: It is a class which provides additional features in element. It hides, add styles and
loops. *ngIf, *ngFor, *ngSwitch. To add or remove any DOM element we use ngIf. For displaying
multiple data from array or object we use *ngFor,
5. Observable- send data or do data streaming, observer which fetches the data. We use rxjs
observables. Http request is an observable which observes data until the data is sent.
Continuous observables keep observing the data. Here this.router.data.subscribe((data:Data)){
Console.log(data);
}. Subscribe is an observer.
Observables are independent of components. To leave component, we should unsubscribe
observables. ngOnDestroy(); interval is a observable. Rxjs observable subscribed on interval
ngOnInit(), unsubscribed on ngOnDestroy()
6. Services: It is a class contains data, property or functions used in multiple components.
7. Lazy loading: Applies on routing. In a first load all routes loaded, it becomes slow. Due to lazy
loading it loads specific route/module.
8. Git command: Distributed version Source control tool. Clone complete repository on local
machine. It takes snapshot at every modifications. It follows such as modified, staged,
committed. Create repo in github> download any repo using git url> Use git bash-git clone url
command> git status command- will tell you the status of repo> git log command- all commits
performed> git log –patch : detailed commits> change in file shows modified stage> git add . –
staged state> git restore –staged : go to previous state> git commit –m ‘my first commit’> git
push origin master- push changes to git hub page.
9. What causes memory leak? How to prevent memory leak? When you don’t unsubscribe or
destroy the object you have created is memory leak
10. Usage of let ,var, const: Var is functional scope, you access value anywhere in function, let is a
block scoped, value can be accessed only inside the block, const is a block scoped, you cannot
assign another value for the same variable.
11. Formbuilder: Initialization of formbuilder is easy. It is mostly used for reactive forms. First inject
the formbilder in constructor.
12. Services in anular: Keep API call code in services. We keep component light weight. We keep our
reusable code in service file. It subscribes to observable data in component by dependency
injection.
13. ngModel: Its is a directive used for two way data binding between model and view. It binds
value of element to property in the component class. Changes reflect in two direction.
14. Box element- html element follows box model. Content> padding> border> margin.
Border-box: define size of box according to border rather than content.
15. Use of double equals and triple equals: == checks value, === checks value as well as data type.
16. Prototypes in js: Inherit the features/properties from one object to another. It can be used in
object, array and functions.
17. Event handler:code reacts at certain situation is called event. Two ways to handle events. Event
handler and event listener. EH get triggered based on specific actions on the HTML element. Eg:
onkeypress, onclick attribute.
18. Promise in js: Handle multiple tasks parallel. Promises follows three consitions such as pending,
resolve and reject. To resolve .then()method runs, to reject .catch() method runs. In setimeout
we find pending state.
19. Async await used for promises.
20. Diff between null and undefined: Null is the value is set/initialized but empty, undefined where
the value is not initialized or not declared anywhere.
21. Diff between git fetch and git pull:Git pull is the combination of git fetch and git merge. It just
copy the code from remote repository and merge it without reviewing code. But in git fetch
before merging the code it check the conflicts.
22. Diff between git push and git push –force: git push just push the changes to remote repository
after reviewing the code. Git push –force creates conflict by pushing the changes and overrides
the code in branch.
23. semantic HTML: We can index our website. Semantic means meaning to the element. Before we
used div to create html code. Eg: footer, header, nav, article, aside.
24. How to separate section of text in HTML: three tags are used to separate text. <br>, <p>,
<blockquote>
25. How to display table format in HTML: <table>, <tr>, <th>, <td>
26. Explain hyperlink: Link. It can be word, icon, image, video. Highlighted blue which transfer the
user to other web page.
27. alt attribute in HTML: It is the attribute of image. It is also known as alternate, It takes text as
value. It specifies the alternate text for a image.
28. How are selectors used? There are 5 types of selectors.
Element Selector: select html element and do the styling for it.
ID Selector: When you have similar element and want to apply css separately then use #idname
Class Selector: Use .classname, apply css for multiple element
Universal Selector: Use *, apply css for every elements even body.
Group Selector: target multiple elements and apply css using ,
29. Bootstrap: Build fast and responsive website. Copy cdn. Flexbox, col, row
30. Rxjs(React Javascript): Reactive library in js. It is used to manage data streams and asynchronous
operations. Rxjs provides operators to perform operations on array. Of, map, filter, subscribe to
observable and provide call back function to log results.