Introducción

Repaso de MarkDown

  • ¿Como se escribe en MarkDown un link de tipo referencia?

      This is [an example][id] reference-style link.
    
      Then, anywhere in the document, you define your link label like this, on a line by itself:
    
    [id]: http://example.com/  "Optional Title Here"
  • ¿Cómo se pone una imagen?

      ![Screenshot of the toolbar](http://so.mrozekma.com/editor-bar-help-button.png)
    
  • ¿Cómo se anidan listas?

       To put other Markdown blocks in a list; just indent four spaces for each nesting level
        For example 
    
        1. Dog
            1. German Shepherd
            2. Belgian Shepherd
                1. Malinois
                2. Groenendael
                3. Tervuren
        2. Cat
            1. Siberian
            2. Siamese
    
  • ¿Cómo se inserta una línea horizontal?

    Preguntas de Repaso de GitBook

  • ¿Cómo se escribe en GitBook esta fórmula?

x=1+y1+2z2x=\frac{1+y}{1+2z^2}

  1. ¿Como se escribe un código JavaScript de manera que se muestre con syntax highlingting?
  2. ¿Como se escribe un bloque de cita blokquote?
  3. ¿Que pasos debo dar para insertar un vídeo de YouTube en mi libro GitBook?
  4. Escriba el código MD para producir una tabla como esta:
First Header Second Header
Content Cell Content Cell
Content Cell Content Cell
  1. ¿Donde puedo encontrar la URL del repositorio en GitBook del libro?
  2. Explique los pasos para publicar un libro GitBook en GitHub usando las gh-pages de GitHub manualmente
  3. ¿Que atributo debo de poner en book.json para alojar los Markdown del libro en un directorio distinto del raiz?
  4. Explique como instalar y usar Gitbook
  5. Como se despliega un libro en GitHub
  6. Como se despliega un libro en gitbook.com
  7. Como se despliega un libro en Heroku
  8. Como se despliega un libro en una máquina virtual de iaas.ull.es

    Preguntas de Repaso de JSON

  9. ¿Como se llama el método que permite obtener una representación como cadena de un objeto? ¿Que parámetros espera? ¿Como afectan dichos parámetros?

    Plataformas de Despliegue

Preguntas de SSH

  1. Explique como se generan las claves privada y pública
  2. Como se publica una clave?
  3. Indique como se puede configurar el cliente SSH para simplificar la conexión
  4. ¿Cómo puedo ejecutar un script en una máquina accesible via SSH?

    Preguntas de Repaso de Heroku

  5. Una vez instalado el Heroku cli nos debemos autenticar en heroku con el cliente. ¿Cual es el comando para autenticarnos?

  6. ¿Cual es el comando para crear nuestra aplicación en Heroku (suponemos que ya esta bajo el control de git? ¿Qué remoto tendremos definido después de crear nuestra aplicación en Heroku?

  7. ¿Cual es el comando para desplegar nuestra aplicación en Heroku?

  8. Si la versión que queremos publicar en heroku no está en la rama master sino que está en la rama tutu ¿Como debemos modificar el comando anterior?

  9. ¿Con que comando puedo abrir una ventana en el navegador que visite la aplicación desplegada? ¿Que formato tiene la URL para nuestra aplicación?

  10. ¿Con que comando puedo ver los logs de la aplicación desplegada?

  11. ¿Como se debe llamar el fichero en el que explicito que comando debe usarse para arrancar nuestra aplicación en Heroku?

  12. Heroku se percata que nuestra aplicación es una aplicación desarrollada con Node.js por la presencia de un cierto fichero. ¿De que fichero estamos hablando?

  13. ¿Cual es la mejor forma de ejecutar en local una aplicación express.js que va a ser desplegada en Heroku?

  14. Explique los pasos para desplegar una aplicación en Heroku
  15. Explique como resolver los problemas que pueden surgir cuando la aplicación desplegada en Heroku no funciona correctamente
  16. ¿Como consulto el token para hacer uso de la API de Heroku?
  17. ¿Cómo creo una app en Heroku usando la API de Heroku?
    • Véase
    • With a source tarball, which contains an app.json, call the https://api.heroku.com/app-setups endpoint to setup the app.json enabled application on Heroku. The request body must contain a source URL that points to the tarball of your application’s source code.
    • Let’s use cURL to call the app-setups endpoint:
      $ curl -n -X POST https://api.heroku.com/app-setups \
      -H "Content-Type:application/json" \
      -H "Accept:application/vnd.heroku+json; version=3" \
      -d '{"source_blob": { "url":"https://github.com/heroku/ruby-rails-sample/tarball/master/"} }'
      
  18. Explique los pasos para publicar un libro GitBook en Heroku

    Preguntas sobre iaas.ull.es

  19. ¿A que se refiere el término SAAS?

  20. ¿A que se refiere el término PAAS?
  21. ¿A que se refiere el término IAAS?
  22. Explique los pasos para desplegar una aplicación web en la máquina virtual de iaas.ull.es

    Buenas Prácticas

Preguntas de Programación Orientada a Objetos

  1. Escriba un código JavaScript que defina una clase Persona con atributos nombre y apellidos y que disponga de un método saluda.

  2. Escriba una clase Programador que hereda de Persona

  3. Escriba un código ECMA6 que defina una clase Persona con atributos nombre y apellidos y que disponga de un método saluda.

  4. Usando ECMA6 escriba una clase Programador que hereda de Persona

  5. Explique las diferencias en la salida entre este código

      function Person() {
        this.age = 0;

        function growUp() {
          this.age += 10;
        }
        growUp();
        console.log(this.age);
      }
      var p = new Person();

y este otro:

      function Person() {
        this.age = 0;

        var growUp = () => {
          this.age += 10;
        }
        growUp();
        console.log(this.age);
      }

      var p = new Person();

Justifique su respuesta.

  1. Explique que hacen los métodos bind, apply y call y cuales son sus similitudes y diferencias
  2. ¿Cual es el significado del primer argumento del método Object.cretate? ¿Y el segundo?
  3. Todo objeto JavaScript tiene una propiedad "prototype" ¿verdadero o falso?
  4. La propiedad prototype de una función es un objeto de tipo Function ¿verdadero o falso?
  5. El prototype de una función es un objeto de tipo Function ¿verdadero o falso?
  6. ¿Cual es el problema con este código? ¿Como se arregla el problema?
    Object.prototype.nonsense = "hi";
    for (var name in map)
    console.log(name);
    
  7. ¿Que significa que una propiedad es no-enumerable?
  8. ¿Como puedo crear un objeto que carezca de prototipo?

10 El argumento descriptor del método

Object.defineProperty(obj, prop, descriptor)

puede ser de uno de dos tipos: data descriptors o accessor descriptors.

  • Un data descriptor es una propiedad que tiene un value, que puede o no ser writable.
  • Un accessor descriptor es una propiedad que describe un par de funciones getter-setter.

Un descriptor puede ser de uno de estos tipos pero no puede ser ambos.

Explique cuales de estas propiedades pertenecen a que tipo, cual es su valor por defecto y que describen:

  1. configurable
  2. enumerable
  3. value
  4. writable
  5. get
  6. set

    Preguntas de Repaso de Code Smelling

  1. Defina el término code smelling

  2. ¿Que diferencia hay entre un code smell y un bug?

  3. Explique el code smell Duplicated Code

  4. Explique el Switch smell

    Preguntas de Strategy Pattern

  5. Describa que se entiende por Code Smell

  6. ¿En que consisten cada uno de estos smells?

    1. Duplicated code
    2. Contrived complexity
    3. Large class
    4. Feature envy
    5. Inappropriate intimacy
    6. Refused bequest (herencia negada)
    7. Lazy class / Freeloader
    8. Excessive use of literals
    9. Large Cyclomatic complexity
    10. Downcasting

      1. In a Java-like language, when learning about polymorphism you commonly see something like this

          class Base { ... }
        
          class Derived extends Base { ... }
        

        Is (Derived*)base_object; an upcast or downcast?

    11. Too many parameters
    12. Long method
    13. Excessively long identifiers
    14. Excessively short identifiers
    15. Excessive return of data
    16. Switch Smell
  7. Enuncie el OCP: Open/Closed Principle
  8. ¿Que se entiende por Design Pattern?
  9. Explique como se resuelve el Switch Smell usando el Strategy Pattern

    Preguntas de Repaso de ECMA6

  10. Observemos este ejemplo:

  class Contact {
     constructor(name, email, button) {
       this.name = name;
       this.email = email;

       button.onclick = function(event) {
         sendEmail(this.email);
       }
     }
   }
  1. ¿Cuanto vale this en la línea 6?

  2. ¿Como podemos reescribir este código en ECMA6 para que this refiera al objeto Contact?

  1. ¿Que se entiende por Hoisting en JS? ¿Que efectos indeseables conlleva? ¿Como se soluciona en ECMA6?

    Web

Preguntas de Repaso de jQuery

  1. jQuery uses CSS selectors to select elements? True or false?

  2. Which sign does jQuery use as a shortcut for jQuery?

  3. With jQuery, look at the following selector: $("div"). What does it select?

  4. The jQuery html() method works for both HTML and XML documents. True or false?

  5. What is the correct jQuery code to set the background color of all p elements to red?

  6. With jQuery, look at the following selector: $("div.intro"). What does it select?

  7. Which jQuery method is used to hide selected elements?

  8. Which jQuery method is used to set one or more style properties for selected elements?

  9. Which jQuery method is used to perform an asynchronous HTTP request?

  10. What is the correct jQuery code for making all div elements 100 pixels high?

  11. Which jQuery function is used to prevent code from running, before the document is finished loading?

  12. Which jQuery method should be used to deal with name conflicts?

  13. Which jQuery method is used to switch between adding/removing one or more classes (for CSS) from selected elements?

  14. Look at the following jQuery selector: $("div#intro .head"). What does it select?

  15. Is jQuery a W3C standard?

    Preguntas de Repaso de Underscore

  16. ¿Que argumentos espera el método template de Underscore? ¿Cual es la función de cada uno de ellos?

  17. ¿Que diferencia hay entre <% ... %>, <%= ... %> y <%- ... %>?

  1. El atributo templateSettings de Underscore puede ser usado para configurar los templates. Rellene las expresiones regulares que faltan para que se usen delimitadores con llaves como {{ ... }} para evaluar, {{= ... }} para interpolar y {{- ... }} para interpolar y escapar el HTML:
_.templateSettings = {
       interpolate: /____________________/gim,
       evaluate:    /____________________/gim
       escape:      /____________________/gim
}
  1. Queremos mostrar una lista de items en una tabla con dos columnas. En la primera columna va el número de orden y en la segunda el nombre del item. El template Underscore se carga desde el elemento #usageList del DOM y el resultado del template se vuelca en el elemento #target como sigue:
        var items = [ {name:"Alejandro"}, {name:"......."}, {name:"Zacarias"} ];
        var template = usageList.innerHTML;
        target.innerHTML = _.template(template,{items:items});

Complete el identificador del <script>, el identificador del <div> usado para la salida y la parte que falta entre las etiquetas <tbody>:

<script type="text/html" id='_________'>
    <table>
      <thead>
         <tr>
            <th> Id </th> <th>Name</th>
         </tr>
      </thead>
      <tbody>







    </tbody >
   </table>
</script>
<!-- Create your target -->
<div id="______"></div>

Preguntas de Repaso de localStorage

  1. ¿Que diferencias y que similitudes hay entre los cookies y localStorage?

  2. ¿Que diferencias hay entre localStorage y sessionStorage?

  3. ¿En que consiste las reglas de segregación conocidas como same origin policy? ¿Como se relacionan con localStorage?

  4. ¿Como guardo en localStorage el contenido de una variable chuchu? ¿Como leo el contenido almacenado en localStorage con clave chuchu?

  5. ¿Como borro una clave almacenada en localStorage?

    1. ¿Que es LocalStorage? ¿Que hace la siguiente línea?

        if (window.localStorage) localStorage.original  = temp;
      
    2. ¿Cuando se ejecutará esta callback? ¿Que hace?

            window.onload = function() {
              // If the browser supports localStorage and we have some stored data
              if (window.localStorage && localStorage.original) {
                document.getElementById("original").value = localStorage.original;
              }
            };

Preguntas de Repaso de EJS

  1. Véase Getting Started with EJS

  2. Mejore este template

<li>
    <a href='supplies/<%= supplies[i] %>'>
        <%= supplies[i] %>
    </a>
</li>

usando un helper proveído por EJS

% <li>
%    <%= link_to(supplies[i], 'supplies/'+supplies[i]) %>
% </li>

Preguntas de Repaso de Jade

  1. Véase http://jade-lang.com/demo/

  2. Traduzca a Jade el siguiente código HTML:

        <div id="content">
          <div class="block">
            <input id="bar" class="foo1 foo2"/>
          </div>
        </div>
  1. ¿Que hace el punto después de un elemento? como en:

    p.
      foo bar
      hello world
    
  2. Supongamos que el objeto interpolado es:

        {"name": "Hello <em>World</em>"}
¿Que diferencia hay entre estas dos interpolaciones?

1.  `li= name`

2.  `li!= name`
  1. ¿Que diferencia hay entre estas dos interpolaciones?

    1. li Say #{name}

    2. li Say !{name}

  2. Traduzca a Jade el siguiente fragmento HTML:

        <input type="text" placeholder="your name"/>

Preguntas de Repaso de SASS

  1. ¿Como se inicializa una constante en SASS?

  2. Reescriba este fragmento CSS en SASS:

        nav ul {
          margin: 0;
          padding: 0;
          list-style: none;
        }

        nav li {
          display: inline-block;
        }

        nav a {
          display: block;
          padding: 6px 12px;
          text-decoration: none;
        }

Preguntas de Repaso de HTML

  1. ¿Cual debe ser el valor del atributo rel para usar la imagen como favicon?

    <link rel="_____________" href="etsiiull.png" type="image/x-icon">
    

    Preguntas de Repaso de CSS

  2. ¿Que hacen las siguientes pseudo-clases estructurales CSS3?

    tr:nth-child(odd)    { background-color:#eee; }
    tr:nth-child(even)    { background-color:#00FF66; }
    
  3. ¿Que contiene el objeto window en un programa JavaScript que se ejecuta en un navegador?

  4. Enumere tres elementos HTML que sean de la categoría inline

  5. Enumere tres elementos HTML que sean de la categoría block

  6. ¿Cómo se hace para que elementos de la página web permanezcan ocultos para posteriormente mostrarlos? ¿Que hay que hacer en el HTML, en la hoja de estilo y en el JavaScript?

  7. Rellene los estilos para los elementos de las clases para que su visibilidad case con la que su nombre indica:

    .hidden      { display: ____; }
    .unhidden    { display: _____; }
    

    Preguntas de Repaso de Ajax

  1. What method of the req object returns a boolean value that is true if the request’s X-Requested-With header field is XMLHttpRequest, indicating the intent to retrieve data from the URL without having to do a full page refresh?.

    Fill the gap:

        app.get('/chuchu', function (req, res) {
          var isAjaxRequest = req.______________;
          ...
        }
  1. La siguiente vista incluye el código JavaScript de un request Ajax:
        <!doctype html>
        <html>
          <head>
            <title><%- title %></title>
          </head>
          <body>
            <h1><%- title  %></h1>
            <ul>
              <li><a href="http://jquery.com/" id="jq">jQuery</a>
              <li><a href="/chuchu">Visit chuchu!</a>
            </ul>
            <div class="result"></div>
            <script src="https://code.jquery.com/jquery-2.1.3.js"></script>
            <script>
              $( document ).ready(function() {
                  $( "#jq" ).click(function( event ) {
                      event.preventDefault();
                      $.get( "/chuchu", {nombres: ["juan", "pedro"]}, function( data ) {
                        $( ".result" ).html( data["answer"]);
                        console.log(data);
                      }, 'json');
                  });
              });
            </script>
          </body>
        </html>
Supongamos que el servidor express.js responde al request con:
        res.send('{"answer": "Server responds: hello world!"}')
1.  ¿Como podemos acceder en el servidor express.js al objeto
    `{nombres: ["juan", "pedro"]` enviado desde el cliente como
    segundo argumento de `$.get`?

2.  ¿Cuando se ejecuta la callback asociada con la llamada a
    `$.get`?

3.  ¿Que contendrá el parámetro `data` pasado a la callback?

4.  ¿Que hace el cuarto parámetro de `$.get`?
  1. En el código de la práctica de Ajax CSV cuando se hacía click en uno de los botones con los nombres de los ficheros de ejemplo se ejecutaba en el cliente la función dump:
        const dump = (fileName) => {
          $.get(fileName,function (data){
            $("#original").val(data);
          });
        };
¿En que ruta/middleware del servidor express son servidos estos
requests?. Explique el funcionamiento de este código.

Preguntas de Repaso de Cookies

  1. Defina y explique el concepto de Cookie
  2. Defina y explique el concepto de Cookie para la Gestión de una Sesión
  3. Defina y explique el concepto de Cookie para la Autenticación en un Website
  4. ¿Que es un secure cookie? (cookie seguro)
  5. ¿Como se llama el middleware express que me facilita el manejo de los cookies? ¿Cual es el código para poner en funcionamiento dicho middleware?
  6. Dentro de un middleware express ¿Cómo se llama el método del objeto res que me permite establecer un cookie? ¿Que argumentos recibe?
  7. ¿Que método del objeto request me permite ver los cookies establecidos?
  8. ¿Como borro un cookie en el servidor express?
  9. ¿Que es la Query String? Ponga un ejemplo de Query String
  10. If a form is embedded in an HTML page as follows:

    <form action="/hello" method="get">
    <input type="text" name="first" />
    <input type="text" name="second" />
    <input type="submit" />
    </form>
    

    and the user inserts the strings this is a field and was it clear already in the two text fields and presses the submit button, the handler of the route /hello (the route specified by the action attribute of the form element in the above example) will receive a query string. Write down the query string it receives

    Preguntas de REST y Servicios Web

  11. Defina que es un servicio web

  12. Explique que es REST

    Preguntas sobre la API de GitHub

  13. ¿En que URL funciona el servicio web de GitHub?

  14. Usando curl, muestre un ejemplo de petición GET al servicio de GitHub solicitando información sobre un cierto usuario. ¿Con que opción puedo ver los headers?
  15. Explique las diversas formas de autenticarse para usar el servicio de GitHub
  16. Explique que es octonode y ponga un ejemplo de uso

    Preguntas de HTTPS

  17. ¿Cuales son las dos funcionalidades principales proveídas por la capa SSL?

    • Verifying that you are talking directly to the server that you think you are talking to
    • Ensuring that only the server can read what you send it and only you can read what it sends back
  18. ¿Es posible que alguien intercepte un mensaje utilizando HTTPS?
    • The really, really clever part is that anyone can intercept every single one of the messages you exchange with a server, including the ones where you are agreeing on the key and encryption strategy to use, and still not be able to read any of the actual data you send.
  19. ¿Cuales son los tres objetivos de la fase de handshake entre un cliente y un servidor utilizando TLS?
    • To satisfy the client that it is talking to the right server (and optionally visa versa)
    • For the parties to have agreed on a cipher suite, which includes which encryption algorithm they will use to exchange data
    • For the parties to have agreed on any necessary keys for this algorithm
  20. ¿Como se llaman las tres fases en las que se puede descomponer la etapa de handshake?
    • Hello, Certificate Exchange and Key Exchange*
  21. Describa la primera fase del handshake
    • The handshake begins with the client sending a ClientHello message.
    • This contains all the information the server needs in order to connect to the client via SSL, including
      • the various cipher suites
      • and maximum SSL version that it supports.
    • The server responds with a ServerHello, which contains similar information required by the client, including
      • a decision based on the client’s preferences about which cipher suite and version of SSL will be used.
  22. Describa la segunda fase del handshake
    • Now that contact has been established, the server has to prove its identity to the client.
    • This is achieved using its SSL certificate, which is a very tiny bit like its passport.
    • An SSL certificate contains various pieces of data, including the
      • name of the owner,
      • the property (eg. domain) it is attached to,
      • the certificate’s public key,
      • the digital signature and
      • information about the certificate’s validity dates.
    • The client checks that it either
      • implicitly trusts the certificate,
      • or that it is verified and trusted by one of several Certificate Authorities (CAs) that it also implicitly trusts.
    • Note that the server is also allowed to require a certificate to prove the client’s identity, but this typically only happens in very sensitive applications.
  23. Describa la tercera fase del handshake
    • The encryption of the actual message data exchanged by the client and server will be done using a symmetric algorithm, the exact nature of which was already agreed during the Hello phase.
    • A symmetric algorithm uses a single key for both encryption and decryption, in contrast to asymmetric algorithms that require a public/private key pair.
    • Both parties need to agree on this single, symmetric key, a process that is accomplished securely using asymmetric encryption and the server’s public/private keys.
    • The client generates a random key to be used for the main, symmetric algorithm.
      • It encrypts it using an algorithm also agreed upon during the Hello phase, and the server’s public key (found on its SSL certificate).
      • It sends this encrypted key to the server, where it is decrypted using the server’s private key, and the interesting parts of the handshake are complete.
  24. ¿Que tipo de cifrado se utiliza una vez que a finalizado con éxito la fase de handshake?
    • The parties are sufficiently happy that they are talking to the right person, and have secretly agreed on a key to symmetrically encrypt the data that they are about to send each other.
  25. ¿Cuales son las dos razones por las que podríamos confiar en un certificado SSL?
    • There are 2 sensible reasons why you might trust a certificate:
      • If it’s on a list of certificates that you trust implicitly
      • If it’s able to prove that it is trusted by the controller of one of the certificates on the above list
  26. Describa como funciona una firma digital

    • As already noted, SSL certificates have an associated public/private key pair
      • The public key is distributed as part of the certificate, and the private key is kept incredibly safely guarded
      • This pair of asymmetric keys is used in the SSL handshake to exchange a further key for both parties to symmetrically encrypt and decrypt data
      • The client uses the server’s public key to encrypt the symmetric key and send it securely to the server, and the server uses its private key to decrypt it
        • digital signature
      • Anyone can encrypt using the public key, but only the server can decrypt using the private key
    • The opposite is true for a digital signature.

      • A certificate can be "signed" by another authority, whereby the authority effectively goes on record as saying

        "We have verified that the controller of this certificate also controls the property (domain) listed on the certificate".

      • In this case the authority uses their private key to (broadly speaking) encrypt the contents of the certificate, and this cipher text is attached to the certificate as its digital signature.
      • Anyone can decrypt this signature using the authority’s public key, and verify that it results in the expected decrypted value.
      • But only the authority can encrypt content using the private key, and so only the authority can actually create a valid signature in the first place.
    • So if a server comes along claiming to have a certificate for Microsoft.com that is signed by Symantec (or some other CA), your browser doesn’t have to take its word for it.
      • If it is legit, Symantec will have used their (ultra-secret) private key to generate the server’s SSL certificate’s digital signature, and so your browser use can use their (ultra-public) public key to check that this signature is valid.
      • Symantec will have taken steps to ensure the organisation they are signing for really does own Microsoft.com, and so given that your client trusts Symantec, it can be sure that it really is talking to Microsoft Inc. digital signature
  27. Pueden en un coffee shop conocer los contenidos de mi tráfico HTTPS desde mi portátil sobre su red?
    • Nope.
      • The magic of public-key cryptography means that an attacker can watch every single byte of data exchanged between your client and the server and still have no idea what you are saying to each other beyond roughly how much data you are exchanging.
      • However, your normal HTTP traffic is still very vulnerable on an insecure wi-fi network, and a flimsy website can fall victim to any number of workarounds that somehow trick you into sending HTTPS traffic either over plain HTTP or just to the wrong place completely.
      • For example, even if a login form submits a username/password combo over HTTPS, if the form itself is loaded insecurely over HTTP then an attacker could intercept the form’s HTML on its way to your machine and modify it to send the login details to their own endpoint.
  28. Puede mi empresa conocer los contenidos de mi tráfico HTTPS sobre la red cuando uso la máquina que me proveen?

    • If you are also using a machine controlled by your company, then yes.
      • Remember that at the root of every chain of trust lies an implicitly trusted CA, and that a list of these authorities is stored in your browser.
      • Your company could use their access to your machine to add their own self-signed certificate to this list of CAs.
      • They could then intercept all of your HTTPS requests, presenting certificates claiming to represent the appropriate website, signed by their fake-CA and therefore unquestioningly trusted by your browser.
      • Since you would be encrypting all of your HTTPS requests using their dodgy certificate’s public key, they could use the corresponding private key to decrypt and inspect (even modify) your request, and then send it onto it’s intended location.
      • They probably don’t. But they could.
    • Incidentally, this is also how you use a proxy to inspect and modify the otherwise inaccessible HTTPS requests made by an iPhone app.

      Preguntas de Passport

  29. ¿Que es OAuth?

    • OAuth provides a method for users to grant third-party limited access (in scope, duration, etc.) access to their resources without sharing their passwords
  30. ¿Quienes son los cuatro roles que aparecen en una autenticación con OAuth?
    1. resource owner: An entity capable of granting access to a protected resource. When the resource owner is a person, it is referred to as an end-user. (El usuario)
    2. resource server: The server hosting the protected resources, capable of accepting and responding to protected resource requests using access tokens. (El servidor de Pinterest)
    3. client: An application making protected resource requests on behalf of the resource owner and with its authorization (por ejemplo, un cliente de pinterest en el teléfono). The term " client" does not imply any particular implementation characteristics (e.g., whether the application executes on a server, a desktop, or other devices).
    4. authorization server: The server issuing access tokens to the client after successfully authenticating the resource owner and obtaining authorization (por ejemplo, Facebook, cuando nos autenticamos con Facebook)
  31. ¿Qué tres elementos de información suelen ser necesarios a la hora de registrar nuestra aplicación ante un proveedor de OAuth?
    • Before using OAuth with your application, you must register your application with the service.
    • This is done through a registration form in the developer or API portion of the service's website, where you will provide the following information (and probably details about your application):
      1. Application Name
      2. Application Website
      3. Redirect URI or Callback URL
  32. ¿Que se debe poner en Redirect URI or Callback URL cuando se está registrando nuestra aplicación?
    • The redirect URI is where the service will redirect the user after they authorize (or deny) your application, and therefore the part of your application that will handle authorization codes or access tokens.
  33. Una vez que registramos la aplicación, el servicio provee las credenciales del cliente. ¿En que consisten esas credenciales?
    • Once your application is registered, the service will issue client credentials in the form of a client identifier and a client secret.
    • The Client ID is a publicly exposed string that is used by the service API to identify the application, and is also used to build authorization URLs that are presented to users.
    • The Client Secret is used to authenticate the identity of the application to the service API when the application requests to access a user's account, and must be kept private between the application and the API.
  34. ¿Que es passport, que funcionalidades provee y como funciona?
    • Passport is authentication middleware for Node.js. Extremely flexible and modular, Passport can be unobtrusively dropped in to any Express-based web application. A comprehensive set of strategies support authentication using a username and password, Facebook, Twitter, and more.
  35. Rellene las partes que faltan:

    var passport = require('passport');
    var Strategy = require('_______________').Strategy;
    var github = require('octonode');
    ....
    var datos_config = JSON.parse(JSON.stringify(config));
    
    passport.use(new Strategy({
       clientID: datos_config.clientID,
       clientSecret: datos_config.clientSecret,
       callbackURL: callbackURL_
     },
     function(accessToken, refreshToken, profile, cb) {
    
         var token = datos_config.token;
         var client = github.client(_____);
    
         var ghorg = client.___('ULL-ESIT-SYTW-1617');
    
         ghorg.______(profile.username, (err,result) =>
         {
             if(err) console.log(err);
             console.log("Result:"+result);
             if(result == true)
               return cb(null, profile);
             else {
               return cb(null,null);
             }
         });
    }));
    
    • Respuesta:
    var passport = require('passport');
    var Strategy = require('passport-github').Strategy;
    var github = require('octonode');
    ....
    var datos_config = JSON.parse(JSON.stringify(config));
    
    passport.use(new Strategy({
       clientID: datos_config.clientID,
       clientSecret: datos_config.clientSecret,
       callbackURL: callbackURL_
     },
     function(accessToken, refreshToken, profile, cb) {
    
         var token = datos_config.token;
         var client = github.client(token);
    
         var ghorg = client.org('ULL-ESIT-SYTW-1617');
    
         ghorg.member(profile.username, (err,result) =>
         {
             if(err) console.log(err);
             console.log("Result:"+result);
             if(result == true)
               return cb(null, profile);
             else {
               return cb(null,null);
             }
         });
       // return cb(null, profile);
    }));
    

    Preguntas de Rutas en ExpressJS

  36. Escriba un servidor que sirva ficheros estáticos desde el directorio /public

  37. El servidor deberá responder a requests GET en las rutas /user/nombredeusuario (donde nombredeusuario varía) con una página que diga Hola nombredeusuario usando el método renderdel objeto response
    • La página se elaborara con una vista que debe estar en el directorio views/ usando el motor de vistas ejs
    • La página elaborada en la respuesta tendrá un tag img referenciando a una imagen que está en public/
  38. Escriba un middleware que intercepte en las rutas /user/nombredeusuario y que vuelque en la consola información sobre el request: (por ejemplo los atributos method, path, etc.)
  39. Explique como se puede aislar el código anterior en un fichero routes/user.js que sea cargado desde el programa principal
  40. Explique que hay que hacer para desplegar la aplicación en Heroku
  41. Explique que hay que hacer para desplegar la aplicación en la máquina virtual del iaas

    Pruebas

Preguntas de Repaso de Pruebas con Mocha, Chai y Should

  1. ¿Como creamos el directorio con el esqueleto inicial para las pruebas con mocha?
  2. En este ejemplo se usa Chai assert. Rellene lo que falta en estas pruebas del código del conversor de temperatura:
var assert = chai.______;

suite('temperature', function() {
    test('[1,{a: 2}] == [1,{a: 2}]', function() {
      assert._________([1, {a:2}], [1, {a:2}]);
    });
    test('5X = error', function() {
        original.value = "5X";
        calculate();
        assert._____(converted.innerHTML, /ERROR/);
    });
});
  1. Este es un fichero test/index.html apto para ejecutar las pruebas con Mocha y Chai en la práctica de la Temperatura en un navegador. Rellene las partes que faltan
    • Sugerencias: El id es el usado por mocha para producir su salida de las pruebas, es necesario cargar chai y mocha y establecer el estilo de pruebas (tdd, bdd, etc.) y por útlimo ejecutar mocha
[~/srcPLgrado/temperature(karma)]$ cat tests/index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Mocha</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="mocha.css" />
  </head>
  <body>
    <div id="_____"></div>   <!-- para la salida de las pruebas -->
    <input id="original" placeholder="32F" size="50">
    <span class="output" id="converted"></span>

    <script src="________"></script>
    <script src="________"></script>
    <script src="../temperature.js"></script>
    <script>mocha._____('___')</script>
    <script src="tests.js"></script>

    <script>
      mocha.___();
    </script>
  </body>
</html>
  1. Rellene las partes que faltan del fichero con las pruebas TDD en Mocha y Chai para la práctica de la temperatura:
        [~/srcPLgrado/temperature(karma)]$ cat tests/tests.js
        var assert = ____.assert;

        _____('temperature', function() {

            ____('32F = 0C', function() {
                original.value = "32F";
                calculate();
                assert._________(converted.innerHTML, "0.0 Celsius");
            });
        });
  1. ¿Como puedo ejecutar las pruebas escritas usando Mocha y Chai usando el comando npm test?. (no se asume el uso de Karma en esta pregunta) Explique como hacerlo.
  1. El siguiente ejemplo corresponde al ejemplo de pruebas que vimos para la renderización de una tabla correspondiente al capítulo The Secret Life Of Objects que usa mochay should. Rellena las partes que faltan:
________("drawTable", function() {
  __("must draw the checkerboard correctly", function() {
    /* There are 5 columns and 5 rows and a white space between columns*/
    drawTable(checkerboard()).should._____(/^(([# ]{2}(\s|$)){5}){5}$/);
  })
});

Preguntas de Repaso de Gulp

  1. Complete las partes que faltan del siguiente gulpfile.js en el que se lleva a cabo una tarea para la optimización (uglify/minify) de la aplicación de la práctica de la temperatura:
/tmp/pl-grado-temperature-converter(karma)]$ cat gulpfile.js
var gulp    = require('gulp'),
    gutil   = require('gulp-util'),
    uglify  = require('gulp-uglify'),
    concat  = require('gulp-concat');
var minifyHTML = require('gulp-minify-html');
var minifyCSS  = require('gulp-minify-css');

gulp.____('minify', function () {
  gulp.___('temperature.js')
  .____(uglify())
  .___(gulp.____('minified'));

  gulp.__('./index.html')
    .___(minifyHTML())
    .___(gulp.___('./minified/'))

  gulp.__('./*.css')
   .___(minifyCSS({keepBreaks:true}))
   .___(gulp.___('./minified/'))
        });
  • Explique los pasos para publicar un libro GitBook en GitHub usando gulp
  • Explique los pasos para actualizar automáticamente los HTML del libro GitBook en su máquina virtual del iaas usando gulp

    Preguntas de Repaso de Karma

  • Explique como funciona Karma

  • ¿Con que comando puedo crear el fichero de configuración de Karma?

  • ¿Que debemos poner en la entrada frameworks de karma para el ejemplo de la temperatura?

        frameworks: ['_____'],
    
  • La librería/plugin karma-mocha provee el adapter de Karma para Mocha. ¿Como le pasamos opciones para configurar Mocha desde Karma? Rellene las partes que faltan:

client: {
  args: ['--grep', 'pattern'], // solo pruebas que casan con pattern
  mocha: {
    __: '___'
  }
},
  1. Explique que debe ponerse (y que no) en la sección files del fichero de configuración de Karma ¿Donde son cargados dichos ficheros?:

        files: [ ... ],
    
  2. Los preprocesadores en Karma nos permiten procesar los ficheros en files antes de que sean cargados en el navegador.

          preprocessors = {
            '**/*.coffee': 'coffee',
            '**/*.html': 'html2js'
          };
¿Que hace el preprocesador `html2js`? ¿Que hace el preprocesador
`coffee`?
  1. Complete la función setup de las pruebas de la práctica de la temperatura con Mocha, Chai y Karma:
setup(function(){
  if (typeof ________ !== 'undefined') {
      document.body.innerHTML = ________['tests/test.html'];
      original = document.______________('original');
      converted = document.______________('converted');
  }
});

¿Como se llama la variable en la que se guardan los HTML de los ficheros cargados en los navegadores?

  1. ¿Que es PhantomJS? ¿Como funciona?

    Módulos

Preguntas de Repaso de npm

  1. ¿Con que comando creo el fichero package.json?

  2. Explique en consiste el versionado semántico/semantic versioning. ¿Cual es el nombre en inglés de los tres números de version? ¿Como cambian?

  3. ¿Que se guarda en el campo "dependencies": {} de package.json?

  4. ¿Que opción debo añadir al comando npm install para que la librería instalada se añada como dependencia en el fichero package.json?

  5. ¿Que se guarda en el campo "devDependencies": {} de package.json?

  6. ¿Que opción debo añadir al comando npm install para que la librería instalada se añada como "devDependencies" en el fichero package.json?

  7. Explique que significan en los objetos que describen las dependencias dentro package.json las siguientes notaciones:

    1. *

    2. latest

  8. ¿Cual es la salida? ¿Como actúa el operador ~?

    > var semver = require('semver')
    undefined
    > semver.toComparators('~1.2.3')
    [ [ '_______', '______' ] ]
    
  9. ¿Cual es la salida? ¿Como actúa el operador ^?

        > var semver = require('semver')
        undefined
        > semver.toComparators('^1.2.3')
        [ [ '_______', '______' ] ]

!INCLUDE "pubnpm.md"

Preguntas de Como crear y publicar un paquete npm

  1. ¿Cuales son los pasos para escribir y publicar un paquete npm?
  2. ¿Cómo instalo una versión anterior de un package npm?
    npm install <package>@<version>
    
  3. ¿Cómo encuentro la versión de un paquete NodeJs instalado?
  4. ¿Que se entiende por scope de un paquete npm?

    1. ¿Cual es la notación para referenciar un paquete somepackage que se aloja en el ámbito somescope?
    2. ¿Como se hace un requirede un paquete somepackage que se aloja en el ámbito somescope?
    3. Cualquier usario npm puede publicar sus módulos en cualquier ámbito: ¿Verdadero o falso?
    4. ¿Cómo puedes hacer para tener varios ámbitos npm?
    5. ¿Cual es el tipo de acceso por defecto de mi paquete con ámbito: público o privado?
    6. ¿Cómo indico a la hora de publicar mi paquete con ámbito que quiero que sea de acceso público?
    7. ¿Que hace este comando?

        npm login --registry=http://reg.example.com --scope=@myco
      
    8. ¿Que hace este comando?

        npm init --scope=username
      
    9. ¿Que hace este comando?

        npm config set scope username
      
  5. ¿Que hace este comando?

      npm version patch -m "Upgrade to %s for reasons"
    
    1. Cuando el comando anterior se ejecuta en un git repo, ¿Crea un commit? ¿Crea un tag?
    2. If preversion, version, or postversion are in the scripts property of the package.json, they will be executed as part of running npm version. Take the following example:

       "scripts": {
         "preversion": "npm test",
         "version": "npm run build && git add -A dist",
         "postversion": "git push && git push --tags && rm -rf build/temp"
       }
      

      Describe the set of actions that will happen when running npm version

JsDoc

  1. ¿Cual es la sintáxis de los comentarios de documentación en JSDoc? ¿Como empiezan?
  2. ¿Donde debo ubicar un comentario de documentación JSDoc para documentar un cierto código?
  3. Special JSDoc tags can be used to give more information. For example,

    1. If the function is a constructor for a class, you can indicate this by adding a __ tag (fill the gap)
    2. ¿Cómo se documenta un parámetro de una función?
    3. ¿Que hace esta documentación JSDoc?

       /**
        * See {@tutorial gettingstarted} 
        */
       function myFunction() {}
      
    4. ¿Que hace esta documentación JSDoc?

       /**
        * See {@link MyClass} and [MyClass's foo property]{@link MyClass#foo}.
        * Also, check out {@link http://www.google.com|Google} and
        * {@link https://github.com GitHub}.
        */
       function myFunction() {}
      

      Procesadores de Lenguajes

Preguntas de Repaso de Expresiones Regulares

  1. Escriba expresiones regulares que casen con las siguientes especificaciones:

    1. car and cat
    2. pop and prop
    3. ferret, ferry, and ferrari
    4. Any word ending in ious
    5. A whitespace character followed by a dot, comma, colon, or semicolon
    6. A word longer than six letters
    7. A word without the letter e
  2. Escriba una expresión regular que reconozca las cadenas de doble comillas. Debe permitir la presencia de comillas y caracteres escapados.
  3. Escriba una expresión regular que reconozca los números en punto flotante (por ejemplo -2.3e-1, -3e2, 23, 3.2). numbers = /^ ... $/, matching exacto
  4. Escriba una expresión regular que case con los números no primos expresados en unario. Pruebe con 1111, 111, 111111, 1111111, ...
  5. Escriba una expresión regular que case con los comentarios JavaScript.
  6. Escriba una expresión JavaScript que permita reemplazar todas las

  7. Rellene las partes que faltan:

> re = /d(b+)(d)/ig
/d(b+)(d)/gi
> z = "dBdxdbbdzdbd"
'dBdxdbbdzdbd'
> result = re.exec(z)
[ ______, _____, ______, index: __, input: 'dBdxdbbdzdbd' ]
> re.lastIndex
______
> result = re.exec(z)
[ ______, _____, ______, index: __, input: 'dBdxdbbdzdbd' ]
> re.lastIndex
______
> result = re.exec(z)
[ ______, _____, ______, index: __, input: 'dBdxdbbdzdbd' ]
> re.lastIndex
______
> result = re.exec(z)
_____
  1. Escriba la expresión regular r para que produzca el resultado final:
> x = "hello"
> r = /l(___)/
> z = r.exec(x)
[ 'l', index: 3, input: 'hello' ]
  1. Rellene el valor que falta:
> z = "dBdDBBD"
> re = /d(b+)(d)/ig
> re.lastIndex = ________
> result = re.exec(z)
[ 'DBBD',
  'BB',
  'D',
  index: 3,
  input: 'dBdDBBD' ]
  1. Conteste:

    1. Explique que hace el siguiente fragmento de código:

      > RegExp.prototype.bexec = function(str) {
      ...   var i = this.lastIndex;
      ...   var m = this.exec(str);
      ...   if (m && m.index == i) return m;
      ...   return null;
      ... }
      [Function]
      
    2. Rellene las salidas que faltan:

> re = /d(b+)(d)/ig
/d(b+)(d)/gi
> z = "dBdXXXXDBBD"
'dBdXXXXDBBD'
> re.lastIndex = 3
> re.bexec(z)
_____________________________________________________
> re.lastIndex = 7
> re.bexec(z)
_____________________________________________________
  1. Escriba una expresión JavaScript que permita reemplazar todas las apariciones de palabras consecutivas repetidas (como hello hello) por una sóla aparición de la misma

  2. ¿Cual es la salida?

    > "bb".match(/b|bb/)
    
    > "bb".match(/bb|b/)
    

    Justifique su respuesta.

  3. El siguiente fragmento de código tiene por objetivo escapar las entidades HTML para que no sean intérpretadas como código HTML. Rellene las partes que faltan.

var entityMap = {
    "&": "&___;",
    "<": "&__;",
    ">": "&__;",
    '"': '&quot;',
    "'": '&#39;',
    "/": '&#x2F;'
  };

function escapeHtml(string) {
  return String(string).replace(/_________/g, function (s) {
    return ____________;
  });
  1. Se quiere poner un espacio en blanco después de la aparición de cada coma:

    > x = "a,b,c,1,2,d, e,f"
    'a,b,c,1,2,d, e,f'
    > x.replace(/,/g,", ")
    'a, b, c, 1, 2, d,  e, f'
    

    Se pide que si hay ya un espacio después de la coma, no se duplique.

  2. Se pide una expresión regular que case con expresiones del tipo identifier = number y retorne con cada paréntesis el identificador y el número. Pruebe con h = 4, temp = 5.6, x23= -2.3e1 y z += 3

  3. Imagine you have written a story and used single quotation marks throughout to mark pieces of dialogue. Now you want to replace all the dialogue quotes with double quotes, while keeping the single quotes used in contractions like aren’t. Think of a pattern that distinguishes these two kinds of quote usage and craft a call to the replace method that does the proper replacement.

    var text = "'I'm the cook,' he said, 'it's my job.'";
    // Change this call.
    var result = text.replace(/.../g, '...');
    console.log(result);
    var expected = `"I'm the cook," he said, "it's my job."`;
    if (expected === result) console.log("OK")
    else console.log("ERROR!");
    

    Preguntas de Repaso de Análisis Léxico

  4. Escriba un método bexec para los objetos RegExpque funcione como exec pero sólo case en la posición lastIndex:

        RegExp.prototype.bexec = function(str) {
          __________________________
          __________________________
          __________________________
          __________________________
          __________________________
          __________________________
          __________________________
        };
  1. Basándose en el método bexec del ejercicio anterior escriba las partes que faltan del método tokens que implementa un analizador léxico para un lenguaje de tipo JavaScript en el que if y then son palabras reservadas:
  String.prototype.tokens = function() {
    var RESERVED_WORD, from, getTok, i, key, m, make, n, result, rw, tokens, value;
    from = 0;
    i = 0;
    n = 0;
    m = 0;
    result = [];
    tokens = {
      WHITES: ____________________________________________,
      ID: ____________________________________________,
      NUM: ____________________________________________,
      STRING: ____________________________________________,
      ONELINECOMMENT: ____________________________________________,
      MULTIPLELINECOMMENT: ____________________________________________,
      COMPARISONOPERATOR: ____________________________________________,
      ONECHAROPERATORS: /([=()&|;:,{}[\]])/g,
      ADDOP: /[+-]/g,
      MULTOP: /[*\/]/g
    };
    RESERVED_WORD = {
      "if": "IF",
      then: "THEN"
    };

Explique como se usa en el análisis el objeto RESERVED_WORD y para que sirve. Observe su uso en el bucle

    make = function(type, value) {
      return {
        type: type,
        value: value,
        from: from,
        to: i
      };
    };
    getTok = function() {
      var str;
      str = m[0];
      i += _____________________;
      return str;
    };
    if (!this) {
      return;
    }
    while (i < this.length) {
      for (key in tokens) {
        value = tokens[key];
        ________________________
      }
      from = __________;
      if (m = tokens.WHITES.bexec(this) || 
         (m = tokens.ONELINECOMMENT.bexec(this)) || 
         (m = tokens.MULTIPLELINECOMMENT.bexec(this))) {
        _________________________________;
      } else if (m = tokens.ID.bexec(this)) {
        rw = RESERVED_WORD[m[0]];
        if (rw) {
          result.push(make(rw, getTok()));
        } else {
          result.push(_____________________________________);
        }
      } else if (m = tokens.NUM.bexec(this)) {
        n = +getTok();
        if (isFinite(n)) {
          result.push(____________________________________);
        } else {
          make("NUM", m[0]).error("Bad number");
        }
      } else if (m = tokens.STRING.bexec(this)) {
        result.push(make("STRING", getTok().replace(_______________________/g, "")));
      } else if (m = tokens.COMPARISONOPERATOR.bexec(this)) {
        result.push(make("COMPARISON", getTok()));
      } else if (m = tokens.ADDOP.bexec(this)) {
        result.push(make("ADDOP", getTok()));
      } else if (m = tokens.MULTOP.bexec(this)) {
        result.push(make("MULTOP", getTok()));
      } else if (m = tokens.ONECHAROPERATORS.bexec(this)) {
        result.push(make(m[0], getTok()));
      } else {
        throw "Syntax error near '" + (this.substr(i)) + "'";
      }
    }
    return result;
  };

Bases de Datos

Preguntas de Repaso de Mongo y Mongoose

  1. ¿Que diferencia hay entre una tabla de una base de datos relacional y una collection de MongoDB?

  2. ¿Como se llama la primary key de un documento MongoDB?

  3. Escriba el código Mongoose para conectarse a la MongoDB database chuchu

  4. Escriba el código Mongoose para crear un esquema para modelar una colección de usuarios

  5. Escriba el código Mongoose para crear un modelo a partir del esquema anterior

  6. Escriba el código Mongoose para crear un documento usuario y guardarlo en la base de datos

  7. Escriba el código Mongoose para buscar por un documento usuario con nombre 'Pepe'