Interview Q & A : AngularJS

1. What is AngularJS?

Angular JS is a Javascript framework. Angular JS extends HTML with ng-directives.
The ng-app directive defines an AngularJS application.
The ng-model directive binds the value of HTML controls (input, select, textarea) to application data.
The ng-bind directive binds application data to the HTML view.

2. Why to use AngularJS or what all are the advantages of angular JS?

Advantage of using AngularJS:

i)Supports MVC
ii)Uses the plain javascript objects
iii)A declarative user interface
iv)Filters filter the data before reaching view
v)Write less code

3. How AngularJS is different from other JavaScript Framework?

AngularJS is a framework. It has following features

• Two way data binding
• MVC framework
• Template
• Custom-directive (reusable components)
• REST-friendly
• set up a link for any dynamic page
• Form Validation
• Server Communication
• Localization
• Dependency injection
• Full testing environment

4. What IDEs you can use for AngularJS development?

You can write angular JS in any IDE

5. Compare the features of AngularJS and jQuery?

	Jquery	Angular JS
Restful API	no	yes
Integration test runner	no	yes
MVC support	no	Yes
template	no	yes
two way of binding	no	yes
dependency management	no	yes
AJAX	yes	yes
Unit test runner	yes	yes
cross module communication	yes	yes
form validation	no	yes
Localization	no	yes
file size	32kb	38kb

6. Is AngularJS a library, framework, plugin or a browser extension?

framework

7. What browsers AngularJS support?

Angular JS supports all major browsers, IE8 and above,safari,mozila,chrome etc

8. What is the size of angular.js file?

38kb

9. What are AngularJS features?

AngularJS is a framework. It has following features
1.Two way data binding
2.MVC framework
3.Template
4.Custom-directive (reusable components)
5.REST-friendly
6.set up a link for any dynamic page
7.Form Validation
8.Server Communication
9.Localization
10.Dependency injection
11.Full testing environment

10. How AngularJS handle the security?

i) Define global variables in app-module
ii)Define the service for Authorization
iii)use security in routing

11. What are Modules in AngularJS?

A module is a container for different parts of application

12. What components can be defined within AngularJS modules?

Application name and controller name can be defined in Module

13. What is core module in AngularJS?

To install angular-module-core, simply install it as a dependency in your Node.js project.

14. What is difference between config() and run() method in AngularJS?

The module can have both config and run functions.
The run()could be useful to perform any kind of initialization after the objects instances registered in the module have already been created.
The config() is useful to configure providers before they are actually created

15. What is Global API?

The global APIs are available when the angular.js library is loaded, and you can access them by using the angular object

16. What is Angular Prefixes $?

$ prefix is for angularJS predefined service only.

17. What are Filters in AngularJS?

Filters can be added to expressions and directives using a pipe character.
AngularJS filters can be used to transform data
currency – Format a number to a currency format.
filter – Select a subset of items from an array.
lowercase – Format a string to lower case.
orderBy – Orders an array by an expression.
uppercase – Format a string to upper case.

18. What are Expressions in AngularJS?

AngularJS expressions are written inside double braces: {{ expression }}.Binds data to HTML the same way as the ng-bind directive.it would “output” data exactly where the expression is written.
These are like JavaScript expressions: They can contain literals, operators, and variables.

19. What are Directives in AngularJS?

Angular JS extends attributes called directives
ng-app directive initializes an AngularJS application.
ng-init directive initializes application data.
ng-model directive binds the value of HTML controls (input, select, textarea) to application data.
20. What is the role of ng-app, ng-init and ng-model directives?
ng-app directive initializes an AngularJS application.
ng-init directive initializes application data.
ng-model directive binds the value of HTML controls (input, select, textarea) to application data.

21. What is restrict option in directive?

With the restrict property of a directive’s definition object we can decide where our directive can appear in the DOM. We have four options:
restrict: ‘E’ : The directive can appear only as HTML element
restrict: ‘A’ : The directive can appear only as HTML attribute in an element. This is the default value if restrict is not specified
restrict: ‘C’ : The directive can appear only inside a class attribute of a HTML element
restrict: ‘M’ : The directive can appear only inside a HTML comment.

22. What is bootstrap? Difference between auto bootstrap process and Manual bootstrap in AngularJS?

Bootstrap is a stylesheet.To include Bootstrap in your AngularJS application, add the following line to the head of your document:
<link rel=”stylesheet” href=”http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css“>

23. What is scope in AngularJS?

A $scope is an object that ties a view (a DOM element) to the controller. In the Model-View-Controller structure, this $scope object becomes the model

24. What is $scope and $rootScope?

The $rootScope is the top-most scope that is created on the DOM element that contains the ng-app directive
A $scope is an object that ties a view (a DOM element) to the controller. In the Model-View-Controller structure, this $scope object becomes the model

25. Explain directives ng-if, ng-switch and ng-repeat?

ng-if:
This directive can add / remove HTML elements from the DOM based on an expression. If the expression is true, it add HTML elements to DOM, otherwise HTML elements are removed from the DOM
ng-switch:
This directive can add / remove HTML elements from the DOM conditionally based on scope expression.
ng-repeat:
This directive is used to iterate over a collection of items and generate HTML from it.

Questions & Answer Courtesy by CsharpStar. 

Interview Q & A : jQuery Programming

Q1. What is Jquery in the context of web applications.

jQuery is nothing but a collection of well written javascript code.
In other words Jquery is ready made concise and fast JavaScript Library to be used.

Q2. What are the advantages of using jQuery over JavaScript in ASP.NET web application 

Below are the advatages of using jQery over JavaScript

1.Jquery is well written optimised javascript code so
it will be faster in execution unless we write same standard optimised javascript code.
2.Jquery is concise java script code ,means minimal ammount of code
is to be written for the same functionality than the javascript.
3.Javascript related Development is fast using Jquery because most of the
functionality is already written in the library and we just need to use that.
4.Jquery has cross browser support ,so we save time for supporting all the browsers. 

Q3. How to use jQuery in ASP.NET web application 

To use jQuery in ASP.NET web application follow the below steps:
a)Go to http://jquery.com/(The official jQuery WebSite)
b)Download latest .js jQuery file from the website.
c)Put it the script(or other folder) in the root of your web application
d)Add the below tag on the page where you want to use Jquery
script type="text/javascript" src="script/jQueryDownLoadedFileName.js" /script

Q4. What is the use of Jquery min js file in ASP.NET web application 

JQuery min .js file is actully a minified version of
Actual JQuery .js. The min files have less size but same content so
this improves the performance.so You should prefer to use min files.

Q5. What is the advantages of use of document.ready functions in jQuery 

Advantage of using $(document).ready(function () in jQuery
is that the code inside this function will excecute only when
the full page has been loaded so that there will be no error like
the DOM object on which the Jquery has to execute is not loaded.

Q6. Can we write more than one document.ready jQuery functions in one page 

Yes we can write more than one jquery $(document).ready(function ()
in one page.This is helpful when you have large Jquery code
and you want to split it in multiple files.

Q7. How to select an element with Id in Jquery 

To select an element with Id write as below:
var divValue = $(''#sampleDivId'').val();

Q8. How to select an element with class in Jquery

To select an element with class write as below:
$(".sampleClass").css("border","2px solid blue");

Q9. What is the difference between jQuery find and children methods

The difference between find() and children() methods
are that the children only travels a single level down the DOM tree
while the find travels at all level down the DOM tree.

Q10. How to use length function in jQuery to text existance of an element by Id 

To test if an element exists we can use length method in jQuery as below:
if $(''#mySampleDiv'').length )//Tests wheter the div with id mySampleDiv exists or not
$(mySampleDiv).find(''div'');

Interview Q & A: CSS Style Code

1) What is Cascading Style Sheet (CSS) ?

CSS is used for applying the styles for the HTML elements. So in a typical HTML document CSS will be applied to complete document for styling the elements.

2) What does “Cascading” in CSS mean?

“Cascading” refers to the cascading order in HTML document. This will sort the declared CSS in an order to avoid the conflicts.

3) What are the different types of CSS?

Below are the different types of CSS –

Embedded – Adding the CSS styles in <style> attribute.Inline – Adding the CSS to the HTML elements.Linked/External – Adding the External CSS file to the HTML document.

 

4) Explain the advantages of CSS?

Below are some of the advantages of CSS –

AccessibilityMultiple Device CompatibilityPage will load fastMaintenance is EasyOffline Browsing

5) List out the components of CSS style?

Below are the different components of CSS styles –

Property SelectorValue

6) Explain type selector in CSS?

Type selector matches the element of specific type. To give the color for all inputs with text types, we can do like this.

input[type="text"]{
color: #b2bfc7;
}

7) Explain universal selector in CSS?

Universal selectors is used to match any element types. Below is the example for the same. For example,

* {
color: #FFFFFF;
}

This rule is used to render the content of all elements in our document in white.

8) Explain descendant selector in CSS?

Descendant selectors are used when any style to be applied to an element when the element lies inside some element. For example,

ul em {
color: #FFFFFF;
}

As shown above style applied to element – “<em>” when it lies inside “<li>”.

9) Explain id selector in CSS?

Id selector is used to apply the style to an element based on the “id” of an element. For example,

#elementId {
color: #FFFFFF;
}

In the above code snippet all the elements having id – “elementId” will have the color white.

10) Explain class selector in CSS?

Class selector is used to apply the style to an element based on the “class name” of an element. For example,

.elementClassName {
color: #FFFFFF;
}

In the above code snippet all the elements having class name – “elementClassName” will have the color white.

11) Is it possible to make a class selector for a particular element? If so How?

Yes we can make a class selector for a particular element. Below is the example for the same –

h2.myelementClassName {
color: #FFFFFF;
}

Above example depicts whenever class name – “myelementClassName” found under element “h2” apply white color.
12) How to use external style sheets?

External style sheets will be used to refer the style information from the external file. In HTML document this can be used to refer in the <HEAD> section like below –

<Head>
<Link rel=”stylesheet” href="/MyTestStyle.css" type="text/css">
</ Head >

 

13) Explain “Atrribute Selector” in CSS?

Attribute selector can be used to apply a style for an HTML element with particular attribute. Example gien below is used to apply a style for input element with particular attribute (text)

input[type = "text"]{
color: #FFFFFF;
}

14) Is CSS a case-sensitive or case-insensitive?

CSS is case insensitive.

15) Which property will be used for changing the face of font in CSS?

“font family” property can be used for changing the face of font.

16) How to use grouping in CSS?

Grouping is mainly used for applying css style for multiple HTML elements and this can be done with single declaration. Example gien below is the example of the grouping –

h2, h3
{
color: #FFFFFF;
}

17) Explain child selector in CSS?

Child selectors can be used for applying the style for parent element and this will descend to the child elements. Below is the example -

body > input{
color: #FFFFF1;
}

Above example is used for applying the white color to all the inputs which are lying in body tag.

18) What is the to use “float” property in CSS?

Float property is used to allow an HTML element to be positioned horizontally. Float property can take the values either “left” or “right”. For example,

h1, h2
{
float: right;
}

19) Which property is used to control the position in the background for image?

“background-position” property can be used for controlling the position of the image in background.

20) How do you write a conditional statement in CSS? Give an example.

Below is the example of writing a conditional statement in CSS –

<style type=”text/css”>
body
{
color: #00BFFF;
}
</style>

<!—if [ IE 8] >
<style type=”text/css”>
body
{
Background-color: #00FFBF;
}
</style>
<! [end if] -->

The above code snippet will change the background color to “00FFBF” if the browser is IE 8 or will have a default color if its other browsers.

21) Mention the property name which is used for making the font oblique in CSS?

“font-style” property can be used for making the font oblique.

Interview Q & A: JavaScript Programming

1) What is Javascript?

Javascript is a client side scripting language which is understood by the browsers and will be added in the HTML code.

2) Explain Javascript Types?

Below are some javascript types –

BooleanStringNumberNullObjectFunctionUndefined

3) Why to use NaN in javascript?

“NaN” function is used check the number in the argument. If it does not contain number then it will return true else it will return false.

4) Explain negative infinity?

“Negative Number” is a number which is obtained from dividing the negative number by zero.

5) Can javascript code be broken into multiple lines?

Yes it is possible to break the javascript code to multiple lines using backslash ‘\’.

6) What are undeclared variables in javascript?

Undeclared variables are the ones which does not exist and are not declared in the program. So while running the program runtime error will be thrown.

7) What are undefined variables in javascript?

Undefined variables are the ones which exist in the program but are not defined or not assigned any value for that variable.

8) Explain global variables in javascript?

If the variable can be accessed anywhere in the code is called global variables and these will not have any scope in the application.

9) Explain Prompt box in javascript?

Prompt box is used to get the input from the user by popping up the window to the user.

10) Why to use “this” keyword in javascript?

‘this’ keyword is used to refer the current object in the program. “this” keyword is used mainly inside the method to refer to the current variable or current object.

11) What is “SetTimeOut” function in javascript?

“SetTimeOut” function is used to call the function given as a parameter after some time delay. Below is the javascript code for the same –

setTimeout(function(){ alert("Text to Show"); }, 5000);

12) What is “SetInterval” function in javascript?

“SetInterval” function is used to call the function (given as a parameter) repeatedly after some time delay. Below is the javascript code for the same –

setInterval (function(){ alert("Text to Show"); }, 5000);

13) What is “ClearInterval” function in javascript?

“ClearInterval” function is used to clear the time set from function – “SetInterval()”.

14) How to give comments in javascript?

For single line comment – “//”For multi-line comments – “/* */”

15) Why to use “===” operator in javascript?

“===” operator is called strict operator and it returns true when both the values are same and returns false when the values are not same.

16) How we can submit a form using javascript?

For submitting a form from javascript we have to use – document.form[0].submit() method.

17) Will javascript support automatic conversion of type?

Yes javascript will support automatic conversion of type.

18) How we can change the style of an element from javascript?

Below code can be used to change the style of an element –

document.getElementByID(‘mytestid’).className = “testclass”;

19) How we can change the fontsize from javascript?

Below code can be used to change the font size –

document.getElementByID(‘mytestid’).style.fontsize = “12”;

20) How we can read and write file in javascript?

Below are the ways to read and write files in javascript –

Using Active X objectsUsing Javascript Extension

Interview Q & A: HTML Programming

Hi there!! We know how difficult to crack an interview. It's doesn't matters if you are experts of you subjects or not, a last minute revision is must for all of us.
Here we are providing some selected questions to help you to the last minutes revision.  Best of luck!!

What is HTML?
Answer1:
HTML, or HyperText Markup Language, is a Universal language which allows an individual using special code to create web pages to be viewed on the Internet.

Answer2:
HTML ( H yper T ext M arkup L anguage) is the language used to write Web pages. You are looking at a Web page right now. 
You can view HTML pages in two ways:
* One view is their appearance on a Web browser, just like this page -- colors, different text sizes, graphics.
* The other view is called "HTML Code" -- this is the code that tells the browser what to do.

What is a tag? 
In HTML, a tag tells the browser what to do. When you write an HTML page, you enter tags for many reasons -- to change the appearance of text, to show a graphic, or to make a link to another page.

What is the simplest HTML page? 
HTML Code:
<HTML>
<HEAD>
<TITLE>This is my page title! </TITLE>
</HEAD>
<BODY>
This is my message to the world!
</BODY>
</HTML> 

Browser Display:
This is my message to the world!

How do I create frames? What is a frameset? 
Frames allow an author to divide a browser window into multiple (rectangular) regions. Multiple documents can be displayed in a single window, each within its own frame. Graphical browsers allow these frames to be scrolled independently of each other, and links can update the document displayed in one frame without affecting the others. 
You can't just "add frames" to an existing document. Rather, you must create a frameset document that defines a particular combination of frames, and then display your content documents inside those frames. The frameset document should also include alternative non-framed content in a NOFRAMES element. 
The HTML 4 frames model has significant design flaws that cause usability problems for web users. Frames should be used only with great care.

How can I include comments in HTML? 
Technically, since HTML is an SGML application, HTML uses SGML comment syntax. However, the full syntax is complex, and browsers don't support it in its entirety anyway. Therefore, use the following simplified rule to create HTML comments that both have valid syntax and work in browsers:

An HTML comment begins with "<!--", ends with "-->", and does not contain "--" or ">" anywhere in the comment. 
The following are examples of HTML comments:

* <!-- This is a comment. -->
* <!-- This is another comment,
and it continues onto a second line. -->
* <!---->

Do not put comments inside tags (i.e., between "<" and ">") in HTML markup.

What is a Hypertext link? 
A hypertext link is a special tag that links one page to another page or resource. If you click the link, the browser jumps to the link's destination.

How comfortable are you with writing HTML entirely by hand?

[_private/tble_firefox.htm]

Very. I don’t usually use WYSIWYG. The only occasions when I do use Dreamweaver are when I want to draw something to see what it looks like, and then I’ll usually either take that design and hand-modify it or build it all over again from scratch in code. I have actually written my own desktop HTML IDE for Windows (it’s called Less Than Slash) with the intention of deploying it for use in web development training. If has built-in reference features, and will autocomplete code by parsing the DTD you specify in the file. That is to say, the program doesn’t know anything about HTML until after it parses the HTML DTD you specified. This should give you some idea of my skill level with HTML.

What is everyone using to write HTML? 
Everyone has a different preference for which tool works best for them. Keep in mind that typically the less HTML the tool requires you to know, the worse the output of the HTML. In other words, you can always do it better by hand if you take the time to learn a little HTML.

What is a DOCTYPE? Which one do I use? 
According to HTML standards, each HTML document begins with a DOCTYPE declaration that specifies which version of HTML the document uses. Originally, the DOCTYPE declaration was used only by SGML-based tools like HTML validators, which needed to determine which version of HTML a document used (or claimed to use). 
Today, many browsers use the document's DOCTYPE declaration to determine whether to use a stricter, more standards-oriented layout mode, or to use a "quirks" layout mode that attempts to emulate older, buggy browsers.

Can I nest tables within tables? 
Yes, a table can be embedded inside a cell in another table. Here's a simple example: 

<table>
<tr>
<td>this is the first cell of the outer table</td>
<td>this is the second cell of the outer table,

with the inner table embedded in it
<table>
<tr>
<td>this is the first cell of the inner table</td>
<td>this is the second cell of the inner table</td>
</tr>
</table>
</td>
</tr>
</table>

The main caveat about nested tables is that older versions of Netscape Navigator have problems with them if you don't explicitly close your TR, TD, and TH elements. To avoid problems, include every </tr>, </td>, and </th> tag, even though the HTML specifications don't require them. Also, older versions of Netscape Navigator have problems with tables that are nested extremely deeply (e.g., tables nested ten deep). To avoid problems, avoid nesting tables more than a few deep. You may be able to use the ROWSPAN and COLSPAN attributes to minimize table nesting. Finally, be especially sure to validate your markup whenever you use nested tables.

Can I have two or more actions in the same form?
No. A form must have exactly one action. However, the server-side (e.g., CGI) program that processes your form submissions can perform any number of tasks (e.g., updating a database, sending email, logging a transaction) in response to a single form submission.

How can I use forms for pull-down navigation menus? 
There is no way to do this in HTML only; something else must process the form. JavaScript processing will work only for readers with JavaScript-enabled browsers. CGI and other server-side processing is reliable for human readers, but search engines have problems following any form-based navigation.

How can I avoid using the whole URL? 
The URL structure defines a hierarchy (or relationship) that is similar to the hierarchy of subdirectories (or folders) in the filesystems used by most computer operating systems. The segments of a URL are separated by slash characters ("/"). When navigating the URL hierarchy, the final segment of the URL (i.e., everything after the final slash) is similar to a file in a filesystem. The other segments of the URL are similar to the subdirectories and folders in a filesystem. 
A relative URL omits some of the information needed to locate the referenced document. The omitted information is assumed to be the same as for the base document that contains the relative URL. This reduces the length of the URLs needed to refer to related documents, and allows document trees to be accessed via multiple access schemes (e.g., "file", "http", and "ftp") or to be moved without changing any of the embedded URLs in those documents. 
Before the browser can use a relative URL, it must resolve the relative URL to produce an absolute URL. If the relative URL begins with a double slash (e.g., //www.yoursite.com/faq/html/), then it will inherit only the base URL's scheme. If the relative URL begins with a single slash (e.g., /faq/html/), then it will inherit the base URL's scheme and network location. 
If the relative URL does not begin with a slash (e.g., all.html , ./all.html or ../html/), then it has a relative path and is resolved as follows.

1. The browser strips everything after the last slash in the base document's URL and appends the relative URL to the result.
2. Each "." segment is deleted (e.g., ./all.html is the same as all.html, and ./ refers to the current "directory" level in the URL hierarchy).
3. Each ".." segment moves up one level in the URL hierarchy; the ".." segment is removed, along with the segment that precedes it (e.g., foo/../all.html is the same as all.html, and ../ refers to the parent "directory" level in the URL hierarchy). 

Some examples may help make this clear. If the base document is <URL:http://www.yoursite.com/faq/html/basics.html>, then

all.html and ./all.html
refer to <URL:http://www.yoursite.com/faq/html/all.html> 
./
refers to <URL:http://www.yoursite.com/faq/html/> 
../
refers to <URL:http://www.yoursite.com/faq/> 
../cgifaq.html
refers to <URL:http://www.yoursite.com/faq/cgifaq.html> 
../../reference/
refers to <URL:http://www.yoursite.com/reference/> 

Please note that the browser resolves relative URLs, not the server. The server sees only the resulting absolute URL. Also, relative URLs navigate the URL hierarchy. The relationship (if any) between the URL hierarchy and the server's filesystem hierarchy is irrelevant.

Careers in Web Design: Become a Professional Web Designer

If you're going to make Web design or Web development your career, there are many things you'll want to think about. It's important to know what you're getting into before you decide on a job including how much it pays.

Where to Start

If you're thinking of becoming a professional Web designer, there are a number of things to consider. Firstly, there are many different avenues you can take as a professional Web developer. You can also choose to go freelance or work in a corporation. And being a Web developer isn't all fun and games - make sure you know what the job will entail. Finally, getting education is a great way to make sure you're prepared.

With the rapid advancement of technology, it is necessary to constantly update yourself in order to keep up with the latest trend or technology and succeed in this field. This is where passion for the industry and the drive to excel come in handy. Self improvement is a must for all web designers.

Get qualified

You won’t need a degree in order to become a Web Designer. However, you will need a good knowledge of coding, as well as experience with the most common Web Design programs.