UI Developer Interview Questions & Answers

Question 1. Name 3 Of The Minimum Html Elements Needed For An Html Document.

Answer :

!DOCTYPE html | html | body | head | (title kind-of)

Question 2. What Is Semantic Html?

Answer :

HTML using markup that also conveys the containing content. HTML5 has more semantic tags than prior versions (nav | aside | article | header | footer), but using descriptive classes and id’s could also be an example of semantic markup.

Question 3. If You Have An Issue With Your Page, How Do You Debug It, What Tools Do You Use?

Answer :

Looking for common debugging practices like W3c validator, Firebug, Chrome Dev Tools.

Question 4. Call An External Style Sheet And An External Script Located In The Root Folder Called Style.css And Main.js With Html.

Answer :

Question 5. Name 4 New Elements In Html5 That Were Not Available In Previous Html Versions.

Answer :

canvas | audio | svg | header | footer | aside | article | nav | section etc…

Question 6. Name 3 Attributes Of The Position Property.

Answer :

static, absolute, fixed, relative, inherit.

Question 7. Name Some Online Resources You Reference When Having Css Issues.

Answer :

Mozilla, Stack Overflow, CSS-Tricks . . .

Question 8. What Is A Css Reset. What Is The Difference Between A Css Reset And Normalize.css

Answer :

CSS Reset removes browser default styles. Normalize.css sets a standard across all browsers (It does not ‘reset’ them).

Question 9. How Would You Solve A Floated Div’s Parent Height.

Answer :

Clearfix, Float Parent as well, User overflow property other than ‘visible’.

Question 10. Declare All Elements With Class Of “blue-text” To Have A Text Color Of Blue.

Answer :

blue-text {color: blue;}

Question 11. How Do You Include A Comment In Css

Answer :

/* This is a Comment */

Question 12. Is Javascript Case Sensitive?

Answer :

Yes

Question 13. What Are 2 (shorthand) Boolean Operators Supported By Javascript

Answer :

or ||, and &&, not equal to !

Question 14. What Is The Difference Between “==” And “===”

Answer :

“==” checks equality, “===” checks equality and type

Question 15. What Is The Result Of “20” + 20;

Answer :

2020

Question 16. What Javascript Method Would Convert The String “20” To An Integer (on The Fly) So “20” + 20 = 40?

Answer :

parseInt(“20″) + 20;

Question 17. What Is An Ajax Request And What Is A Simple Example Of Where A Ajax Request Would Be Used?

Answer :

Asynchronous JavaScript and XML. Client side process used for GET, POST etc to get new data without having to refresh the page.

Question 18. Assign Any Variable Name A Value Of “hello World”, And Print That Variable’s Contents To The Console.

Answer :

var t = “Hello World”;  
console.log(t);

Question 19. Create An Array In Javascript With A List Of 4 Colors, Assign That Array To The Variable, ‘colors’.

Answer :

var colors = [‘red, ‘yellow’, ‘green’, ‘blue’];

Question 20. How Do You Include A Comment In Javascript?

Answer :

/* This is a comment block */ 
//This is a commented out line 

Question 21. Loop Through The Color Array And Print Each Value To The Console. Assume You Do Not Know The Amount Of Colors In The Color Array.

Answer :

var colors = [‘red, ‘yellow’, ‘green’, ‘blue’];
for( var i = 0; i < colors.length; i++ )
{ 
console.log(colors[i]); 
}

Question 22. Create A New Javascript Object With The Keys Of “fname” Equal To Your First Name, “lname” Equal To Your Last Name, And “fcolors” Equal To And Array Of 3 Of Your Favorite Colors. Assign This Object To A Variable Called “me” And Log It To The Console.

Answer :

var me = {“fname”: “Riley”, “lname”: “Hilliard”, “fcolors”:[“blue”, “green”, “whitesmoke”]};
console.log(me);
// or
var me = {};
me.fname = “Riley”;
me.lname = “Hilliard”;
me.fcolors = [“blue”, “green”, “whitesmoke”];
console.log(me);

Question 23. What Is Jquery

Answer :

A JavaScript Framework/Library that make things like DOM selection/manipulation, AJAX, and animation, easier.

Question 24. What Programming Language Does Jquery Use?

Answer :

JavaScript

Question 25. Is Jquery Code Exicuted On The Clientside, Or Serverside?

Answer :

Clientside

Question 26. How Do You Install/use Jquery In A Project. What Is The Minimum Setup Needed To Start Using Jquery.

Answer :

script tag, linked to a jquery CDN or locally hosted file.

Question 27. How Do You Select All Elements With The Class Of “selected” In Jquery?

Answer :

$(‘.selected’);

Question 28. Can Jquery Be Used To Make An Ajax Request?

Answer :

Yes

Question 29. Declare A New Variable In Php Equal To The Number 3;

Answer :

$number = 3;

Question 30. How Do You Check If A Variable Has Been Set In Php?

Answer :

isset($var);

Question 31. How Do You Access A Get Requests Url Parameter With Php?

Answer :

$_GET[“urlkey”]

Question 32. How Do You Check If A Variable Has Not Been Set In Php?

Answer :

!isset($var);

Question 33. What Is The Difference Between Require() And Include() When An Error Is Encountered?

Answer :

include() will raise a warning if it fails, require() will raise a fatal error.

Question 34. What Is A Simple Php Method To Make A Cross Domain Data Request?

Answer :

file_get_contents().

Question 35. Inside A Php Function, What Param Needs To Be Set In Order To Access A Global Variable?

Answer :

function function_name(){ 
global $the_global_var;
} 

Question 36. What Is The Current Major Version Of Bootstrap?

Answer :

3.x.x

Question 37. What Css Class Do You Use To Span 12 Columns On Medium Sized Screens But Only 6 Columns On Large Screens In The Latest Version Of Bootstrap?

Answer :

class=”col-md-6 col-lg-12″

Question 38. Name 3 Available Jquery Plugins That Bootstrap Has In Their Query Plugin Library.

Answer :

Modal, Dropdown, Scrollspy, Tab, Tooltip, Popover, Alert, Button, Collapse, Carousel, Affix.

Question 39. What Minimum Things Do You Have To Do In Order To Include Bootstrap & Boostrap Js In A Project/ Html Document.

Answer :

Add bootstrap.css/bootstrap.js link and script in the head of the HTML document *bonus if bootstrap.js script included in the footer (better for page loading).

Question 40. Who Is Ui/ux Developer? What He Does?

Answer :

As the name suggest UI / UX stands for User Interface Design or User Experience Design. The role of UI / UX developer is to focus on the way the functionality is displayed and the detail on how users interact with the users.  They code for the functioning of the front end interface or User Interface.