Technical Interview Questions

technical_interview_questions.md

Technical Interview - Coding Questions

Create a string and assign it to a variable

var string = "string"

Reverse this string without using jQuery or any indigenous JavaScript methods

function reverse(s) {
  var o = ' ';
  for (var i = s.length - 1; i >= 0; i--)
    o += s[i];
  return o;
}

Create an empty object and assign it to a variable

var object = {}

Give this object keys and values, one of which should be a function

var personOne = {
    hair: "blonde",
    eyes: "blue",
    speakEnglish = function() {
        return "Good morning, everyone";
    }
}

Create 2 new instances of this object

var personTwo = new Object();
personTwo.hair = "brunette";
personTwo.eyes: "brown";
personTwo.speakEnglish = function() {
    return "Good afternoon, everyone";
    }

var personThree = new Object();
personThree.hair = "black";
personThree.eyes: "black";
personThree.speakEnglish = function() {
    return "Good night, everyone";
    }

Create an example of a prototype

function Person(first, last, age, eyecolor) {
    this.firstName = first;
    this.lastName = last;
    this.age = age;
    this.eyeColor = eyecolor;
}

Create an example of a closure

var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();

add();
add();
add();

Technical Interview - Verbal Questions

What is Git, and why is it awesome?

Git is a version control technology that allows a user to save every desired version of their code, while being able to jump to and from different versions. It also pushes to a remote repository so if the local repo is lost, then a user can simply clone the code back to their local machine to begin working again.

What is HTML?

Hypertext Markup Language. It allows a user to build out the structure and layout of their page or app, so they can then use CSS to style it. Think of this like the skeleton of the code.

What is CSS?

Cascading StyleSheet. It allows a user to style their page or app. This is like the flesh and clothing on top of the skeleton of an app.

What's the difference between pseudo classes and pseudo elements?

Pseudo classes select regular elements, but under certain conditions like when an item is being hovered over or a link that has previously been visited. Pseudo elements allow you to style specific attributes of a normal elements.

Can you name some examples of each?

Pseudo classes - :however, :visited pseudo elements - ::first-letter, ::first-line

What is the box model?

CSS box model is a box that wraps around every HTML element.

What are the components that make up the box model?

Content, padding, border, and margin

What is the default value for box-sizing?

content-box

Why is box-sizing helpful?

It allows a user to alter the default CSS box model used to calculate height and width

Explain CSS Specificity.

It is the means by which a browser decides which CSS styles are most relevant to the HTML elements being selected. In order of least to greatest: type selectors like h1, class selectors, and ID selectors

What are some positioning values?

static, absolute, fixed, relative

Explain the difference.

static - default position value. Elements render in order as they appear in document flow absolute - element is rendered relative to its first ancestor element fixed - element is positioned relative to the browser window relative - element is rendered relative to its original position

What are some display values?

inline, block, flex, inline-block

Explain the difference.

• inline - element is displayed as an inline element like
• block - element is displayed as a block element like

• flex - element is displayed as a block-level flex container. This is new to CSS3
• inline-block - Inside of the block is displayed as a block-level box. The contents are displayed as an inline-level box

What is Sass?

Sass is a CSS preprocessor which allows for "syntactic sugar" in CSS. It allows for multiple elements to be nested within a parent element in a prettier way than just plain CSS. It also allows for functions and variables, which will ultimately be reduced to CSS through an SCSS file.

Javascript

What is JavaScript?

The language of the web. Initially used to add functionality to front end pages. Now it's developer and is capable of handling full stack development

What is jQuery?

A fast and concise JavaScript library that helps in handling DOM traversing, event handling, animating, AJAX interactions, etc. for more rapid web development

What is Node?

Node is a server-side, JavaScript runtime platform built on Chrome's V8 JS engine. It uses an event-driven, non-blocking input-output model to make it lightweight and efficient. It's package ecosystem is called npm, or Node Package Manager. It's the target ecosystem of open source libraries in the word.

What is Express?

Express is Node.js framework that provides a robust set of features for web and mobile applications. It can use and create APIs with a myriad of methods and middle and provides a layer of fundamental web application features to the already-existing ones in Node.js

What is an API, and what is it used for?

An API is an application program interface which is a set of routines, protocol and tool for building software applications. It specifies how software components should interact as well as allowing for data retrieval. Especially used when programming GUIs.

What is REST?

Representational State Transfer. It's an architecture style in designing networked applications and the underlying architectural design of the web to communicate between client and server. Simple HTTP verb requests are used to communicate in the application.

What is does it mean to be RESTful?

To utilize REST in an application.

Will you elaborate fully on your experience using APIs?

My experience using APIs boils down to the creation of an app utilizing Google Maps and the Wikipedia APIs as well as several assignments in school that utilized various APIs, among them again the Google Maps API, but also things like IMDB, Star Wars, Giphy, and other such fun things.

What is JSON?

It's an alternative to XML that stands for JavaScript Object Notation. It's a minimal, readable format for structuring stored data.

What is AJAX?

It's a method of exchanging data with a server and updating parts of a web page without reloading the entire page.

What are some differences between SQL and NoSQL databases?

SQL databases are table-based; whereas NoSQL databases are document-based and data is usually stored in key-value pairs. To link information in a SQL database, you utilize join tables; whereas NoSQL databases, specifically thinking of MongoDB here, you utilize key-value pairs linking IDs of one collection as a value to another collection's key.

Which types of SQL databases are you familiar with? (PostgreSQL? SQLite? etc.)

PostgreSQL

Which types of NoSQL databases are you familiar with? (MongoDB? Cassandra? etc.)

MongoDB

What is AngularJS?

What are Angular Directives?

What are Angular Forms?

What are Angular Modules?

What is the Angular $http service and how does it work?

What is ReactJS?

What are React Components?

Explain state in React.

What are props in React?

What does it mean to be stateless?

How did React and Node interact in your portfolio project?

“Rock – Paper – Scissors” Coding Challenge

Hope you know the rules for this game! If not, here is the gist – rock beats scissors, scissors beats paper and paper beats rock.

The objective of this project is to create a functional interface that will allow a user to play this game with a bot as many times as possible within a stipulated amount of time.

Create a page that will have the following:

1. 2 input fields. One will take minutes and the other will take seconds.
2. A block to show the timer.
3. 3 buttons representing rock, paper and scissors. The user should be able to click on a button to indicate his/her choice.
4. A block to show what the bot chose.
5. Have three score blocks to show the number of wins, losses and draws respectively for the user. For example, if the user chose “Rock” and the bot randomly chose “Scissors”, it is a win for the user. If the user and the bot choose the same item, it will be considered a draw for both the user and the bot.
6. A start button. (optional)
7. A restart button.

What should the page do:

1. Allow the user to input a number on each field. This number will represent the maximum time allowed for the user to play.
2. Once the user inputs a number and clicks on the start button, the timer should count down every second starting with the number provided by the user. The timer should stop once it reaches 0.
3. Warn the user once the timer reaches 10 seconds
4. Once the timer starts, allow the user to indicate his/her choice.
5. As soon as the user makes his choice, have the bot make a choice randomly between “Rock”, “Paper” and “Scissors”.
6. The score blocks (wins, losses and draws) should be zero to begin with. Once the bot makes the random choice, determine the outcome based on what the user and the bot chose and then update the score blocks for the user.
7. The restart button should restart the timer (starting from the input number) and reinitialize all scores to zero.
8. The user should be able to play as many times as he/she wishes within the stipulated time (i.e., until the timer reaches 0).
9. Once the timer expires (reaches0) show a message indicating who won.

How the page should be:

• Responsive
• Simple and pretty

Please use:

• HTML5
• CSS3
• Javascript and jQuery
• SASS/LESS is a plus

Please do not use:

• Bootstrap or Foundation
• jQuery plugins

Please create a git repository and work on it. Commit frequently. Once the task is completed, please share the repository link.

Any improvements and enhancements on the above task will be a plus.