Web Development

What is accomplished by returning false from (a) a jQuery event handler, (b) a regular JavaScript onclick event handler for an anchor tag, and (c) a regular JavaScript onclick event handler for a non-anchor tag (e.g., a div, button, etc.)?

(a) Returning false from a jQuery event handler is effectively the same as calling both preventDefault() and stopPropagation() on the passed jQuery event object. (b) Returning false from a regular JavaScript onclick event handler for an anchor tag prevents the browser from navigating to the link address and stops the event from propagating through the DOM. (c) Returning false from a regular JavaScript onclick event handler for a non-anchor tag (e.g., a div, button, etc.) has absolutely no effect. Comment

1 megabyte (mb) = ?

1,000,000 bytes

Where should you use Node.js?

1. I/O bound apps 2. Data streaming apps 3. Data intensive real-time apps (DIRT) 4. JSON APIs based apps 5. Single page apps

jQuery provides a useful .clone() method to create a deep copy of matching elements. Answer the following questions: 1. What is meant by a "deep copy"? 2. What is normally not included in the cloned copy? How can some of this behavior be controlled? 3. What is a potential "gotcha" when using the .clone() method? (HINT: What is an element attribute that you would generally not want to clone?)

1. The .clone() method performs a deep copy of the set of matched elements, meaning that it copies the matched elements as well as their descendant elements and text nodes. 2. What is normally not included in the cloned copy? How can some of this behavior be controlled? Normally: Objects and arrays within element data are not copied and will continue to be shared between the cloned element and the original element. To deep copy all data, you must copy each one "manually". Any event handlers bound to the original element are not copied to the clone. 3. Using .clone() has the potentially problematic side-effect of producing elements with duplicate id attributes, which are supposed to be unique. Therefore, when cloning an element with an id attribute, it's important to remember to modify the id of the clone, before inserting it into the DOM.

How does Node.js work?

A Node.js application creates a single thread on its invocation. Whenever Node.js receives a request, it first completes its processing before moving on to the next request. Node.js works asynchronously by using the event loop and callback functions, to handle multiple requests coming in parallel. An Event Loop is a functionality which handles and processes all your external events and just converts them to a callback function. It invokes all the event handlers at a proper time. Thus, lots of work is done on the back-end, while processing a single request, so that the new incoming request doesn't have to wait if the processing is not complete. While processing a request, Node.js attaches a callback function to it and moves it to the back-end. Now, whenever its response is ready, an event is called which triggers the associated callback function to send this response.

What are promises?

A Promise is a proxy for a value not necessarily known when the promise is created. It allows you to associate handlers with an asynchronous action's eventual success value or failure reason. This lets asynchronous methods return values like synchronous methods: instead of immediately returning the final value, the asynchronous method returns a promise to supply the value at some point in the future. A Promise is in one of these states: pending: initial state, neither fulfilled nor rejected. fulfilled: meaning that the operation completed successfully. rejected: meaning that the operation failed. Syntax: new Promise( /* executor */ function(resolve, reject) { ... } );

Callback

A function that is passed to another function (otherFunction) as a parameter, and the callback function is called inside the otherFunction, usually after other necessary code is executed.

What is control flow function? (Node)

A generic piece of code which runs in between several asynchronous function calls is known as control flow function.

MongoDB

A popular NoSQL database. It uses a document-oriented model opposed to a table-based relational model like SQL. Stores data in BSON format (compressed JSON)

Scripting language

A programming language that supports scripts: programs written for a special run-time environment that automate the execution of tasks that could alternatively be executed one by one by a human operator. These languages are often interpreted rather than compiled and are referred to as very high-level programming languages.

What is Node.js and what are it's benefits?

A server-side platform built on google chrome's javascript engine for easily building fast and scalable network applications. Node.js uses an event-driven, nonblocking I/O model that makes it lightweight and efficient, perfect for data-intensive real-time applications that run across distributed devices. Node.js is an open source, cross-platform runtime environment fro developing server-side and networking applications. Features/benefits: 1. Asynchronous and event driven - all APis of Node.js library are asynchronous (non-blocking). The server moves to the next API after calling it and a notification mechanism of Events in Node helps the server to get a response from the previous API call. 2. Single threaded but highly scalable - Node uses a single threaded model with event looping. Event mechanism helps the server to respond in a non-blocking way and makes the server highly scalable as opposed to traditional servers which create limited threads to handle requests. Node's single threaded program can provide service to a much larger number of requests than traditional servers like Apache HTTP Server. 3. No buffering - Node applications never buffer any data. These applications simply output the data in chunks. 4. Node.js library uses JavaScript Cons: a) Any intensive CPU computation will block node.js responsiveness, so a threaded platform is a better approach. b) Using relational database with Node.js is considered less favourable

What is stateless communication?

A stateless protocol does not require the server to retain information or status about each user for the duration of multiple requests.

What are streams? (Node)

A stream is nothing but an EventEmitter and implements some specials methods. Depending on the methods implemented, a stream becomes Readable, Writable, or Duplex (both readable and writable). For example, in a Node.js based HTTP server, request is a readable stream and response is a writable stream. You might have used fs module which lets you work with both readable and writable file streams.

What is imperative/procedural programming?

A style of OOP in which behavior reuse is performed via a process of reusing existing objects via delegation that serve as prototypes.

Relational Database

A table and it's columns compare to another table and its column.

Operator overloading

A type of polymorphism where different operators have different implementations depending on their arguments.

Graphs (data structure)

Abstract nodes of a network structure with a set of vertices (nodes) connected by edges. They are the essence of social networks and geographic maps.

Mongoose

An ODM (like ORM but without promises) that provides MongoDB with structure and validation so that you limit MongoDB inputs to specific types and layout

Sequalize

An ORM (object relationship mapping) for SQL based on promises. A node package.

What is an anonymous function? When should they be used?

An anonymous function is a function that was declared without any named identifier to refer to it. As such, an anonymous function is usually not accessible after its initial creation. Often used in callbacks.

Node.js

An open-source, cross platform JavaScript runtime environment designed to be run outside of browsers.

What is an unhandled exception?

An unscheduled interruption of normal program processing. When an error occurs, the compiler checks to see if there are any instructions available to handle that error. Let's say a letter gets put into a numeric field. The compiler asks if there is any way to handle that error. If there is, that code is run. The following scenarios could cause an unhandled exception: 1. Dividing by zero 2. Trying to read/write a file that isn't there 3. Trying to access an array element that doesn't exist 4. Using the wrong data type 5. Failure to convert string-to-number and vice versa 6. Security violation Exception handling is the process of responding to the occurrence, during computation, of exceptions - anomalous or exceptional conditions requiring special processing - often changing the normal flow of program execution.

What is a runtime environment (RTE)?

As soon as a software program is executed, it is in a run-time state. In this state, the program can send instructions to the computer's processor and access the computer's memory (RAM) and other system resources. RTE allows the program to be run in an environment where the programmer can track the instructions being processed by the program and debug any errors that may arise. While developers use RTE software to build programs, RTE programs are available to everyday computer users as well,e.g software such as Adobe Flash Player

What is AJAX?

Asynchronous JavaScript And XML It is not a tool, but a concept. AJAX is a method of building interactive applications for the Web that process user requests immediately, exchanging data with a server and updating parts of a web page without reloading the entire page. AJAX combines several programing tools including javascript, dynamic HTML, XML, CSS, the DOM, and the XMLHttpRequest object. Benefits: 1. Callbacks - Ajax is used to perform a callback, making a quick round trip to and from the server to retrieve and/or save data without posting the entire page back to the server. 2. Making Asynchronous Calls - This allows the client browser to avoid waiting for all data to arrive before allowing the user to act once more. 3. User-Friendly - Because a page postback is being eliminated, Ajax enabled applications will always be more responsive, faster and more user-friendly.

What are HEAP Tables? (MySQL)

Basically HEAP tables are in-memory and used for high speed temporary storages. But TEXT or BLOB fields are not allowed within them. They also do not support AUTO INCREMENT.

What is "callback hell" and how can it be avoided?

Callback hell refers to heavily nested callbacks that have become unweildy. EX: query("SELECT clientId FROM clients WHERE clientName='picanteverde';", function(id){ query("SELECT * FROM transactions WHERE clientId=" + id, function(transactions){ transactions.each(function(transac){ query("UPDATE transactions SET value = " + (transac.value*0.1) + " WHERE id=" + transac.id, function(error){ if(!error){ console.log("success!!"); }else{ console.log("error"); } }); }); }); }); Best way: PROMISES Another way to fix this issue is referred to as "modularization". The callbacks are broken out into independent functions which can be called with some parameters. EX: var logError = function(error){ if(!error){ console.log("success!!"); }else{ console.log("error"); } }, updateTransaction = function(t){ query("UPDATE transactions SET value = " + (t.value*0.1) + " WHERE id=" + t.id, logError); }, handleTransactions = function(transactions){ transactions.each(updateTransaction); }, handleClient = function(id){ query("SELECT * FROM transactions WHERE clientId=" + id, handleTransactions); }; query("SELECT clientId FROM clients WHERE clientName='picanteverde';",handleClient);

What is the difference between classical inheritance and prototypal inheritance?

Class Inheritance: instances inherit from classes (like a blueprint — a description of the class), and create sub-class relationships: hierarchical class taxonomies. Instances are typically instantiated via constructor functions with the `new` keyword. Class inheritance may or may not use the `class` keyword from ES6. Prototypal Inheritance: instances inherit directly from other objects. Instances are typically instantiated via factory functions or `Object.create()`. Instances may be composed from many different objects, allowing for easy selective inheritance.

Media Queries

Define how CSS styles are applied in relation to the size characteristics of the viewing device. Always declare them last in a css file so they are not overwritten.

What are the disadvantages of AJAX?

Dependent on javascript. Security issues: AJAX source code is readable. Attackers can insert script into the system. Debugging is difficult.

What Is EventEmitter In Node.Js?

Events module in Node.js allows us to create and handle custom events. The Event module contains "EventEmitter" class which can be used to raise and handle custom events. It is accessible via the following code. // Import events module var events = require('events'); // Create an eventEmitter object var eventEmitter = new events.EventEmitter(); When an EventEmitter instance encounters an error, it emits an "error" event. When a new listener gets added, it fires a "newListener" event and when a listener gets removed, it fires a "removeListener" event. EventEmitter provides multiple properties like "on" and "emit". The "on" property is used to bind a function to the event and "emit" is used to fire an event.

What is a prototype in JavaScript?

Every JavaScript object has a prototype. The prototype is also an object. All JavaScript objects inherit their properties and methods from their prototype. The standard way to create an object prototype is to use an object constructor function: function Person(first, last) { this.firstName = first; this.lastName = last; this.name = function() {return this.firstName + " " + this.lastName;}; } var myFather = new Person("John", "Doe", 50, "blue"); You can add new properties and methods to an existing object: myFather.nationality = "English"; myFather.name = function () { return this.firstName + " " + this.lastName; }; You have to add a new property to a prototype in a different way because it's not an existing object: Person.prototype.name = function() { return this.firstName + " " + this.lastName; };

What is XML?

Extensible Markup Language It is used to describe data. The XML standard is a flexible way to create information formats and electronically share structured data via the internet. Both XML and HTML contain markup symbols to describe page or file contents. EX: <?xml version="1.0" standalone="yes"?> <conversation> <greeting>Hello, world!</greeting> <response>Stop the planet, I want to get off!</response> </conversation>

What are the common HTTP request types?

GET: retrieve data from a specified resource. POST: submit data to be processed to a specified resource. PUT: update a specified resource. DELETE: delete a specified resource.

What are response codes in HTTP?

HTTP response codes standardize a way of informing the client about the result of its request.

What are HTTP messages made of?

Header: contains metadata, such as encoding information, and the important HTTP methods Body: contains data that you want to transmit over the network, can often remain empty.

What is blocking code? How does node prevent it?

If application has to wait for some I/O operation in order to complete its execution any further then the code responsible for waiting is known as blocking code. Node gets around this with callback functions. Instead of asking to read a file and waiting for the operating system to come back with a file handler or buffer, the a callback function is invoked when the operation is completed, freeing the server to handle additional requests.

What are meant by Joins in MySQL?

In MySQL the Joins are used to query data from two or more tables. The query is made using relationship between certain columns existing in the table. There are four types of Joins in MySQL. Inner Join returns the rows if there is at least one match in both the tables. Left Join returns all the rows form the left table even if there is no match in the right table. Right Join returns all the rows from the right table even if no matches exist in left table. Full Join would return rows when there is at least one match in the tables.

What Is Package.Json? Who Uses It? (Node)

It is a plain JSON (JavaScript Object Notation) text file which contains all metadata information about Node.js Project or application. This file should be present in the root directory of every Node.js Package or Module to describe its metadata in JSON format. The file is named as "package" because Node.js platform treats every feature as a separate component. Node.js calls these as Package or Module. Who Use It? NPM (Node Package Manager) uses <package.json> file. It includes details of the Node.js application or package. This file contains a no. of different directives or elements. These directives guide NPM, about how to handle a module or package.

Define functional programming (FP)

It is the process of building software by composing pure functions, avoiding shared state, mutable data, and side-effects. Functional programming is declarative rather than imperative, and application state flows through pure functions. Contrast with object oriented programming, where application state is usually shared and colocated with methods in objects. Vocab: pure function - Given the same inputs, always returns the same output, and has no side-effects. function composition - is the process of combining two or more functions in order to produce a new function or perform some computation. shared state - is any variable, object, or memory space that exists in a shared scope, or as the property of an object being passed between scopes. immutability - An immutable object is an object that can't be modified after it's created.

What does "favor object composition over class inheritance" mean?

It means that code reuse should be achieved by assembling smaller units of functionality into new objects instead of inheriting from classes and creating object taxonomies. In other words, use can-do, has-a, or uses-a relationships instead of is-a relationships. Good to hear: -Avoid class hierarchies. -Avoid brittle base class problem. -Avoid tight coupling. -Avoid rigid taxonomy (forced is-a relationships that are eventually wrong for new use cases). -Avoid the gorilla banana problem ("what you wanted was a banana, what you got was a gorilla holding the banana, and the entire jungle"). -Make code more flexible.

What is JSON? Why is it better than XML?

JavaScript Object Notation It is a lightweight data-interchange format. XML uses more words than necessary compared to JSON, making JSON faster since it takes longer to parse XML. JSON is easier to represent in code. JSON's data structure is a map whereas XML is a tree.

Can you name two programming paradigms important for JavaScript app developers?

JavaScript is a multi-paradigm language, supporting imperative/procedural programming along with OOP (Object-Oriented Programming) and functional programming. JavaScript supports OOP with prototypal inheritance.

What selector would I use to query for all elements with an ID that ends with a particular string? Also, how would I modify the selector to retrieve only <div> elements whose IDs end with that same string?

Let's say you want to retrieve all elements whose IDs end with "txtTitle". This could be done using the following selector: $("[id$='txtTitle']") To retrieve only <div> elements whose IDs end with "txtTitle", the selector would be: $("div[id$='txtTitle']")

What are nested functions and how do they work?

Nested functions are functions defined inside of another function. They are local to their parent function and can be called anywhere within their parent function's scope. Ex: function doProcess(a, b){ function doLocalProcess1(){ .. } function doLocalProcess2(){ .. } .. doLocalProcess1(); .. doLocalProcess2(); .. }

MVC

Model - ORM, Databases View - HTML, CSS, Frontend JS Controller - routes which are used for getting and sending info. handles requests and responses

What does asynchronous mean?

Multiple events are happening independently of one another.

Can you access DOM in node?

No, you cannot access DOM in node.

What is typically the first argument passed to a Node.js callback handler?

Node.js core modules, as well as most of the community-published ones, follow a pattern whereby the first argument to any callback handler is an optional error object. If there is no error, the argument will be null or undefined. A typical callback handler could therefore perform error handling as follows: function callback(err, results) { // usually we'll check for the error before handling results if(err) { // handle error somehow and return } // no error, perform standard callback handling }

What is the event loop in Node.js?

Node.js uses events heavily and it is also one of the reasons why Node.js is pretty fast compared to other similar technologies. As soon as Node starts its server, it simply initiates its variables, declares functions and then simply waits for the event to occur. In an event-driven application, there is generally a main loop that listens for events, and then triggers a callback function when one of those events is detected.

How does Node.js handle child threads?

Node.js, in its essence, is a single thread process. It does not expose child threads and thread management methods to the developer. Technically, Node.js does spawn child threads for certain tasks such as asynchronous I/O, but these run behind the scenes and do not execute any application JavaScript code, nor block the main event loop.

What are the pros and cons of functional programming vs object-oriented programming?

OOP Pros: It's easy to understand the basic concept of objects and easy to interpret the meaning of method calls. OOP tends to use an imperative style rather than a declarative style, which reads like a straight-forward set of instructions for the computer to follow. OOP Cons: OOP Typically depends on shared state. Objects and behaviors are typically tacked together on the same entity, which may be accessed at random by any number of functions with non-deterministic order, which may lead to undesirable behavior such as race conditions. FP Pros: Using the functional paradigm, programmers avoid any shared state or side-effects, which eliminates bugs caused by multiple functions competing for the same resources. With features such as the availability of point-free style (aka tacit programming), functions tend to be radically simplified and easily recomposed for more generally reusable code compared to OOP. FP also tends to favor declarative and denotational styles, which do not spell out step-by-step instructions for operations, but instead concentrate on what to do, letting the underlying functions take care of the how. This leaves tremendous latitude for refactoring and performance optimization, even allowing you to replace entire algorithms with more efficient ones with very little code change. (e.g., memoize, or use lazy evaluation in place of eager evaluation.) Computation that makes use of pure functions is also easy to scale across multiple processors, or across distributed computing clusters without fear of threading resource conflicts, race conditions, etc... FP Cons: Over exploitation of FP features such as point-free style and large compositions can potentially reduce readability because the resulting code is often more abstractly specified, more terse, and less concrete. More people are familiar with OO and imperative programming than functional programming, so even common idioms in functional programming can be confusing to new team members. FP has a much steeper learning curve than OOP because the broad popularity of OOP has allowed the language and learning materials of OOP to become more conversational, whereas the language of FP tends to be much more academic and formal. FP concepts are frequently written about using idioms and notations from lambda calculus, algebras, and category theory, all of which requires a prior knowledge foundation in those domains to be understood.

Define Object Oriented Programming (OOP)

OOP refers to a type of computer programming (software design) in which programmers define not only the data type of a data structure, but also the types of operations (functions) that can be applied to the data structure.

ORM

Object Relational Mapper Converts data between incompatible system types. You set up a basic form (like a blue print) that you would only change the value that you need to change, and it will simplify the process of adding and adjusting data.

What is REPL? What purpose it is used for?

REPL stands for (READ, EVAL, PRINT, LOOP). Node js comes with bundled REPL environment. This allows for the easy creation of CLI (Command Line Interface) applications.

SSH

Secure Shell (SSH) is a cryptographic network protocol that provides administrators with a secure way to access a remote computer. It provides authentication and secure encrypted data communications between two computers connecting over an insecure network such as the internet. An SSH tunnel uses the client-server model, connection a secure shell client application, the end at which the session is displayed, with an SSH server, the end at which the session runs.

What is REST

Representational State Transer An architecture style for designing networked applications that relies on a stateless, client-server protocol, almost always HTTP. Treats server objects as resources that can be created or destroyed. A REST API defines a set of functions which developers can use to perform requests and receive responses via HTTP protocol such as GET and POST. REST insists that HTTP methods (GET, POST, etc...) be used for their intended purpose. For example, a POST request should be used to send new data, not to retrieve data. It's a requirement of a REST API that the client and server are independent of each other. Example of jQuery's AJAX method consuming a REST service: $(document).ready(function() { $.ajax({ url: "http://rest-service.guides.spring.io/greeting" }).then(function(data) { $('.greeting-id').append(data.id); $('.greeting-content').append(data.content); }); });

Uniqueness (algorithmic value)

Results of each step are uniquely defined and only depend on the input and the results of the preceding steps.

What is an XMLHttpRequest and what are its properties and methods??

Sends data in the background. Receives data. Updates data without reloading the page. Properties: onReadyStateChange, readyState, responseText, responseXML methods: open(), send(), setRequestHeader()

Describe the different roles of HTTP

Server and client: in general, the client always initiates the conversation; the server replies. HTTP messages are essentially bits of text, but the body can contain other media such as JSON.

How does Node.js support multi-processor platforms, and does it fully utilize all processor resources?

Since Node.js is by default a single thread application, it will run on a single processor core and will not take full advantage of multiple core resources. However, Node.js provides support for deployment on multiple-core systems, to take greater advantage of the hardware. The Cluster module is one of the core Node.js modules and it allows running multiple Node.js worker processes that will share the same port.

What is asynchronous programming, and why is it important in JavaScript?

Synchronous programming means that, barring conditionals and function calls, code is executed sequentially from top-to-bottom, blocking on long-running tasks such as network requests and disk I/O. Asynchronous programming means that the engine runs in an event loop. When a blocking operation is needed, the request is started, and the code keeps running without blocking for the result. When the response is ready, an interrupt is fired, which causes an event handler to be run, where the control flow continues. In this way, a single program thread can handle many concurrent operations. User interfaces are asynchronous by nature, and spend most of their time waiting for user input to interrupt the event loop and trigger event handlers.

What is the difference between synchronous and asynchronous requests?

Synchronous request blocks the user until response is retrieved whereas asynchronous doesn't block the user.

Explain the difference between the .detach() and .remove() methods in jQuery.

The .detach() and .remove() methods are the same, except that .detach() retains all jQuery data associated with the removed elements and .remove() does not. .detach() is therefore useful when removed elements may need to be reinserted into the DOM at a later time.

Explain the .promise() method in jQuery, including how and why it would be used. Consider the code snippet below. If there are 5 <div> elements on the page, what will be the difference between the start and end times displayed? function getMinsSecs() { var dt = new Date(); return dt.getMinutes()+":"+dt.getSeconds(); } $( "input" ).on( "click", function() { $( "p" ).append( "Start time: " + getMinsSecs() + "<br />" ); $( "div" ).each(function( i ) { $( this ).fadeOut( 1000 * ( i * 2 ) ); }); $( "div" ).promise().done(function() { $( "p" ).append( "End time: " + getMinsSecs() + "<br />" ); }); });

The .promise() method returns a dynamically generated Promise that is resolved once all actions of a certain type bound to the collection, queued or not, have ended. It takes two optional arguments: type - By default, type is "fx", which means that the returned Promise is resolved when all animations of the selected elements have completed. target - If a target object is specified, .promise() will attach to it and then return this object rather than create a new one. In the code sample provided, the difference between the start and end times displayed will be 10 seconds. This is because .promise() will wait for all <div> animations (in this case, all fadeOut() calls) to complete, the last of which will complete 10 seconds (i.e., 5 * 2 seconds) after the animation starts.

Generality (algorithmic value)

The algorithm can be applied to a wide variety of inputs, so that it's use is not overly specific

When is classical inheritance an appropriate choice? What about prototypal inheritance?

The answer is never, or almost never. Certainly never more than one level. There is more than one type of prototypal inheritance: -Delegation (i.e., the prototype chain). -Concatenative (i.e. mixins, `Object.assign()`). -Functional (Not to be confused with functional programming. A function used to create a closure for private state/encapsulation). Each type of prototypal inheritance has its own set of use-cases, but all of them are equally useful in their ability to enable composition, which creates has-a or uses-a or can-do relationships as opposed to the is-a relationship created with class inheritance. Good to hear: -In situations where modules or functional programming don't provide an obvious solution. -When you need to compose objects from multiple sources. -Any time you need inheritance.

What is the difference between Node.js vs Ajax?

The difference between Node.js and Ajax is that, Ajax (short for Asynchronous Javascript and XML) is a client side technology, often used for updating the contents of the page without refreshing it. While,Node.js is Server Side Javascript, used for developing server software. Node.js does not execute in the browser but by the server.

What's the difference between document.ready() and window.onload()?

The document.ready() event occurs when all HTML documents have been loaded, but window.onload() occurs when all content (including images) has been loaded. So generally the document.ready() event fires first.

What are status codes in HTTP?

The first line of the HTTP response is called the status line and includes a numeric status code such as "404" and a textual reason phrase such as "Not Found". The way the user agent handles the response primarily depends on the code.

What are the two types of API functions in Node.js ?

The two types of API functions in Node.js are a) Asynchronous, non-blocking functions b) Synchronous, blocking functions

What are two-way data binding and one-way data flow, and how are they different?

Two way data binding means that UI fields are bound to model data dynamically such that when a UI field changes, the model data changes with it and vice-versa. One way data flow means that the model is the single source of truth. Changes in the UI trigger messages that signal user intent to the model (or "store" in React). Only the model has the access to change the app's state. The effect is that data always flows in a single direction, which makes it easier to understand. One way data flows are deterministic, whereas two-way binding can cause side-effects which are harder to follow and understand. Good to hear: -React is the new canonical example of one-way data flow, so mentions of React are a good signal. Cycle.js is another popular implementation of uni-directional data flow. -Angular is a popular framework which uses two-way binding.

HTTP vs HTTPS?

Using HTTPS, the client and server agree on a "code" between them, encrypting all of the data sent between one another.

What are Persistent Connections with HTTP?

When a connection is kept alive to handle more than one request (improves speed of response from requests).

Give an example of how to make an AJAX call with vanilla javascript (XMLHttpRequest) vs jquery.

With "vanilla" JavaScript: function loadXMLDoc() { var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == XMLHttpRequest.DONE ) { if (xmlhttp.status == 200) { document.getElementById("myDiv").innerHTML = xmlhttp.responseText; } else if (xmlhttp.status == 400) { alert('There was an error 400'); } else { alert('something else other than 200 was returned'); } } }; xmlhttp.open("GET", "ajax_info.txt", true); xmlhttp.send(); } With jQuery: $.ajax({ url: "test.html", context: document.body, success: function(){ $(this).addClass("done"); } });

Consider following code snippet: { console.time("loop"); for (var i = 0; i < 1000000; i += 1){ // Do nothing } console.timeEnd("loop"); } The time required to run this code in Google Chrome is considerably more than the time required to run it in Node.js. Explain why this is so, even though both use the v8 JavaScript Engine.

Within a web browser such as Chrome, declaring the variable i outside of any function's scope makes it global and therefore binds it as a property of the window object. As a result, running this code in a web browser requires repeatedly resolving the property i within the heavily populated window namespace in each iteration of the for loop. In Node.js, however, declaring any variable outside of any function's scope binds it only to the module's own scope (not the window object) which therefore makes it much easier and faster to resolve.

Can functions return other functions?

Yes

How can this code be fixed to work properly even with buttons that are added later dynamically? // define the click handler for all buttons $( "button" ).bind( "click", function() { alert( "Button Clicked!" ) }); /* ... some time later ... */ // dynamically add another button to the page $( "html" ).append( "<button>Click Alert!</button>" );

You can replace bind() with on() which attaches the handler to all current and future buttons.

Using the event loop what are the tasks that should be done asynchronously? (Node)

a) I/O operations b) Heavy computation c) Anything requiring blocking

What is event driven programming?

event driven programming is a programming paradigm in which the flow of the program is determined by events like messages from other programs or threads. It is an application architecture technique divided into two sections 1) Event Selection 2) Event Handling

Explain and contrast the usage of event.preventDefault() and event.stopPropagation()

event.stopPropagation() stops an event from bubbling up the event chain, whereas event.preventDefault() only precludes the browser's default action on that event from occurring, but the event still propogates up the event chain. EX: // in this example, 'foo' is a div containing button 'bar' $("#foo").click(function() { // mouse click on div 'foo' }); $("#bar").click(function(e) { // mouse click on button 'bar' e.stopPropagation(); }); Due to the call to stopPropagation() in the button's click handler, the event never propogates to the div so its click handler never fires. It effectively stops parent elements from knowing about an event on their children. In contrast, if you replaced the above call to stopPropagation() with a call to preventDefault(), only the browser's default action would be precluded, but the div's click handler would still fire.

Tables (SQL)

Equivalency of Mongo Collections. One step below Database within SQL, that is made up of rows.

ISP

Internet Service Provider. We contact each other with IP addresses (addresses for your computer)

Markup language

Involves a set of tags that define roles for each piece of content such as image, paragraph header.

Lexical Scope

It impacts what variables can be seen inside of/affect inner variables, to separate which variables can be adjusted within separate functions

Browser

It is an application program that provides a way to look at and interact with all the information on the world wide web.

Sequalize Benefits

It makes creating and working with SQL databases easier and provides easy access to multiple databases. Open source and easy to install.

Data persistence

Keeping data around to be reused through out a client session on a server

Session Storage

Lasts as long as the tab is open.

Trees (data structure)

Non sequential data structures made of parent-child relationships, and because of this they do not loop they only progress downward from parent to child to child to child...

Rows (SQL)

Similar to Documents within Mongo DBs. These are like the keys whose value is referred to as columns

Information Architecture

Structural design of a website's navigation and. The art and science of organizing and labelling websites, intranets, online communities and software to support usability and findability.

Unit Tests

Test individual pieces of functionality.

What does HTML generate?

The DOM (Document Object Model). It defines the outline/map of the content in the website.

Schemas

The code we use to set up the database structure like the tables and columns

Which of the two lines of code below is more efficient? Explain your answer. document.getElementById( "logo" ); or $( "#logo" );

The first line of code is more efficient and faster. The jQuery version will trigger a call to the pure javascript version. jQuery is built on top of javascript and uses its methods under the hood to make DOM manipulations easier, at the cost of some performance overhead.

Big O

The worst case scenario of time complexity for a program

What's the deal with the "$" in jQuery? What can you do if you want to use another library that also uses "$" for naming?

$ has no special meaning in javascript so it is free to be used in object naming. In jQuery, it's simply used as an alias for the jQuery object and jQuery function. You can call the jQuery.noConflict() method frees up "$" and makes it necessary to use the name "jQuery" in its place. EX: <script src="other_lib.js"></script> <script src="jquery.js"></script> <script> $.noConflict(); // Code that uses other library's $ can follow here. </script> Alternatively you can use a closure: (function ($) { // Code in which we know exactly what the meaning of $ is } (jQuery));

Given the following HTML: <div id="expander"></div> and the following CSS: div#expander{ width: 100px; height: 100px; background-color: blue; } Write code in jQuery to animate the #expander div, expanding it from 100 x 100 pixels to 200 x 200 pixels over the course of three seconds.

$( "#expander" ).animate( { width: "200px", height: "200px", }, 3000 );

1 terabyte = ?

1 trillion bytes

Sequalize Model

A representation of the table in the database

Promises

Constructors that take one argument, a callback with two parameters - resolve and reject. Do something within the callback, perhaps async, then call resolve if everything worked, otherwise call reject. A promise object represents the eventual completion (or failure) of an asynchronous operation and its returning value.

Continuous Deployment

Deploying after addition piece of code is pushed to the master branch

Accessibility Testing

Designed to see how well the program interacts with screen readers and other tools.

Collection (MongoDB)

Equivalency of SQL Tables. One step below Database within Mongo, that is made up of documents.

JSON

JavaScript Object Notation. Simple JavaScript objects used in an interchangeable notation

Mounting

Making a group of files in a file system structure accessible to a user or user group. In some usages, it means to make a device physically accessible.

SQL

Structured Query Language. It is a type of database storage language.

SQL

Structured Query Language. It is the standard language for relational database management systems.

Index Route

The route that will be hit when there is no path defined. Basicall the default route (localhost://3000/)

Servers

These are machines with specialized software that send content to your browser when you access a website. Also in charge of managing interaction with databases.

1 kilobyte (kb) = ?

1024 bytes

1 byte = ?

8 bits When you have a byte you can represent up to 256 total possible values. Correlates with the ASCII system

Abstract data type

A data type where only behavior is defined but not implementation (the opposite of concrete data type (CDT)). Examples: Array, List, Queue, Stack, Tree...

NoSQL

A database that provides a mechanism for storage and retrieval of data that is modeled in means other than traditional row-column tables in relational databases like MySQL. Better than SQL at: (1) large volumes of rapidly changing structured, semi-structured, and unstructured data, (2) quick schema iteration and frequent code pushes, (3) object-oriented programming that is easy to use and flexible, (4) horizontally scalable.

jQuery

A fast, small, and feature-rich javascript library. It simplifies a lot of complicated in javascript so that they take less lines of code. Features: HTML/DOM manipulation, CSS manipulation, HTML event methods, effects and animations, AJAX, utilities.

What is method chaining in jQuery and what advantage does it offer?

A feature of jQuery that allows several methods to be executed on a jQuery selection in sequence in a single code statement. EX: $( "button#play-movie" ).on( "click", playMovie ) .css( "background-color", "orange" ) .show(); Benefits: with chaining the button only needs to be selected one time, whereas without chaing, jQuery must search the whole DOM and find the button before each method is applied, giving better performance and more concise code. Note: this obstacle can also be overcome by assigning a variable to the jQuery selection and call all of the methods on that variable.

Proxy Server

A server that acts as an intermediary for requests from clients seeking resources from other servers.

Definition of "algorithm"

A set of steps you follow to achieve a particular result

Advantages of MongoDB

Allows you to have more users using the same DB. It is able to expand with ease. It is much more open with the type of information that is stored within the DB whereas SQL requires all values to have to have the same type.

React

An open-source JS library for developing user interfaces. It was developed for the purpose of building large apps with data that is subject to rapid changes over time. Relies on a component-based architecture, and each element of the UI is treated as subcomponents to larger components

API

Application Programming Interface. Offers a set of predefined routines used to communicate between two programs.

Why is 8 bits used as a storage container?

Because it is a useful size of measure 8 can express useful notions These days computers can use many more placeholders due to their increased computing power ex: 32bits, now 64 bits Can use compression Can waste bits (ex: columns not being used to convey low numbers)

Serving IP addresses

Can also put IP addresses into web browser and it'll act like a www and take you to that website [a domain name (www...com)is just a user friendly way to contact that IP address on your behalf]. Purchasing a domain name does not give you an IP address You need a machine to act as a server and configure to the domain name purchased (put info into DNS to point to an IP address) Steps: 1. Buy domain name 2. Purchase a host (to host the files)

Node.js Benefits

Can be used to write server side code (the backend). Easily extendable because there are multiple plugins that exist to expand the capabilities of Node.js. Single Threaded Asynchronous Mode meaning it can handle multiple requests at once instead of requiring the program to go step by step.

CSS

Cascading Style Sheets. Defines a set of rules for how the DOM is translated visually. Describes the priority of how styles are rendered.

Compatibility Testing

Checks how well your code works for multiple environments like different browsers.

Continuous Integration

Constantly adding your code to the master, like frequent posts to GitHub rather than going weeks between pushes.

Linked List (data structure)

Data structures in which each element or node of the list is sequentially joined to the next node. Major difference is that they are not stored contiguously in memory. They keep track of the position of the element using pointers which explicitly point to the connected item.

Load Tests

Designed to see how well your code will operate once multiple users begin to access it, and will determine failure points and behavior of code under higher than expected load conditions.

Object-relational impedance mismatch (OIM)

Difficulties that are often encountered when a relational database management system (RDBMS) is being served by an application program (or multiple application programs) written in an object-oriented programming language or style, particularly because objects or class definitions must be mapped to database tables defined by a relational schema.

DOM

Document Object Model. An application programming interface (API) for valid HTML. It defines the logical structure of documents and the way a document is accessed and manipulated.

Arrow functions ( => )

Functions that must be named and called later, and cannot be "anonymous" When you declare this type of function, any time it references "this" it will be referencing it in the location that the function is declared. Makes it so you don't have to bind()

Crowd source

Give a task to a group of people to complete it Ex: bit torrent Downloading illegal movies Some are legitimate (allows computer to act as client and a server) Ex: if I download a bit of data I THEN can distribute the portion I downloaded to others ( so I can be the server too)

VPN (virtual private network)

Gives you an IP address of a computer somewhere else. Must be connected to internet. Send all requests through internet, then through a server and that server sends data out on your behalf. Encrypts everything you're doing.

HTML

HyperText Markup Language Means that documents are not meant to be viewed linearly, but designed to be linked to others

Performance Tests

Inspects for speed and are usually done to compare the speed upgrade between old code and new code.

Webpack

It is a module bundler that takes modules with dependencies and generates static assets representing those modules. How is webpack different from other module bundlers? (1) code splitting - webpack has two types of dependencies in its dependency tree: sync and async. Async dependencies act as split points and form a new chunk. After the chunk tree is optimized, a file is emitted for each chunk. (2) loaders - webpack can only process JavaScript natively, but loaders are used to transform other resources into JavaScript. By doing so, every resource forms a module. (3) clever parsing - webpack has a clever parser that can process nearly every 3rd party library. (4) plugin system - this allows you to customize webpack for your needs and distribute common plugins as open source.

RAM

It is the physical hardware inside a computer that temporarily stores data, serving as the computer's "working" memory. It is needed to use data quickly (it's faster than running the same data directly off of a hard drive).

Describe the qualities of JavaScript

JavaScript is: interpreted - not compiled, case sensitive, C based, variables can change type dynamically, uses dot notation with objects

Is HTML a programming language?

No, it's a markup language. It describes a structure, it in of itself is not a program/process.

NPM

Node Package Manager is two things: 1. An online repository for the publishing of open-source Node.js packages/modules. 1. A command-line utility for interacting with said repository that aids in package installation, version management, and dependency management.

Columns (SQL)

Similar to Fields in Mongo This is where the actual information is stored, and they are like the value within an object where the "key" is the "row"

Dictionaries/Maps (data structure)

Similar to hybrid btwn objects and arrays. They are the solution to looping through objects by containing keys and values. Included in ES6

Documents (MongoDB)

Similar to rows within SQL tables. These are like the keys whose value is referred to as fields.

Cookies

Small files which are stored on a user's computer. They are designed to hold a modest amount of data specific to a particular client and website, and can be accessed either by the web server or the client computer. This allows the server to deliver a page tailored to a particular user, or the page itself can contain some script which is aware of the data in the cookie and so is able to carry information from one visit to the website to the next.

CPU

The "brain" of the computer. It is responsible for executing a sequence of stored instructions called a program. This program will take inputs from an input device, process the input in some way and output the results to an output device.

Finiteness (algorithmic value)

The algorithm stops after a finite number of instructions are executed.

DNS (Domain Name Server)

The internet's equivalent of a phone book. They maintain a directory of domain names and translate them to internet protocol (IP) addresses.

Asynchronous problem

The issue when you call on a variable or function that has not yet been defined for use. We use callbacks and promises to subvert this issue.

Database (SQL)

The outside container of SQL where the total of information is held. (MySQL is an example of a relational database management system based on structured query language). Advantages: retrieve large amounts of records quickly, has well defined standards, no coding required.

Precision (algorithmic value)

The steps are specifically defined so that the information isn't incorrectly recorded.

Primary Key

The unique value that you are calling on to retrieve the data from another table.

Props (React)

These are the variables and methods that are typically passed to a child from its parent class.

States (React)

These are typically the variables and methods that are created by the child itself. The component will re-render every time its state changes

Document Database

They are set up similar to JSONs so they excel at heterogeneous data formats and are easy to implement

Fields (MongoDB)

This is where the actual information is stored, and they are like the value with and object where the "key" is the "document"

Integration Tests

Used to see how the individual code modules will work once they have been brought together.

Server-Side Storage

Used when you need to access information in other places. Allows the web designer to have more control of the data.

Defaults (function parameters)

We can add defaults to functions by defining them in the function declaration. ex: var newStudent = (name="jon doe", age=18){...}

Client-Side Storage

When the information is stored on the clients machine. Ex: local storage, session storage, cookies

End-to-End Testing

When you run every possible type of test for a program, and is usually conducted for large updates, changes, and creations.

What is the difference between kQuery.get() and jQuery.ajax()?

jQuery.ajax() is the all-encompassing AJAX request method provided by jQuery. It allows for the creation of highly customized AJAX requests with options for how long to wait for a response, how to handle a failure, whether the request is blocking (synchronous) or non-blocking (asynchronous), what format to request for the response, and many more options... jQuery.get() is a shortcut method for GET specific requests that uses ajax() under the hood.

Compliance Testing

testing to see if your code actually meets the specifications and requirements given by the customer.

1 gigabyte (gb) = ?

1 billion bytes