Taller javascript

(express, handlebars)

Edwin Andres Guerrero Castiblanco

Agosto 2020
Ing. Software

Fundación Escuela Tecnológica Jesús Oviedo Pérez.

Huila.
Electiva de Formacion Complementaria
1. Qué node JS:

Un nodo en el DOM es cualquier etiqueta del cuerpo, como un párrafo, el mismo body o incluso
las etiquetas de una lista. Con Javascript podemos modificar estas etiquetas con el uso de eventos.

Node (o más correctamente: Node.js) es un entorno que trabaja en tiempo de ejecución, de

código abierto, multi-plataforma, que permite a los desarrolladores crear toda clase de
herramientas de lado servidor y aplicaciones en JavaScript. La ejecución en tiempo real está
pensada para usarse fuera del contexto de un explorador web (es decir, ejecutarse directamente
en una computadora o sistema operativo de servidor). Como tal, el entorno omite las APIs de
JavaScript específicas del explorador web y añade soporte para APIs de sistema operativo más
tradicionales que incluyen HTTP y bibliotecas de sistemas de ficheros.

2. Qués es NPM:

De sus siglas NPM (Node Package Manager) es un gestor de paquetes desarrollado en su totalidad
bajo el lenguaje JavaScript por Isaac Schlueter, a través del cual podemos obtener cualquier
librería con tan solo una sencilla línea de código, lo cual nos permitirá agregar dependencias de
forma simple, distribuir paquetes y administrar eficazmente tanto los módulos como el proyecto a
desarrollar en general.

Así mismo, es de gran importancia mencionar que Node.JS desde su versión 0.6.3 se instala
automáticamente desde el entorno NPM, permitiendo a los desarrolladores instalar aplicaciones
Node que se encuentren en el repositorio. En este mismo orden de ideas, cabe destacar que al
instalar paquetes nuevos estos serán almacenados localmente en la carpeta que lleva por nombre
“node_modules” dentro de nuestro proyecto (esto se lleva a cabo por defecto) sin embargo el
desarrollador puede indicarle a NPM que instale dicho paquete de forma global, según lo
considere necesario.

3. Qué framework/librerías se conocen de javscript:

Las bibliotecas JavaScript más populares

Las bibliotecas JavaScript son instrucciones de código reutilizables por medio de las que se asignan
características y funciones (por ejemplo, para una página web). jQuery es la más conocida y esta
ofrece numerosas y valiosas funciones, aunque también hay otras que pueden ser de utilidad.

jQuery

jQuery es la más utilizada de todas las librerías JavaScript. Esto se debe, entre otras razones, a que
posibilita la escritura de código jQuery en cualquier tipo de navegador y que para ello existen
numerosos plugins. La librería de código abierto está incluida en numerosos sistemas de gestión
de contenidos como WordPress, Drupal o Joomla!. jQuery se utiliza sobre todo como una práctica
interfaz de DOM y ofrece numerosas funciones: los selectores de CSS3 permiten seleccionar y
manipular fácilmente los elementos de las páginas web, pero jQuery resulta especialmente
popular debido a la posibilidad de integrar las consultas realizadas con Ajax (solicitudes HTTP que
no requieren volver a cargar la página web).

jQuery UI

jQuery UI, cuya terminación UI hace referencia a las siglas en inglés para User Interface (interfaz
de usuario), es una extensión gratuita para jQuery que se emplea para diseñar y crear interfaces
de usuario, como por ejemplo de páginas o aplicaciones web. Lo esencial de esta biblioteca de
componentes es que con ella se pueden generar efectos e interacciones muy fácilmente. Entre las
funciones de jQuery UI se encuentra la creación de opciones para la interacción (drag and drop,
aumento y disminución de elementos web, etc.), de animaciones y efectos, así como de widgets
(como Autocomplete, Slider, Datepicker, etc.). Con el editor gráfico ThemeRoller se pueden crear
temas propios, aunque también se pueden utilizar y adaptar otros que ya estén disponibles.
También ofrece la posibilidad de implementar los componentes necesarios por medio del diseño
modular.

Dojo Toolkit

Dojo Toolkit está diseñado para realizar aplicaciones web y contenidos web dinámicos. Como una
de las bibliotecas de JavaScript más antiguas que todavía sigue teniendo relevancia en el
mercadoofrece gran cantidad de funciones adicionales. Sus componentes más importantes son
Dojo, el programa principal, y Dijit, un módulo para interfaces gráficas de usuario que permite
incorporar elementos en la página con ayuda de widgets predefinidos. Dojo puede utilizarse con el
DOM y con Ajax.

React

React fue utilizada por primera vez en 2011 en el newsfeed de Facebook. En 2013 se publicó como
una librería JavaScript de código abierto para crear interfaces de usuario. Lo característico de
React es que no solo se puede utilizar en clientes de páginas web, sino también en el servidor o
durante el desarrollo de aplicaciones. Esto se atribuye al uso de un DOM virtual, lo que también
facilita el análisis de aplicaciones web. Asimismo, esta biblioteca de JavaScript destaca también
por el one direction data flow (flujo de datos en una dirección): esta técnica proporciona un código
estable en el que los cambios en el código jerárquicamente inferior no pueden influir en el
superior. Así, los cambios solo pueden tener efecto en la dirección opuesta.

Zepto

Zepto es una librería JavaScript muy liviana: mientras que jQuery convence, sobre todo, por su
funcionalidad, esto mismo es lo que intimida a muchos desarrolladores, y es que dicha biblioteca
de JavaScript puede resultar muy compleja. La minimalista Zepto es mucho más ligera, por lo que
se carga más rápido y ocupa menos espacio, pudiendo integrarse así en aplicaciones móviles. Para
que el volumen de archivos sea mínimo, Zepto reduce, por ejemplo, la compatibilidad con los
navegadores más antiguos. Asimismo, para permitir el uso de Ajax y de animaciones, se debe
recurrir a módulos adicionales.

CreateJS
No una única biblioteca, sino varias: CreateJS es una suite compuesta por cuatro bibliotecas
diferentes: EaselJS (gráficos e interactividad), TweenJS (animaciones), SoundJS (audio) y PreloadJS
(preloading). No existe dependencia entre ellas, lo que significa que no es necesario implementar
las cuatro en un mismo proyecto cuando solo se necesita una. Además, se ofrecen algunas
herramientas para simplificar el trabajo con las librerías de JavaScript. El foco de atención es el
desarrollo de aplicaciones HTML5 y Flash. En general, el equipo de CreateJS trabaja estrechamente
con Adobe, por lo que también hay herramientas que garantizan la colaboración fluida de la suite
con los productos de Adobe.

Frameworks JS más utilizados

El número de librerías JavaScript es notablemente mayor que el de frameworks. Estos últimos

sirven, sobre todo, para aplicaciones web complejas y son muy efectivos en caso de que los
desarrolladores intervengan en la conceptualización y especificación del framework
correspondiente.

AngularJS

El framework creado por Google tiene, con diferencia, la mayor comunidad entre los frameworks
JavaScript. AngularJS se utiliza para crear aplicaciones web de una sola página (aplicaciones web
que constan de un solo documento HTML), al igual hace su principal competidor, este es, la
biblioteca de Facebook React. A causa del patrónMVVM (Model-View-ViewModel), se pueden
desarrollar aplicaciones web especializadas en la interacción con los usuarios. Los proveedores de
este framework JS, no obstante, definen a AngularJS más bien, en parte en broma, como un
modelo MVW o Model-View-Whatever, es decir, modelo-vista-lo que sea. La renderización de la
aplicación se lleva a cabo, en este caso, del lado del cliente. El framework está basado en jQuery
Lite, una versión reducida de jQuery.

Angular

Angular, a menudo también llamado Angular 2, es el sucesor de AngularJS. Este framework de

JavaScript está orientado principalmente al desarrollo de aplicaciones web de una sola página,
aunque Google ha realizado cambios muy importantes en la segunda versión. La mayor diferencia
es, en este sentido, que ya no se utiliza JavaScript para programar, sino TypeScript. Dado que el
lenguaje de scripts de Microsoft se basa en JavaScript y es compatible con él, no se dan
restricciones directas en el desarrollo de JS. Asimismo, Angular se adapta de tal manera que el
desarrollo de aplicaciones en diversas plataformas (escritorio, móvil, tablet) no supone ningún
problema.

Ember.js

Ember.js también es un framework del lado del cliente con el que se pueden crear aplicaciones
web de una sola página y aplicaciones de escritorio. Uno de sus rasgos distintivos con respecto a
AngularJS es que los creadores de Ember.js han incluido a la comunidad de una manera más
intensiva en el proceso de desarrollo del framework y que los cambios importantes realizados en
el framework se discuten en dicha comunidad antes de ser ejecutados. Ember.js se comercializa
como un framework con el que se pueden desarrollar aplicaciones web ambiciosas, por lo que está
orientado, en primer lugar, a desarrolladores que ya tienen cierta experiencia en la creación de
aplicaciones web.

Vue.js

Vue.js es, asimismo, un framework de JavaScript para el desarrollo de aplicaciones web de una
sola página que recuerda a Angular y React. Los desarrolladores de este proyecto relativamente
reciente han diseñado Vue.js de tal manera que iniciarse con él sea relativamente sencillo. Así es
posible, por ejemplo, integrar plantillas en HTML. Asimismo, Vue.js es mucho más flexible que
otros frameworks que normalmente prescriben de una forma un tanto rígida cómo utilizar el
framework.

Meteor

Meteor, también conocido como MeteorRJ, es un framework JS especialmente apto para el

desarrollo cross-platform que permite a los desarrolladores crear aplicaciones web y móviles con
el mismo código. Otra ventaja es que los cambios en el código pueden enviarse directamente a los
clientes gracias a un Distributed Data Protocol (DDP) propio. Para este framework gratuito, los
proveedores de Meteor también ofrecen Galaxy, una plataforma de pago. Los desarrolladores
pueden utilizar el servicio en la nube para publicar y alojar sus proyectos. El framework de
JavaScript funciona con Node.js, por lo que para el desarrollo con Meteor resulta aconsejable
tener conocimientos sobre el entorno de desarrollo. Con Meteor se pueden crear tanto backend
como frontend de una pieza sin modificar el lenguaje, un concepto revolucionario que todavía no
se ha impuesto.

4. Cuales plataformas en el mercado que lo utilizan (Facebook…)

5. Cómo se conecta a la base de datos MySql:

JavaScript no puede conectarse directamente a la base de datos para obtener los datos
necesarios, pero puede usar AJAX. Para facilitar AJAX solicitud al servidor, puede usar jQuery JS
framework http://jquery.com . Aquí hay un pequeño ejemplo.

JS:

jQuery.ajax({

type: "GET",
dataType: "json",
url: '/ajax/usergroups/filters.php',
data: "controller=" + controller + "&view=" + view,
success: function(json)
{
alert(json.first);
alert(json.second);
});

PHP:

$out = array();
$out['first'] = 'first value';
$out['second'] = 'second value';
echo json_encode($out);

Puede conectarse a MySQL desde Javascript a través de un applet de Java. El applet de Java
incrustaría el controlador JDBC para MySQL que le permitirá conectarse a MySQL.

Debe escribir un contenedor en PHP y luego exportar los datos devueltos (probablemente como
Json). NUNCA, obtenga de su "_GET" el código SQL, ya que esto se llama una inyección SQL (las
personas que aprendan esto tendrán el control total sobre su base de datos).

Este es un ejemplo que escribí:

function getJsonData()
{
global $db;
if (!$db->isConnected()) {
return "Not connected";
}
$db->query("SELECT * FROM entries");
$values = array();
while( $v = $db->fetchAssoc()){
$values[] = $v;
}
return json_encode($values);
}

switch (@$_GET["cmd"]){
case 'data':
print getJsonData();
exit;

default:
print getMainScreen();
exit;
}
6. Cuál es la estructura de las carpetas para utilizar el framework express:

Express es el framework web más popular de Node, y es la librería subyacente para un gran
número de otros frameworks web de Node populares. Proporciona mecanismos para:
Escritura de manejadores de peticiones con diferentes verbos HTTP en diferentes caminos URL
(rutas).

Integración con motores de renderización de "vistas" para generar respuestas mediante la

introducción de datos en plantillas.
Establecer ajustes de aplicaciones web como qué puerto usar para conectar, y la localización de las
plantillas que se utilizan para renderizar la respuesta.
Añadir procesamiento de peticiones "middleware" adicional en cualquier punto dentro de la
tubería de manejo de la petición.

Instalación:
Comenzaremos por el propio NodeJS
sudo apt-get install nodejs –y
Ahora instalamos el gestor de paquetes NPM (Node Package Manager), que nos permitirá instalar
aplicaciones basadas en NodeJS
sudo apt-get install npm
Creamos un directorio par albergar nuestra aplicación
mkdir expressAdictos
Lo mejor para comenzar a utilizar Express ya mismo es que empleemos un generador que nos va a
crear toda la estructura de directorios básica, con ficheros de demostración. Así, además
podremos ver la estructura básica de una aplicación Express y nos ahorraremos un buen trabajo.
Ejecutamos en un terminal para instalar el generador de la versión 4.X:
npm install -g express-generator@4
Ahora vamos a decirle al generador que genere la estructura en el directorio expressAdictos que
hemos creado.
express expressAdictos/

Así creará una serie de directorios y ficheros básicos para comenzar a trabajar con Express:
7. Cómo se implementa MVC en express:

El Modelo-Vista-Controlador

Como la mayoría de frameworks para el mundo web, Express permite desarrollar entre otros casos
el patrón Modelo-Vista-Controlador (MVC). Esto nos facilita mucho las cosas si estamos
acostumbrados a este patrón: Spring MVC, Struts, AngularJS…:

Modelo: las clases de datos que se manejan en la aplicación.

Vista: la representación para el usuario. Por ejemplo páginas Web (HTML) o JSON en REST.

Controlador: donde se realiza el procesamiento del modelo para dárselo «masticado» a la vista.
Contiene la lógica de negocio.

Vamos a ver parte por parte dónde se ubican, aunque mejor en el orden natural de una petición:
controlador, modelo y vista.

Implementacion del MVC:

Primero vamos a instalar Express de la siguiente manera

npm install express –save

Luego creamos nuestro archivo app.js que es el que despliega la aplicación:

'use strict';
 
const path = require('path');
 
//Inicializo el servidor express
const express = require('express');
const app = express();
 
//Configuración de la aplicación express
require('./app/config/set-config-express')(app);
 
//Exporto mi instancia de app para utilizarlo en otros archivos
module.exports = app;
 
//Rutas de mi aplicación
require(path.join(process.cwd(), 'app', 'routes'))();
 
//Ejecuto el servidor
app.listen(app.get('settings').port, function() {
  console.log('Listening port: ' + app.get('settings').port)
});
Ahora creamos una carpeta app y otra public. Dentro de app creamos las siguientes carpetas:

– config (Carpeta con los archivos de configuración).

– controllers (Carpeta con los controladores de la aplicación).
– models (Carpeta con los modelos de la aplicación).
– routes (Carpeta con las rutas de la aplicación).
– views (Carpeta con las vistas de la aplicación).

En public podrían ir las carpetas:

– css (Carpeta con los estilos de la aplicación)

– js (Carpeta con los scripts de la aplicación)
– upload (Archivos que se suben desde la aplicación).
– Otras carpetas que ustedes quieran, mientras que sean públicas.

Ahora seguimos con la segunda parte de la aplicación, la configuración del servidor express. Pero
antes primero creamos en el config el archivo config.js con el siguiente contenido:

module.exports = {

  name: 'Site',

  description: 'Alguna descripción',

  domain: 'localhost',

  url: 'http://localhost',

  env: 'development',

  port: 3000,

  database: {

    domain: 'localhost',

    name: 'nameDb'

  }

Simplemente es un archivo de configuración que que le indicamos algunos datos, como la base de
datos, el puerto, etc. Esto es necesario para luego poder configurar nuestro server express. Dentro
de la misma carpeta creamos el archivo set-config-express.js:
'use strict';
const path = require('path');
 
const bodyParser = require('body-parser');
const cookieParser = require('cookie-parser');
const express = require('express');
const exphbs = require('express-handlebars');
const methodOverride = require('method-override');
const session = require('express-session');
const mongoose = require('mongoose');
const MongoStore = require('connect-mongo')(session);
 
var expressConfig = function(app){
  //Carga la configuración desde el archivo config.js
  app.set('settings', require('./config'));
  //Exporto la configuración para poder usarla en otras partes
  app.locals.settings = app.get('settings');
 
  // Configuro handlebars para los templates
  app.engine('.hbs', exphbs({ layoutsDir: "app/views/layouts",
defaultLayout: 'main', extname: '.hbs' }));
  // Seteo donde están las vistas
  app.set('views', path.join(process.cwd(), 'app', 'views'));
  app.set('view engine', '.hbs');
 
  //Override with the X-HTTP-Method-Override header in the request
  app.use(methodOverride('X-HTTP-Method-Override'));
 
  //Cookies
  app.use(cookieParser());
 
  //Para menejar sessiones
  app.use(session({
      secret: 'supernova',
      store: new MongoStore({ url: 'mongodb://' +
app.get('settings').database.domain + '/sessions', autoRemove:
'disabled'}),
      resave: false,
      saveUninitialized: false,
      cookie: { maxAge: (24*3600*1000*30), expires: false}, // 30 Days in
ms
  }));
 
  //Indico donde estarán los archivos estáticos, en este caso public,
para que express puede acceder
  app.use('/public', express.static(process.cwd() + '/public'));
  //Indico donde están los paquetes de node_modules para que express
puede acceder
  app.use('/node_modules', express.static(path.join(process.cwd() +
'/node_modules')));
  //Indico donde están los paquetes de bower_components para que express
puede acceder
  app.use('/bower_components', express.static(path.join(process.cwd(),
'/bower_components')));
 
  //For the verbs HTTP get params
  app.use(bodyParser.json());       // to support JSON-encoded bodies
  app.use(bodyParser.urlencoded({     // to support URL-encoded bodies
    extended: true
  }));
 
  //Me conecto a la base de datos
  mongoose.connect('mongodb://' + app.get('settings').database.domain +
'/' + app.get('settings').database.name);
}
 
module.exports = expressConfig;

Vamos a seguir con el archivo routes.js y su contenido.

'use strict'
 
const path = require('path');
const glob = require('glob');
 
//Mi instancia app del servidor
const app = require(path.join(process.cwd(), 'app'));
 
//Cargo en un array todos los controlador y hago require
let controllers = {};
let files = glob.sync(path.join(process.cwd(), 'app', 'controllers',
'**', '*.js'));
files.forEach(function(file) {
  let temp = controllers;
  let parts = path.relative(path.join(process.cwd(), 'app',
'controllers'), file).slice(0, -3).split(path.sep);
 
  while (parts.length) {
    if (parts.length === 1) {
      temp[parts[0]] = require(file);
    } else {
      temp[parts[0]] = temp[parts[0]] || {};
    }
    temp = temp[parts.shift()];
  }
});
 
// Rutas de la aplicación
module.exports = function(){
  //Rutas index
  require('./routes/index')(app, controllers);
}

8. Qué es una variable, cómo se maneja, y cómo se utiliza la variable:

Una variable es un elemento que se emplea para almacenar y hacer referencia a otro valor.
Gracias a las variables es posible crear "programas genéricos", es decir, programas que funcionan
siempre igual independientemente de los valores concretos utilizados.

Si no existieran variables, un programa que suma dos números podría escribirse como:
resultado = 3 + 1

El programa anterior es tan poco útil que sólo sirve para el caso en el que el primer número de la
suma sea el 3 y el segundo número sea el 1. En cualquier otro caso, el programa obtiene un
resultado incorrecto.

Sin embargo, el programa se puede rehacer de la siguiente manera utilizando variables para
almacenar y referirse a cada número:

numero_1 = 3
numero_2 = 1
resultado = numero_1 + numero_2

Los elementos numero_1 y numero_2 son variables que almacenan los valores que utiliza el
programa. El resultado se calcula siempre en función del valor almacenado por las variables, por lo
que este programa funciona correctamente para cualquier par de números indicado. Si se modifica
el valor de las variables numero_1 y numero_2, el programa sigue funcionando correctamente.

Las variables en JavaScript se crean mediante la palabra reservada var. De esta forma, el ejemplo
anterior se puede realizar en JavaScript de la siguiente manera:

var numero_1 = 3;
var numero_2 = 1;
var resultado = numero_1 + numero_2;

La palabra reservada var solamente se debe indicar al definir por primera vez la variable, lo que se
denomina declarar una variable. Cuando se utilizan las variables en el resto de instrucciones del
script, solamente es necesario indicar su nombre. En otras palabras, en el ejemplo anterior sería
un error indicar lo siguiente:

var numero_1 = 3;
var numero_2 = 1;
var resultado = var numero_1 + var numero_2;

Si cuando se declara una variable se le asigna también un valor, se dice que la variable ha sido
inicializada. En JavaScript no es obligatorio inicializar las variables, ya que se pueden declarar por
una parte y asignarles un valor posteriormente. Por tanto, el ejemplo anterior se puede rehacer de
la siguiente manera:

var numero_1;
var numero_2;

numero_1 = 3;
numero_2 = 1;

var resultado = numero_1 + numero_2;

Una de las características más sorprendentes de JavaSript para los programadores habituados a
otros lenguajes de programación es que tampoco es necesario declarar las variables. En otras
palabras, se pueden utilizar variables que no se han definido anteriormente mediante la palabra
reservada var. El ejemplo anterior también es correcto en JavaScript de la siguiente forma:

var numero_1 = 3;
var numero_2 = 1;
resultado = numero_1 + numero_2;

La variable resultado no está declarada, por lo que JavaScript crea una variable global (más
adelante se verán las diferencias entre variables locales y globales) y le asigna el valor
correspondiente. De la misma forma, también sería correcto el siguiente código:

numero_1 = 3;
numero_2 = 1;
resultado = numero_1 + numero_2;

En cualquier caso, se recomienda declarar todas las variables que se vayan a utilizar.
El nombre de una variable también se conoce como identificador y debe cumplir las siguientes
normas:

Sólo puede estar formado por letras, números y los símbolos $ (dólar) y _ (guión bajo).
El primer carácter no puede ser un número.
Por tanto, las siguientes variables tienen nombres correctos:

var $numero1;
var _$letra;
var $$$otroNumero;
var $_a__$4;

Sin embargo, las siguientes variables tienen identificadores incorrectos:

var 1numero; // Empieza por un número

var numero;1_123; // Contiene un carácter ";"

9. Tipos de variables:
 Numéricas
Se utilizan para almacenar valores numéricos enteros (llamados integer en inglés) o decimales
(llamados float en inglés). En este caso, el valor se asigna indicando directamente el número
entero o decimal. Los números decimales utilizan el carácter . (punto) en vez de , (coma) para
separar la parte entera y la parte decimal:

var iva = 16; // variable tipo entero

var total = 234.65; // variable tipo decimal

Cadenas de texto
Se utilizan para almacenar caracteres, palabras y/o frases de texto. Para asignar el valor a la
variable, se encierra el valor entre comillas dobles o simples, para delimitar su comienzo y su final:

var mensaje = "Bienvenido a nuestro sitio web";

var nombreProducto = 'Producto ABC';
var letraSeleccionada = 'c';

En ocasiones, el texto que se almacena en las variables no es tan sencillo. Si por ejemplo el propio
texto contiene comillas simples o dobles, la estrategia que se sigue es la de encerrar el texto con
las comillas (simples o dobles) que no utilice el texto:

/* El contenido de texto1 tiene comillas simples, por lo que

se encierra con comillas dobles */
var texto1 = "Una frase con 'comillas simples' dentro";

/* El contenido de texto2 tiene comillas dobles, por lo que

se encierra con comillas simples */
var texto2 = 'Una frase con "comillas dobles" dentro';

No obstante, a veces las cadenas de texto contienen tanto comillas simples como dobles. Además,
existen otros caracteres que son difíciles de incluir en una variable de texto (tabulador, ENTER,
etc.) Para resolver estos problemas, JavaScript define un mecanismo para incluir de forma sencilla
caracteres especiales y problemáticos dentro de una cadena de texto.

El mecanismo consiste en sustituir el carácter problemático por una combinación simple de

caracteres. A continuación se muestra la tabla de conversión que se debe utilizar:
Si se quiere incluir... Se debe incluir...
Una nueva línea \n
Un tabulador \t
Una comilla simple \'
Una comilla doble \"
 Si se quiere incluir... Se debe incluir...
Una barra inclinada \\

De esta forma, el ejemplo anterior que contenía comillas simples y dobles dentro del texto se
puede rehacer de la siguiente forma:

var texto1 = 'Una frase con \'comillas simples\' dentro';

var texto2 = "Una frase con \"comillas dobles\" dentro";

Este mecanismo de JavaScript se denomina "mecanismo de escape" de los caracteres

problemáticos, y es habitual referirse a que los caracteres han sido "escapados".

Arrays
En ocasiones, a los arrays se les llama vectores, matrices e incluso arreglos. No obstante, el
término array es el más utilizado y es una palabra comúnmente aceptada en el entorno de la
programación.

Un array es una colección de variables, que pueden ser todas del mismo tipo o cada una de un tipo
diferente. Su utilidad se comprende mejor con un ejemplo sencillo: si una aplicación necesita
manejar los días de la semana, se podrían crear siete variables de tipo texto:

var dia1 = "Lunes";

var dia2 = "Martes";
...
var dia7 = "Domingo";
Aunque el código anterior no es incorrecto, sí que es poco eficiente y complica en exceso la
programación. Si en vez de los días de la semana se tuviera que guardar el nombre de los meses
del año, el nombre de todos los países del mundo o las mediciones diarias de temperatura de los
últimos 100 años, se tendrían que crear decenas o cientos de variables.

En este tipo de casos, se pueden agrupar todas las variables relacionadas en una colección de
variables o array. El ejemplo anterior se puede rehacer de la siguiente forma:

var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];

Ahora, una única variable llamada dias almacena todos los valores relacionados entre sí, en este
caso los días de la semana. Para definir un array, se utilizan los caracteres [ y ] para delimitar su
comienzo y su final y se utiliza el carácter , (coma) para separar sus elementos:

var nombre_array = [valor1, valor2, ..., valorN];

Una vez definido un array, es muy sencillo acceder a cada uno de sus elementos. Cada elemento se
accede indicando su posición dentro del array. La única complicación, que es responsable de
muchos errores cuando se empieza a programar, es que las posiciones de los elementos empiezan
a contarse en el 0 y no en el 1:
var diaSeleccionado = dias[0]; // diaSeleccionado = "Lunes"
var otroDia = dias[5]; // otroDia = "Sábado"

En el ejemplo anterior, la primera instrucción quiere obtener el primer elemento del array. Para
ello, se indica el nombre del array y entre corchetes la posición del elemento dentro del array.
Como se ha comentado, las posiciones se empiezan a contar en el 0, por lo que el primer elemento
ocupa la posición 0 y se accede a el mediante dias[0].

El valor dias[5] hace referencia al elemento que ocupa la sexta posición dentro del array dias.
Como las posiciones empiezan a contarse en 0, la posición 5 hace referencia al sexto elemento, en
este caso, el valor Sábado.

Booleanos
Las variables de tipo boolean o booleano también se conocen con el nombre de variables de tipo
lógico. Aunque para entender realmente su utilidad se debe estudiar la programación avanzada
con JavaScript del siguiente capítulo, su funcionamiento básico es muy sencillo.

Una variable de tipo boolean almacena un tipo especial de valor que solamente puede tomar dos
valores: true (verdadero) o false (falso). No se puede utilizar para almacenar números y tampoco
permite guardar cadenas de texto.

Los únicos valores que pueden almacenar estas variables son true y false, por lo que no pueden
utilizarse los valores verdadero y falso. A continuación se muestra un par de variables de tipo
booleano:

var clienteRegistrado = false;

var ivaIncluido = true;

10. Tipos de datos que se manejan en javascript:

Tipos dinámicos

JavaScript es un lenguaje de tipado débil o dinámico. Esto significa que no es necesario declarar el
tipo de variable antes de usarla. El tipo será determinado automáticamente cuando el programa
comience a ser procesado. Esto también significa que puedes tener la misma variable con
diferentes tipos:

var foo = 42; // foo es ahora un Number

var foo = "bar"; // foo es ahora un String

var foo = true; // foo es ahora un Boolean

Tipos de datos

La última definición del estándar ECMAScript define siete tipos de datos:

Tipo Boolean
Boolean representa una entidad lógica y puede tener dos valores: true, y false.

Tipo Null
El tipo Null tiene exactamente un valor: null. Consultar null y Null para más detalles.

Tipo Undefined
Una variable a la cual no se le haya asignado valor tiene entonces el valor undefined. Consultar
undefined y Undefined para más detalles.

Tipo Number
De acuerdo al standard ECMAScript, sólo existe un tipo numérico: el valor de doble precisión de
64-bits IEEE 754 (un número entre -(253 -1) y 253 -1). No existe un tipo específico para los
números enteros. Adicionalmente a ser capaz de representar números de coma flotante, el tipo
número tiene tres valores simbólicos: +Infinity, -Infinity, and NaN (Not A Number o No Es Un
Número).

Para chequear valores mayores o menores que +/-Infinity, puedes usar las constantes
Number.MAX_VALUE o Number.MIN_VALUE y comenzando con ECMAScript 6 también es posible
chequear si un número está en el rango de coma flotante de doble precisión usando
Number.isSafeInteger() así como Number.MAX_SAFE_INTEGER y Number.MIN_SAFE_INTEGER.
Fuera de este rango los números en javascript ya no son seguros de manipular.

El tipo número sólo tiene un valor entero que cuenta con dos representaciones: 0 es representado
como -0 y +0. ("0" es un alias +0). Esto casi no tiene ningún impacto. Por ejemplo +0 === -0 es true.
Sin embargo, es posible notar esto cuando se divide por cero:

> 42 / +0
Infinity
> 42 / -0
-Infinity

Tipo String
El tipo String de Javascript es usado para representar datos textuales o cadenas de caracteres. Es
un conjunto de "elementos", de valores enteros sin signo de 16 bits. Cada elemento ocupa una
posición en el String. El primer elemento está en el índice 0, el próximo está en el índice 1, y así
sucesivamente. La longitud de un String es el número de elementos en ella.

A diferencia de lenguajes como C, los strings en JavaScript son immutables. Esto significa que una
vez que una cadena de caracteres es creada no es posible modificarla. Sin embargo es posible
crear otra basandose en una operación de la cadena original. Por ejemplo:

Un fragmento de la cadena original seleccionando letras individuales u usando String.substr().

Una concatenación de dos cadenas usando el operador de concatenacion (+) o String.concat().

Tipo Symbol
El Symbol es un nuevo tipo en JavaScript introducido en la versión ECMAScript Edition 6. Un
Symbol es un valor primitivo único e inmutable y puede ser usado como la clave de una propiedad
de un Object (ver debajo). En algunos lenguajes de programación, los Symbols son llamados
átomos. Se pueden comparar con enumeraciones de nombres (enum) en C. Para más detalles
consultar Symbol y el objeto envoltura Symbol en JavaScript.

Objetos
En la ciencia de la computación un objeto es un valor en memoria al cual es posible referirse
mediante un identificador.

Propiedades
En JavaScript los objetos pueden ser vistos como una colección de propiedades. Con la sintáxis
literal de objetos, un limitado grupo de propiedades son inicializadas; luego pueden ser agregadas
o eliminadas otras propiedades. Los valores de las propiedades pueden ser de cualquier tipo,
incluyendo otros objetos lo cual permite construir estructuras de datos complejas. Las
propiedades se identifican usando claves. Una clave es un valor String o Symbol.

11. Cómo realizar operaciones matemáticas en javascript (suma, resta, x, / )

Los operadores Aritméticos toman valores numéricos (ya sean literales o variables) como sus
operandos y retornan un valor numérico único. Los operadores aritméticos estándar son adición o
suma (+), sustracción o resta (-), multiplicación (*), y división (/).

Estos operadores trabajan al igual que en la mayoría de otros lenguajes de programacion, excepto
el operador /, que retorna una división de punto flotante en JavaScript, no una división truncada
como en lenguajes tales como C o Java.

Suma o adición (+)

La operación suma se produce mediante la suma de número o strings concatenados.

Sintaxis
Operador: x + y
Ejemplos:
// Número + Número = Adición

1 + 2 // 3

// Bolean + Número = Adición

true + 1 // 2

// Bolean + Bolean // Adición

false + false // 0

// Número + String = Concatenación

5 + 'foo' // "5foo"

// String + Bolean = Concatenación

'foo' + true // "footrue"

// String + String = Concatenación

'foo' + 'bar' // "foobar"

Resta o sustracción (-)

La resta se produce cuando se sutraen el resultado de los operadores, produciendo su diferencia.

Sintaxis
Operador: x - y
Ejemplos
5 - 3 // 2
3 - 5 // -2
'foo' - 3 // NaN

División (/)
El operador división se produce el cociente de la operación donde el operando izquierdo es el
dividendo y el operando derecho es el divisor.

Sintaxis
Operador: x / y
Ejemplos
1 / 2 // devuelve 0.5 en JavaScript
1 / 2 // devuelve 0 en Java
// (Ninguno de los números es explícitamente un número de punto flotante)

1.0 / 2.0 // devuelve 0.5 en JavaScript y Java

2.0 / 0 // devuelve Infinito en JavaScript

2.0 / 0.0 // devuelve Infinito
2.0 / -0.0 // devuelve -Infinito en JavaScript

Multiplicación (*)
El operador multiplicación produce el producto de la multiplicación de los operandos.
Sintaxis
Operador: x * y
Ejemplos
2 * 2 // 4
-2 * 2 // -4
Infinito * 0 // NaN
Infinito * Infinito // Infinito
'foo' * 2 // NaN

Resto o Residuo (%)

El operador resto devuelve el resto que queda cuando un operando se divide por un segundo
operando. Siempre toma el signo del dividendo, no el divisor. Utiliza una función de modulo
incorporada para producir el resultado, que es el resto entero de dividir var1 por var2 - por
ejemplo - var1 modulo var2. Existe una propuesta para obtener un operador de módulo real en
una versión futura de ECMAScript, con la diferencia de que el resultado del operador de módulo
tomaría el signo del divisor, no el dividendo.

Sintaxis
Operador: var1 % var2
Ejemplos
12 % 5 // 2
-1 % 2 // -1
1 % -2 // 1

NaN % 2 // NaN
1 % 2 // 1
2 % 3 // 2
-4 % 2 // -0
5.5 % 2 // 1.5

Exponenciación (**)
El operador de exponenciación devuelve el resultado de elevar el primer operando al segundo
operando de potencia. es decir, var1var2, en la declaración anterior, donde var1 y var2 son
variables. El operador de exponenciación es asociativo a la derecha. a ** b ** c es igual a a ** (b
** c).

Sintaxis
Operador: var1 ** var2

12. Cómo se utilizan, cómo se declaran las condiciones, case, for , foreach, while,:

sentencia for
Un bucle for se repite hasta que la condición especificada se evalúa como false. El bucle for en
JavaScript es similar al de Java y C. Una sentencia for se muestra como sigue:

for ([expresionInicial]; [condicion]; [expresionIncremento])

Cuando un bucle for se ejecuta, ocurre lo siguiente:

La expresión de inicialización expresionInicial, si existe, se ejecuta. Esta expresión habitualmente

inicializa uno o mas contadores del bucle, pero la sintaxis permite una expresión con cualquier
grado de complejidad. Esta expresión puede también declarar variables.
Se evalúa la expresión condicion. Si el valor de condicion es true, se ejecuta la sentencia del bucle.
Si el valor de condicion es false, el bucle for finaliza. Si la expresión condicion es omitida, la
condición es asumida como verdadera.
Se ejecuta la sentencia. Para ejecutar múltiples sentencias, use un bloque de sentencias ({ ... })
para agruparlas.
Se ejecuta la expresión expresionIncremento, si hay una, y el control vuelve al paso 2.

Ejemplo
La siguiente función contiene una sentencia for que cuenta el número de opciones seleccionadas
en una lista (un elemento <select> que permite selección múltiple). La sentencia for declara la
variable i y la inicializa a cero. Comprueba que i es menor que el número de opciones en el
elemento <select>, ejecuta la sentencia siguiente if, e incrementa i en uno tras cada paso por el
bucle.

<form name="selectForm">
<p>
<label for="musicTypes">Choose some music types, then click the button below:</label>
<select id="musicTypes" name="musicTypes" multiple="multiple">
<option selected="selected">R&B</option>
<option>Jazz</option>
<option>Blues</option>
<option>New Age</option>
<option>Classical</option>
<option>Opera</option>
</select>
</p>
<p><input id="btn" type="button" value="How many are selected?" /></p>
</form>

<script>
function howMany(selectObject) {
var numberSelected = 0;
for (var i = 0; i < selectObject.options.length; i++) {
if (selectObject.options[i].selected) {
 numberSelected++;
}
}
return numberSelected;
}

var btn = document.getElementById("btn");

btn.addEventListener("click", function(){
alert('Number of options selected: ' + howMany(document.selectForm.musicTypes))
});
</script>

sentencia do...while
La sentencia do...while se repite hasta que la condición especificada que se evalúa sea false. Una
sentencia do...while se mostrará como sigue:

while (condicion);

sentencia se ejecuta antes de que la condición sea evaluada. Para ejecutar múltiples sentencias,
use un bloque de sentencias ({ ... }) para agruparlas. Si condicion es true, la sentencia se ejecuta de
nuevo. Al final de cada ejecución, la condición es comprobada. Cuando la condición es falsa, la
ejecución se detiene y el control pasa a la sentencia siguiente al do...while.

Ejemplo
En el siguiente ejemplo, el bucle do itera al menos una vez y vuelve a hacerlo mientras i sea menor
que 5.

do {
i += 1;
console.log(i);
} while (i < 5);

sentencia while
Una sentencia while ejecuta sus sentencias mientras la condición sea evaluada como verdadera.
Una sentencia while tiene el siguiente aspecto:

Si la condición cambia a falsa, la sentencia dentro del bucle deja de ejecutarse y el control pasa a la
sentencia inmediatamente después del bucle.

La condición se evalúa antes de que la sentencia contenida en el bucle sea ejecutada. Si la

condición devuelve verdadero, la sentencia se ejecuta y la condición se comprueba de nuevo. Si la
condición es evaluada como falsa, se detiene la ejecución y el control pasa a la sentencia siguiente
al while.
Para ejecutar múltiples sentencias, use un bloque de sentencias ({ ... }) para agruparlas.

Ejemplo 1
El siguiente bucle while itera mientras n sea menor que tres:

n = 0;
x = 0;
while (n < 3) {
n++;
x += n;
}
Con cada iteración, el bucle incrementa n y añade ese valor a x. Por consiguiente, x y n toman los
siguientes valores:

Después del primer paso: n = 1 y x = 1

Después del segundo paso: n = 2 y x = 3
Después del tercer paso: n = 3 y x = 6
Tras completar el tercer paso, la condición n < 3 ya no es verdadera, por tanto el bucle termina.

sentencia label
Un label proporciona una sentencia con un identificador que permite referirse a él desde cualquier
lugar de su programa. Por ejemplo, usted puede usar un label para identificar un bucle, y usar las
sentencias break o continue para indicar si el programa debe interrumpir un bucle o continuar su
ejecución.

La sintaxis de la sentencia label es:

label :
sentencia

El valor de label puede ser cualquier identificador JavaScript que no sea una palabra reservada. La
sentencia que usted identifique con un label podrá ser cualquier sentencia.

Ejemplo
En este ejemplo, el label markLoop identifica a un bucle while.

markLoop:
while (theMark == true) {
doSomething();
}

sentencia break
Use la sentencia break para salir de un bucle, switch, o en conjunto con una sentencia label.
Cuando use break sin un label, finaliza inmediatamente el código encerrado en while, do-while,
for, o switch y transfiere el control a la siguiente sentencia.
Cuando usted use break con un label, termina la sentencia especificada por label.
La sintaxis de la sentencia break es la siguiente:

break;
break label;
La primera forma de la sintaxis finaliza con lo encerrado por el bucle o switch; la segunda finaliza lo
especificado por la sentencia label.

Ejemplo 1

El siguiente ejemplo itera a través de los elementos en un array hasta que encuentra que un índice
de un elemento cuyo valor es elValor:

for (i = 0; i < a.longitud; i++) {

if (a[i] == elValor) {

break;

sentencia continue
La sentencia continue puede usarse para reiniciar una sentencia while, do-while, for, o label.

Cuando use continue sin un label, este termina la iteración en curso del código encerrado en una
sentencia while, do-while, o for y continúa la ejecución del bucle con la siguiente iteración. A
diferencia de la sentencia break, continue no termina completamente la ejecución del bucle. En un
bucle while, salta atrás hasta la condición. En un bucle for, salta a la expresionIncremento.
Cuando use continue con un label, esta se aplica al bucle identificado con el label indicado.
La sintaxis de la sentencia continue es la siguiente:

continue;
continue label;
Ejemplo 1
El siguiente ejemplo muestra un bucle while con una sentencia continue que se ejecuta cuando el
valor de i es tres. Así, n toma los valores uno, tres, siete, y doce.

i = 0;
n = 0;
while (i < 5) {
i++;
 if (i == 3) {
continue;
}
n += i;
}

sentencia for...in
La sentencia for...in itera una variable especificada sobre todas las propiedades enumerables de
un objeto. Para cada propiedad distinta, JavaScript ejecuta las sentencias especificadas. Una
sentencia for...in será como sigue:

for (variable in objeto) {

sentencias
}

Ejemplo
La siguiente función toma como su argumento un objeto y el nombre del objeto. Entonces itera
sobre todas las propiedades del objeto y devuelve una cadena que lista los nombres de las
propiedades y sus nombres.

function volcar_propiedades(obj, obj_nombre) {

var resultado = "";
for (var i in obj) {
resultado += obj_nombre + "." + i + " = " + obj[i] + "<br>";
}
resultado += "<hr>";
return resultado;
}
Para un objeto coche con propiedades marca y modelo, resultado sería:

coche.marca = Ford
coche.modelo = Mustang

sentencia for...of
La sentencia for...of crea un bucle iterando sobre objetos iterables (incluyendo Array, Map, Set,
argumentos, objetos etc), invocando una iteración personalizada conectando con sentencias para
ser ejecutadas por el valor de cada propiedad distinta.

for (variable of objeto) {

sentencia
}
El siguiente ejemplo muestra la diferencia entre un bucle for...of y un bucle for...in. Mientras
for...in itera sobre nombres de propiedades, for...of itera sobre valores de propiedades:
let arr = [3, 5, 7];
arr.foo = "hello";

for (let i in arr) {

console.log(i); // logs "0", "1", "2", "foo"
}

for (let i of arr) {

console.log(i); // logs "3", "5", "7"
}

13. Qué es handlebars cómo se utilizan, cómo se configuran en express

Handlebars es una historia diferente a Jade, su forma de trabajo es similar a otros motores como
Jinja2 o Swig, ya que nos permite escribir etiquetas HTML y luego dentro con código del motor
propio podemos definir que imprime del contexto y la forma en que lo hace.

Otro aspecto de Handlebars es que puede funcionar en dos formas, desde el lado del servidor o
desde el lado cliente. Esta versatilidad hace que podamos decidir mejor como queremos realizar
nuestras aplicaciones, ya que si es una SPA o Aplicación de una sola página, tal vez el enfoque del
lado cliente sea más sencillo y útil, pero si queremos un web site tal vez generar todo en el
servidor sea más útil.

14. Cómo se maneja los condicionales en handlebars:

Instalar Handlebars en lado Servidor

Para instalar Handlebars en el lado del servidor es muy fácil, simplemente debemos utilizar npm
en nuestra consola y así obtendremos los paquetes necesarios, veamos que tenemos que escribir:
npm install --save express-handlebars
Con ello npm va a descargar todos los componentes necesarios para que podamos incorporar este
motor en nuestro proyecto al final debemos obtener un resultado similar al siguiente en nuestra
consola:
Luego en nuestro archivo donde iniciamos nuestra aplicación Express debemos decirle que utilice
este como el motor de platillas, para ello simplemente nos basta con escribir el siguiente código:

var handlebars = require('express-handlebars') .create({ defaultLayout:

'main' });app.engine('handlebars', handlebars.engine);app.set('view
engine', 'handlebars');

Lo que nos quedaría en nuestro archivo sería lo siguiente:

Handlebars tiene una sintaxis propia muy limpia que nos permite incorporar un poco de lógica de
vistas dentro de la plantilla, podemos incorporar comentarios, iterar sobre listas y bloques,
escapar o no secciones de texto. Es por ello que es importante conocer las más básicas de forma
que podamos expresar nuestras ideas de forma más cómoda y así sacar el máximo provecho,
veamos a continuación lo más básico del motor.

15. Cómo se imprime variables y se recorren los ciclos en handlebars

JS

$(function () {
  // Grab the template script
  var theTemplateScript = $("#expressions-template").html();

  // Compile the template

  var theTemplate = Handlebars.compile(theTemplateScript);

  // Define our data object

  var context={
    "description": {
      "escaped": "Using {{}} brackets will result in escaped HTML:",
      "unescaped": "Using {{{}}} will leave the context as it is:"
    },
    "example": "<button> Hello </button>"
  };

  // Pass our data to the template

  var theCompiledHtml = theTemplate(context);

  // Add the compiled html to the page

  $('.content-placeholder').html(theCompiledHtml);
});

Contexto

Handlebars se basa en las mejores características de Mustache. Una de ellas es el concepto de

contexto. Cada plantilla que implementes tiene un contexto. El nivel superior, es el objeto
JavaScript que se pasa a la plantilla compilada. Pero los helpers como #each o #with lo modifican,
de manera que se puede acceder a las propiedades del objeto iterado directamente. Con el
siguiente ejemplo verás las cosas más claras.

16. Qué es un puerto en express, cómo se configura:

Express es el framework web más popular de Node, y es la librería subyacente para un gran
número de otros frameworks web de Node populares. Proporciona mecanismos para:

Escritura de manejadores de peticiones con diferentes verbos HTTP en diferentes caminos URL
(rutas).
Integración con motores de renderización de "vistas" para generar respuestas mediante la
introducción de datos en plantillas.
Establecer ajustes de aplicaciones web como qué puerto usar para conectar, y la localización de las
plantillas que se utilizan para renderizar la respuesta.
Añadir procesamiento de peticiones "middleware" adicional en cualquier punto dentro de la
tubería de manejo de la petición.
A pesar de que Express es en sí mismo bastante minimalista, los desarrolladores han creado
paquetes de middleware compatibles para abordar casi cualquier problema de desarrollo web.
Hay librerías para trabajar con cookies, sesiones, inicios de sesión de usuario, parámetros URL,
datos POST, cabeceras de seguridad y muchos más. Puedes encontrar una lista de paquetes
middleware mantenida por el equipo de Express en Express Middleware (junto con una lista de
algunos de los paquetes más populares de terceros).
¿Cómo es el código para Express?
En sitios web o aplicaciones web dinámicas, que accedan a bases de datos, el servidor espera a
recibir peticiones HTTP del navegador (o cliente). Cuando se recibe una petición, la aplicación
determina cuál es la acción adecuada correspondiente, de acuerdo a la estructura de la URL y a la
información (opcional) indicada en la petición con los métodos POST o GET. Dependiendo de la
acción a realizar, puede que se necesite leer o escribir en la base de datos, o realizar otras acciones
necesarias para atender la petición correctamente. La aplicación ha de responder al navegador,
normalmente, creando una página HTML dinámicamente para él, en la que se muestre la
información pedida, usualmente dentro de un elemento especifico para este fin, en una plantilla
HTML.

Express posee métodos para especificar que función ha de ser llamada dependiendo del verbo
HTTP usado en la petición (GET, POST, SET, etc.) y la estructura de la URL ("ruta"). También tiene
los métodos para especificar que plantilla ("view") o gestor de visualización utilizar, donde están
guardadas las plantillas de HTML que han de usarse y como generar la visualización adecuada
para cada caso. El middleware de Express, puede usarse también para añadir funcionalidades para
la gestión de cookies, sesiones y usuarios, mediante el uso de parámetros, en los métodos
POST/GET. Puede utilizarse además cualquier sistema de trabajo con bases de datos, que sea
soportado por Node (Express no especifica ningún método preferido para trabajar con bases de
datos).
El code para express es el siguiente:

var express = require('express');

var app = express();

app.get('/', function(req, res) {

res.send('Hola Mundo!');
});

app.listen(3000, function() {
console.log('Aplicación ejemplo, escuchando el puerto 3000!');
});

Las primeras dos líneas incluyen (mediante la orden require()) el módulo de Express y crean una
aplicación de Express. Este elemento se denomina comúnmente app, y posee métodos para el
enrutamiento de las peticiones HTTP, configuración del 'middleware', y visualización de las vistas
de HTML, uso del motores de 'templates', y gestión de las configuraciones de las aplicaciones que
controlan la aplicación (por ejemplo el entorno, las definiciones para enrutado ... etcetera.)

Las líneas que siguen en el código (las tres líneas que comienzan con app.get) muestran una
definición de ruta que se llamará cuando se reciba una petición HTTP GET con una dirección ('/')
relativa al directorio raíz. La función 'callback' coge una petición y una respuesta como
argumentos, y ejecuta un send() en la respuesta, para enviar la cadena de caracteres: "Hola
Mundo!".

El bloque final de código, define y crea el servidor, escuchando el puerto 3000 e imprime un
comentario en la consola. Cuando se está ejecutando el servidor, es posible ir hasta la dirección
localhost:3000 en un navegador, y ver como el servidor de este ejemplo devuelve el mensaje de
respuesta.

17. Qué es un arreglo, cómo se declara, cómo se accede a un valor de un arreglo:

En javascript un arreglo es una colección ordenada de elementos no homogéneos, cada elemento

puede ser de un tipo de dato diferente. En javascript los arreglos empiezan con el subíndice 0.
Ejemplo: La siguiente sentencia genera un arreglo con 4 elementos de distinto tipo var b = new
Array(2.5, false, 6, "Hola");

Arreglos simples
Los arrays simples, también llamados "tablas" o "matrices", son el método más común y simple de
almacenar datos. Técnicamente, un Array es un objeto intrínseco de JavaScript. Admite datos del
tipo cadenas, números, objetos, arrays, true, false, null.

Definiendo Arreglos Simples

método 1º: definiendo y poblando simultáneamente

var tabla = new Array(25,35,12,34);

var tabla = [25,35,12,34];
método 2º: definiendo primero, poblando después cualquiera de las siguientes es válida en unos
casos se expecifica el número de elementos en otros no

var tabla = new Array();

var tabla = new Array(7);
var tabla = [];
var tabla = [7];
poblando el arreglo
tabla[0] = "lunes";
tabla[1] = "martes";
tabla[2] = "miércoles";
tabla[3] = "jueves";
tabla[4] = "viernes";
tabla[5] = "sábado";
tabla[6] = "domingo";

Propiedades y Métodos de los arreglos

Todo objeto de JavaScript, tanto los intrínsecos como los definidos por el programador, tiene
propiedades y/o métodos. Los del objeto Array que nos interesan son:

Propiedad:
length: devuelve al número de elementos del array;
Uso: tabla.length
Métodos:

concat
Definición: este método añade al final de un array los elemementos de otro array.
Uso: var a = [] , b = [] , c = []; c = a.concat(b);
join
Definición: este método crea un texto con los elementos del array separados por un carácter que
se especifique.
Uso: var a = []; var texto = a.join("#");
Ejemplo:
var a = [1,2,3];
var texto = a.join("-");
// devuelve texto = "1-2-3"
reverse
Definición: este método genera un nuevo array transponiendo los elementos del array al que le
aplicamos dicho método. Uso: var a = [];
var b = a.reverse();

slice
Definición: devuelve al fragmento del array comprendido entre los elementos cuyas
posicionespasemos como parámetros (inicial, final); si se utiliza un solo parámetro es desde esa
posicion hasta el final. Uso: var a =[]; a.slice(inicial[opcional:,final]);
Ejemplo:
var $tabla = ["lunes","martes","miercoles","jueves"];
var $aux = $tabla.slice(0,2);
print($aux.join("="));
//devuelve "lunes=martes"
var $aux2 = $tabla.slice(2);
print($aux2.join("="));
//devuelve "miercoles=jueves"

sort
Definición: ordena los elementos de un array.
Uso: var a = []; a.sort();
Ejemplo:
var $tabla = ["lunes","martes","miercoles","jueves"];
print($tabla.sort());
// devuelve "jueves,lunes,martes,miercoles"
Accediendo a elementos
Accediendo a elementos individuales del array:
nombre_array[índice] (índice = 0,1,...,n-1) (n = nombre_array.length)
Accediendo a todos los elementos del array:
Método 1: bucle for
Ejemplo: for(i = 1; i< $tabla.length; i++){ ... }

Método 2: bucle for...in

var $tabla = ["lunes","martes","miercoles","jueves"];
for (indice in $tabla){
print (indice+ "=>" + $tabla[indice]);
}
/*devuelve:
0=>lunes
1=>martes
2=>miercoles
3=>jueves
/
18. Qué es un objeto, cómo se declara y como se accede a un valor de ese objeto.

Un objeto es una colección de propiedades, y una propiedad es una asociación entre un nombre (o
clave) y un valor. Un valor de una propiedad puede ser una función, en cuyo caso la propiedad es
conocida como un método. Además de los objetos que están predefinidos en el navegador,
puedes definir tus propios objetos.

Un objeto de JavaScript tiene propiedades asociadas a él. Una propiedad de un objeto puede ser
explicada como una variable adjunta al objeto. Las propiedades de un objeto son basicamente lo
mismo que las variables comunes de JavaScript, excepto por el nexo con el objeto. Las
propiedades de un objeto definen las características de un objeto; se puede acceder a ellas con
una simple notación de puntos:

nombreObjeto.nombrePropiedad

Como todas las variables de JavaScript, tanto el nombre del objeto (que puede ser una variable
normal) y el nombre de propiedad son sensible a mayúsculas y minúsculas. Puedes definir
propiedades asignándoles un valor. Por ejemplo, vamos a crear un objeto llamado miAuto y le
vamos a asignar propiedades denominadas marca, modelo, y año de la siguiente manera:

var miAuto = new Object();

miAuto.marca = "Ford";
miAuto.modelo = "Mustang";
miAuto.año = 1969;

Las propiedades no asignadas de un objeto son undefined (y no null).

miAuto.color; // undefined

Las propiedades de los objetos en JavaScript también pueden ser accedidas o establecidas
mediante la notación de corchetes [ ](Para más detalle ver property accesors). Los objetos son
llamados a veces arreglos asociativos, ya que cada propiedad está asociada con un valor de cadena
que puede ser utilizada para acceder a ella. Así, por ejemplo, puedes acceder a las propiedades del
objeto miAuto de la siguiente manera:

miAuto["marca"] = "Ford";
miAuto["modelo"] = "Mustang";
miAuto["año"] = 1969;
El nombre de la propiedad de un objeto puede ser cualquier cadena válida de JavaScript, o
cualquier cosa que se pueda convertir en una cadena, incluyendo una cadena vacía. Sin embargo,
cualquier nombre de propiedad que no sea un identificador válido de JavaScript (por ejemplo, el
nombre de alguna propiedad que tenga un espacio o un guión, o comienza con un número) sólo
puede ser accedido utilizando la notación de corchetes. Esta notación es muy útil también cuando
los nombres de propiedades son determinados dinámicamente (cuando el nombre de la
propiedad no se determina hasta su tiempo de ejecución). Ejemplos de ésto se muestran a
continuación:

var miObjeto = new Object(),

cadena = "miCadena",
aleatorio = Math.random(),
objeto = new Object();

miObjeto.type = "Sintaxis con punto";

miObjeto["Fecha de creación"] = "Cadena con espacios y acento";
miObjeto[cadena] = "String value";
miObjeto[aleatorio] = "Número Aleatorio";
miObjeto[objeto] = "Objeto";
miObjeto[""] = "Incluso una cadena vacía";

console.log(miObjeto);

Listar las propiedades de un objeto

A partir de ECMAScript 5, hay tres formas nativas para listar/atravezar propiedades de objeto:

bucles for...in
Este método recorre todas las propiedades enumerables de un objeto y su cadena de prototipo.

Object.keys(o)
Este método devuelve una matriz con todos los nombres de propiedades ("keys") enumerables y
propias (no de la cadena de prototipos) de un objeto o.

Object.getOwnPropertyNames(o)
Este método devuelve una matriz que contiene todos los nombres (enumerables o no) de las
propiedades de un objeto o.
Antes de ECMAScript 5, no existía una manera nativa para listar todas las propiedades de un
objeto. Sin embargo, esto se puede lograr con la siguiente función:

function listaTodasLasPropiedades(o){
var objetoAInspeccionar;
var resultado = [];

for(objetoAInspeccionar = o; objetoAInspeccionar !== null;

objetoAInspeccionar = Object.getPrototypeOf(objetoAInspeccionar)){
resultado =
resultado.concat(Object.getOwnPropertyNames(objetoAInspeccionar)) +
"\n";
}

return resultado;

Creando nuevos objetos

JavaScript tiene un número de objetos predefinidos. Además, puedes crear tus propios objetos. En
JavaScript 1.2 y versiones posteriores, puedes crear un objeto usando un inicializador de objeto.
Como alternativa, puedes crear primero una función constructora y luego crear una instancia de
un objeto invocando esa función con el operador new.

El uso de inicializadores de objeto

Además de la creación de objetos utilizando una función constructora, puedes crear objetos
utilizando un inicializador de objeto. El uso de los inicializadores de objeto se refiere a veces a
como crear objetos con la notación literal. "Inicializador de objeto" es consistente con la
terminología utilizada por C++.

La sintaxis para un objeto usando un inicializador de objeto es:

var objeto = { propiedad_1 : valor_1, // propiedad_# puede ser

un identificador...
2: valor_2, // o un numero...
// ...,
"propiedad n": valor_n }; // o una cadena
19. Qué es un json, como se declara y como se accede a un valor de ese json:

El objeto JSON contiene métodos para analizar JavaScript Object Notation (JSON) y convertir
valores a JSON. No puede ser llamado o construído, y aparte de estas dos propiedades, no tiene
funcionalidad interesante por sí mismo.

JavaScript Object Notation

JSON es una sintaxis para serializar objetos, arreglos, números, cadenas, booleanos y nulos. Está
basado sobre sintaxis JavaScript pero es diferente a ella: algo JavaScript no es JSON, y algo JSON
no es JavaScript.

Tipo
JavaScrip Diferencia JSON
t
Los nombres de las propiedades deben tener doble comilla; las comas
Objetos y finales están prohibidas.
arreglos

Los ceros a la izquierda están prohibidos; un punto decimal debe ser

Números
seguido al menos por un dígito.

Solo un limitado conjunto de caracteres pueden ser de escape; ciertos

caracteres de control estan prohibidos; los caracteres de separador de
linea Unicode (U+2028) y el separador de parrafo (U+2029) son
permitidos; las cadenas deben estar entre comillas dobles. Mira el
siguiente ejemplo donde JSON.parse funciona bien y unSyntaxError es
Cadenas generado cuando se evalua el codigo como JavaScript:
var code = '"\u2028\u2029"';
JSON.parse(code); // works fine
eval(code); // fails

La sintaxis JSON completa es la siguiente:

JSON = null
or true or false
or JSONNumber
or JSONString
or JSONObject
or JSONArray
JSONNumber = - PositiveNumber
or PositiveNumber
PositiveNumber = DecimalNumber
or DecimalNumber . Digits
or DecimalNumber . Digits ExponentPart
or DecimalNumber ExponentPart
DecimalNumber = 0
or OneToNine Digits
ExponentPart = e Exponent
or E Exponent
Exponent = Digits
or + Digits
or - Digits
Digits = Digit
or Digits Digit
Digit = 0 through 9
OneToNine = 1 through 9

JSONString = ""
or " StringCharacters "
StringCharacters = StringCharacter
or StringCharacters StringCharacter
StringCharacter = any character
except " or \ or U+0000 through U+001F
or EscapeSequence
EscapeSequence = \" or \/ or \\ or \b or \f or \n or \r or \t
or \u HexDigit HexDigit HexDigit HexDigit
HexDigit = 0 through 9
or A through F
or a through f

JSONObject = { }
or { Members }
Members = JSONString : JSON
or Members , JSONString : JSON

JSONArray = [ ]
or [ ArrayElements ]
ArrayElements = JSON
or ArrayElements , JSON
20. Qué son las rutas en nodeJS y como se utilizan en el express:

Direccionamiento hace referencia a la definición de puntos finales de aplicación (URI) y cómo

responden a las solicitudes de cliente. Para ver una introducción al direccionamiento, consulte
Direccionamiento básico.

var express = require('express');

var app = express();

// respond with "hello world" when a GET request is made to the homepage
app.get('/', function(req, res) {
res.send('hello world');
});

Métodos de ruta

Un método de ruta se deriva de uno de los métodos HTTP y se adjunta a una instancia de la clase
express.

El siguiente código es un ejemplo de las rutas que se definen para los métodos GET y POST a la raíz
de la aplicación.

// GET method route

app.get('/', function (req, res) {
res.send('GET request to the homepage');
});

// POST method route

app.post('/', function (req, res) {
res.send('POST request to the homepage');
});

Express da soporte a los siguientes métodos de direccionamiento que se corresponden con los
métodos HTTP: get, post, put, head, delete, options, trace, copy, lock, mkcol, move, purge,
propfind, proppatch, unlock, report, mkactivity, checkout, merge, m-search, notify, subscribe,
unsubscribe, patch, search y connect.

21. Qué son los script de arranque. Donde se configura el ambiende de producción y el de
desarrollo. Cómo colocarles un alias a los script de arranque.

Un script es un programa insertado dentro del documento html y que es interpretado y ejecutado
por el navegador del usuario. Por tanto estos programas se ejecutan en el ordenador del usuario
bien sea directamente (al leer la página) o cuando se produce un suceso determinado (eventos),
como puede ser el pulsar sobre un enlace o mover el ratón o cargar una imagen o modificar el
tamaño de la ventana del navegador.

Estos scripts permiten crear páginas dinámicas: modificar el comportamiento normal del
navegador, validar formularios, realizar pequeños efectos visuales, etc... Sin embargo, conviene
recordar que se ejecutan en el navegador del usuario y no en el servidor donde las páginas estén
alojadas, por lo que no podrán realizar cosas como manejar bases de datos. Esto hace que
aplicaciones como contadores o buscadroes (por ejemplo) se deban realizar de otra manera,
utilizando los llamdos programas CGI (escritos en lenguajes como Perl o PHP).

Como ejecutar un scriptde arranque:

Ejecute el script de arranque para configurar la red en el dispositivo del proveedor de servicios.

Procedimiento
1-En vSphere Client, encienda el dispositivo del SP1 y abra la ventana de la consola.
2-Inicie sesión con el usuario desktone y la contraseña que introdujo en la sección anterior.
3-Empiece el proceso de arranque ejecutando el siguiente comando:

sudo /usr/local/desktone/scripts/bootstrap.sh

4-El script de arranque le solicita que introduzca la información de red en los campos que
aparecen en la siguiente tabla. Los valores que se muestran son solo valores de ejemplo. Cuando
termine de escribir la información de red, el host se reinicia. El dispositivo podría tardar cinco
minutos en iniciarse después del reinicio. Como el nodo no se configura hasta que se completa el
reinicio, ignore los mensajes de error que aparezcan en la consola.
5-Después de que se reinicie el host, puede iniciar sesión mediante putty u otro terminal SSH de su
elección.
6-Introduzca la información en los campos como se describe a continuación.

Campo Valor de ejemplo Notas

Introduzca el nombre CityOfFirstDC
del centro de datos
Introduzca la IP de eth1 169.254.4.20 Para la red del componente principal (debe ser una
(componente principal) dirección local de vínculo)
Introduzca el formato 22 Para la red de componente principal
CIDR de máscara de red
0-32
Introduzca la IP de eth0 172.16.109.20 Para la red SP
(SP)
Introduzca el formato 24 Para la red SP
CIDR de máscara de red
0-32
Introduzca la puerta de 172.16.109.1 Para la red SP
Campo Valor de ejemplo Notas
enlace de eth0 (SP)
Introduzca el nombre de SP1.DESKTONE.COM Haga que coincida el nombre usado para la IP del
host centro de datos de SP.
Introduzca el servidor de 172.16.109.2
nombres
Introduzca los 172.16.3.1 Introduzca un valor solo si tiene un servidor
servidores NTP (separe horario.
los servidores con
comas).
Si pulsa Intro en el
primer servidor NTP, se
configurará
[ntp.ubuntu.com].
Introduzca la IP para la 172.16.109.26
dirección flotante
Introduzca la contraseña dtPasswd Debe tener al menos ocho caracteres y contener al
psql menos una letra en mayúscula, una minúscula, un
número y un carácter especial. Esto modifica las
contraseñas psql para los usuarios slony, esclavo,
principal y administrador. La contraseña no se
muestra en pantalla.
Introduzca la contraseña myPasswd Debe tener al menos ocho caracteres y contener al
del dispositivo menos una letra en mayúscula, una minúscula, un
número y un carácter especial. Contraseña definida
por el usuario para los dispositivos del proveedor
de servicios de este centro de datos. Cualquier
dispositivo del proveedor de servicios al que pueda
acceder SSH requiere esta contraseña
personalizada.
Introduzca la contraseña Introduzca la contraseña de la cuenta de cim-user.
de usuario de CIM Solo esta cuenta tendrá acceso a los servicios de
supervisión de CIM.
¿Esta configuración es Sí o no La información que se muestra incluye dos valores
correcta? internos, el UID del centro de datos y el VMGR UID,
que puede ignorar.

22. Qué es package.json. qué se configura, para que sirve

¿Qué es el package.json?
De cierta forma, podemos considerar este package.json como un manifiesto de nuestro proyecto.

Históricamente, Node ha trabajado con una herramienta para administrar paquetes llamada npm.
Esta herramienta, que normalmente se instala junto con Node, tiene dos roles fundamentales:

Manejar la publicación de un proyecto al registro público de npm (para que otros puedan
descargarlo y utilizarlo como dependencia en sus propios proyectos).

Administrar las dependencias de tu proyecto.

Para esto, guarda un registro en un archivo llamado, justamente, package.json.

Dentro de este archivo se definen y manejan características como:

 Nombre de tu proyecto.
 Versión.
 Dependencias.
 Repositorio.
 Autores.
 Licencia.
Y más.
¿Cómo crearlo?

Antes de crear un package.json, hay solo una regla a tener en consideración: El archivo debe ser
un JSON de formato válido

Para crearlo, hay 2 formas: hacerlo de forma manual o hacerlo de forma automática:

Creando un package.json manualmente

Si bien es recomendable usar alguno de los asistentes para crear el archivo de forma automática,
en caso de que necesitemos hacerlo de forma manual, es solo cosa de crear un archivo llamado
package.json en la raíz del proyecto e incluir, como mínimo, la siguiente información:

name.
version.
Todos los demás campos son opcionales, aunque recomendados.

Creando un package.json automáticamente

Es la forma más rápida de hacerlo, ya que tanto npm como yarn incluyen un asistente que nos
permite crear un package.json con un solo comando:
npm init

Dependiendo de cual usemos, el asistente nos hará algunas preguntas para definir la información
del proyecto (nombre, version, archivo de entrada, licencia y repositorio entre otros)
Al terminar, tendremos un nuevo y flamante package.json en la raíz del directorio donde hayamos
ejecutado el comando.

El sistema de control de versiones de paquetes de npm tiene reglas estrictas. El formato de las
versiones es el siguiente:
[major].[minor].[patch]

Supongamos que tiene un paquete en la aplicación con la versión 5.2.1. La versión principal es 5, la
versión secundaria es 2 y el parche es 1.
En una actualización de versión principal, el paquete incluye nuevas características que no son
compatibles con versiones anteriores, es decir, cambios importantes.
En una actualización de versión secundaria, se han agregado nuevas características al paquete que
son compatibles con versiones anteriores del paquete.
En una actualización de revisión, se incluyen una o varias correcciones de errores. Las correcciones
de errores son siempre compatibles con versiones anteriores.
Conviene tener en cuenta que algunas características del paquete de npm tienen dependencias.
Por ejemplo, para usar una nueva característica del paquete de compilador de TypeScript (ts-
loader) con webpack, es posible que también tenga que actualizar los paquetes webpack npm y
webpack-cli.
Para ayudar a administrar el control de versiones del paquete, npm es compatible con varias
notaciones que puede usar en el archivo package.json. Puede usar estas notaciones para controlar
el tipo de actualizaciones del paquete que quiere aceptar en la aplicación.
Supongamos que está usando React y debe incluir los paquetes npm react y react-dom. Podría
especificarlo de varias maneras en su archivo package.json. Por ejemplo, puede especificar el uso
de la versión exacta de un paquete de la siguiente forma.

"dependencies": {
"react": "16.4.2",
"react-dom": "16.4.2",
},

Al usar la notación anterior, npm siempre obtendrá la versión exacta especificada, 16.4.2.
Puede usar una notación especial para limitar las actualizaciones a solo actualizaciones de
revisiones (correcciones de errores). En este ejemplo:

"dependencies": {
"react": "~16.4.2",
"react-dom": "~16.4.2",
},

23. Qué es un componente / dependencias, cómo se instala y cuales son los más utilizados para
configura express. (MYSQL, handlebars, encriptar, login, )
Los componentes permiten separar la interfaz de usuario en piezas independientes, reutilizables y
pensar en cada pieza de forma aislada.Esta página proporciona una introducción a la idea de los
componentes.

Conceptualmente, los componentes son como las funciones de JavaScript. Aceptan entradas
arbitrarias (llamadas “props”) y devuelven a React elementos que describen lo que debe aparecer
en la pantalla.

La forma más sencilla de definir un componente es escribir una función de JavaScript:

function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}

Esta función es un componente de React válido porque acepta un solo argumento de objeto
“props” (que proviene de propiedades) con datos y devuelve un elemento de React. Llamamos a
dichos componentes “funcionales” porque literalmente son funciones JavaScript.
También puedes utilizar una clase de ES6 para definir un componente:
class Welcome extends React.Component {
render() {
return <h1>Hello, {this.props.name}</h1>;
}
}

Los dos componentes anteriores son equivalentes desde el punto de vista de React.
Tanto los componentes de función como de clase tienen algunas características adicionales que
veremos en las próximas secciones.

Renderizando un componente
Anteriormente, sólo encontramos elementos de React que representan las etiquetas del DOM:

const element = <div />;

Sin embargo, los elementos también pueden representar componentes definidos por el usuario:
const element = <Welcome name="Sara" />;

Cuando React ve un elemento representando un componente definido por el usuario, pasa

atributos JSX e hijos a este componente como un solo objeto. Llamamos a este objeto “props”.

Por ejemplo, este código muestra “Hello, Sara” en la página:

function Welcome(props) { return <h1>Hello, {props.name}</h1>;
}
const element = <Welcome name="Sara" />;ReactDOM.render(
element,
document.getElementById('root')
);

Composición de componentes
Los componentes pueden referirse a otros componentes en su salida. Esto nos permite utilizar la
misma abstracción de componente para cualquier nivel de detalle. Un botón, un cuadro de
diálogo, un formulario, una pantalla: en aplicaciones de React, todos son expresados comúnmente
como componentes.
Por ejemplo, podemos crear un componente App que renderiza Welcome muchas veces:
function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}

function App() {
return (
<div>
<Welcome name="Sara" /> <Welcome name="Cahal" /> <Welcome
name="Edite" /> </div>
);
}

ReactDOM.render(
<App />,
document.getElementById('root')
);

24. Qué es nodemon, para que sirve cómo funciona

Nodemon es una de las muchas herramientas que nos proporciona npm para mejorar o añadir
algunas funcionalidades extra y normalmente muy útil útiles a Node.js
¿PARA QUÉ SIRVE NODEMON?
Nodemon se ha creado para facilitar el desarrollo en Node.js añadiendo una nueva función que
nos va a venir muy bien, que es la de permitir que todos los cambios que realicemos en nuestro
proyecto se implementen a tiempo real en este.

Cuando queremos ejecutar un fichero con Node, normalmente utilizaríamos el siguiente comando
en la terminal:
node app.js
Donde app.js sería el fichero que queramos ejecutar con Node.
El problema de esto es que si realizáramos cambios durante el desarrollo, estos no se verían
actualizados en tiempo real. Eso es lo que cambia Nodemon, que podríamos decir que es una
especie de extensión del comando Node.

¿CÓMO INSTALAR NODEMON?

Su instalación se realiza a través de npm y es extremadamente sencilla.
Debemos introducir este comando en la terminal:
npm install -g nodemon
En OSX y LINUX: Añadiendo la palabra sudo antes del comando. sudo npm install -g nodemon
En Windows: Ejecutando el terminal como administrador e introducir el comando.
Ahora solo te tocará esperar a que termine de instalar y listo. Si quieres comprobar que
efectivamente se ha instalado bien, utiliza este comando:

nodemon -v

Si todo funciona correctamente, te debería devolver la versión de tu nodemon. En mi caso en el

momento de escribir este post es la “1.19.1”, pero a ti puede que te salga una más reciente.

Si la instalación no se ha realizado correctamente te aparecerá algún tipo de error.

CÓMO UTILIZAR NODEMON

Ahora que ya tienes Nodemon instalado y habiendo confirmado que la instalación se ha realizado
de la forma correcta, ya puedes utilizar Nodemon a placer.

Su uso es muy sencillo, simplemente tendrás que utilizar el comando nodemon en lugar de node al
ejecutar un archivo .js:

nodemon app.js

Al hacerlo verás como la terminal crea un proceso, esto mantendrá a tu terminal ocupada, así que
por si lo que sea necesitas hacer otras cosas con la terminal mientras tanto, tendrás que abrir otra.

Para salir del proceso simplemente pulsa CTRL + C y volverás a poder poner comandos en la
terminal.

Ahora solo te queda probar lo que ocurre al actualizar tu proyecto, verás que como te he dicho
todo se actualiza en tiempo real.

25. Qué es Morgan, para que sirve como funciona (javascript):

API

var  morgan  = require ( ' morgan ' ) 

morgan (formato, opciones)

Cree una nueva función de middleware morgan logger utilizando el

dado formaty options. El formatargumento puede ser una cadena de un nombre predefinido (vea
los nombres a continuación), una cadena de una cadena de formato o una función que producirá
una entrada de registro.

La formatfunción se llamará con tres argumentos tokens, reqy res, donde tokenses un objeto con

todos los tokens definidos, reqes la solicitud HTTP y res es la respuesta HTTP. Se espera que la
función para devolver una cadena que será la línea de registro, o undefined/ nullpara omitir el
registro.

Usar una cadena de formato predefinida

Morgan ( ' diminuto ' )

Usando cadena de formato de tokens predefinidos

morgan ( ' : método: url: estado: res [longitud del contenido] -: tiempo de respuesta ms ' )

Usar una función de formato personalizado

morgan ( función ( tokens , req , res )    { 

  volver [ 

    fichas . método ( req ,  res ) ,

    fichas . url ( req ,  res ) ,

    fichas . estado ( req ,  res ) ,

    fichas . res ( req ,  res , ' longitud de contenido ' )  , ' - ' , 

    tokens [ ' tiempo de respuesta ' ] ( req ,  res ) , ' ms ' 

  ] . unirse ( ' '  )

})

Opciones

Morgan acepta estas propiedades en el objeto de opciones.

inmediato

Escriba la línea de registro a petición en lugar de respuesta. Esto significa que las solicitudes se
registrarán incluso si el servidor falla, pero los datos de la respuesta (como el código de respuesta,
la longitud del contenido, etc.) no se pueden registrar .

omitir
Función para determinar si se omite el registro, el valor predeterminado es false. Esta función se
llamará como skip(req, res).

//   EJEMPLO: solo registrar respuestas de error

Morgan ( ' combinado ' , { 

  skip : function ( req , res )    { return res . statusCode < 400 }      

})

corriente

Flujo de salida para escribir líneas de registro, por defecto process.stdout.

Formatos predefinidos

Se proporcionan varios formatos predefinidos:

conjunto

Salida de registro combinada estándar de Apache.

:remote-addr - :remote-user [:date[clf]] ":method :url HTTP/:http-version" :status :res[content-

length] ":referrer" ":user-agent"

común

Salida de registro común estándar de Apache.

:remote-addr - :remote-user [:date[clf]] ":method :url HTTP/:http-version" :status :res[content-

length]

dev

Resultados concisos coloreados por estado de respuesta para uso de desarrollo. El :status token

será de color verde para los códigos de éxito, rojo para los códigos de error del servidor, amarillo
para los códigos de error del cliente, cian para los códigos de redirección y sin color para los
códigos de información.

:method :url :status :response-time ms - :res[content-length]

corto

Más corto que el predeterminado, también incluye el tiempo de respuesta.

:remote-addr :remote-user :method :url HTTP/:http-version :status :res[content-length] -

:response-time ms

minúsculo

La salida mínima.

:method :url :status :res[content-length] - :response-time ms

Tokens

Crear nuevos tokens

Para definir un token, simplemente invoca morgan.token()con el nombre y una función de

devolución de llamada. Se espera que esta función de devolución de llamada devuelva un valor de
cadena. El valor devuelto está disponible como ": tipo" en este caso:

Morgan . token ( ' type ' , function ( req , res ) { return req . headers [ ' content-type ' ] } )       

Llamar morgan.token()con el mismo nombre que un token existente sobrescribirá esa definición

de token.

Se espera que la función de token se invoque con los argumentos reqy res, que representan la
solicitud HTTP y la respuesta HTTP. Además, el token puede aceptar más argumentos al elegir
personalizar el comportamiento.

:formato de fecha]

La fecha y hora actuales en UTC. Los formatos disponibles son:

 clfpara el formato de registro común ( "10/Oct/2000:13:55:36 +0000")

 isopara el formato de fecha y hora común ISO 8601 ( 2000-10-10T13:55:36.000Z)

 webpara el formato de fecha y hora común RFC 1123 ( Tue, 10 Oct 2000 13:55:36 GMT)

Si no se proporciona ningún formato, el predeterminado es web.

: versión http

La versión HTTP de la solicitud.

:método

El método HTTP de la solicitud.

: referente

El encabezado de referencia de la solicitud. Esto usará el encabezado estándar de Referer mal

escrito si existe; de lo contrario, Referer.

: dirección-remota

La dirección remota de la solicitud. Esto usará req.ip, de lo contrario,

el req.connection.remoteAddressvalor estándar (dirección de socket).

: usuario remoto

El usuario autenticado como parte de la autenticación básica para la solicitud.

: req [encabezado]

El dado headerde la solicitud. Si el encabezado no está presente, el valor se mostrará como "-"en

el registro.
: res [encabezado]

El dado headerde la respuesta. Si el encabezado no está presente, el valor se mostrará como "-"en

el registro.

: tiempo de respuesta [dígitos]

El tiempo entre la entrada de la solicitud morgany el momento en que se escriben los encabezados

de respuesta, en milisegundos.

El digitsargumento es un número que especifica el número de dígitos que se incluirán en el

número, por defecto 3, lo que proporciona una precisión de microsegundos.

:estado

El código de estado de la respuesta.

Si el ciclo de solicitud / respuesta se completa antes de que se envíe una respuesta al cliente (por
ejemplo, el socket TCP se cerró prematuramente por un cliente que abortó la solicitud), entonces
el estado estará vacío (mostrado como "-"en el registro).

: tiempo total [dígitos]

El tiempo entre la entrada de la solicitud morgany cuando la respuesta ha terminado de escribirse

en la conexión, en milisegundos.

El digitsargumento es un número que especifica el número de dígitos que se incluirán en el

número, por defecto 3, lo que proporciona una precisión de microsegundos.

: url

La URL de la solicitud. Se utilizará req.originalUrlsi existe, de lo contrario req.url.

:agente de usuario

El contenido del encabezado User-Agent de la solicitud.

morgan.compile (formato)

Compile una cadena de formato en una formatfunción para que la use morgan. Una cadena de

formato es una cadena que representa una sola línea de registro y puede utilizar la sintaxis de
token. Los tokens son referencias de :token-name. Si los tokens aceptan argumentos, se pueden
pasar usando [], por ejemplo: :token-name[pretty]pasaría la cadena 'pretty'como un argumento al
token token-name.

La función devuelta morgan.compiletoma tres argumentos tokens, reqy res, donde tokenses el

objeto con todos los tokens definidos, reqes la solicitud HTTP y reses la respuesta HTTP. La función
devolverá una cadena que será la línea de registro o undefined/ nullpara omitir el registro.

Normalmente, los formatos se definen utilizando morgan.format(name, format), pero para ciertos

usos avanzados, esta función de compilación está disponible directamente.

Ejemplos
expresar / conectar
Aplicación simple que registrará todas las solicitudes en el formato combinado de Apache en
STDOUT

var  express  = require ( ' express ' ) 

var  morgan  = require ( ' morgan ' ) 

 aplicación  var = express ( ) 

aplicación . use ( morgan ( ' combinado ' ) )

aplicación . get ( ' / ' , function ( req , res ) {    

  res . enviar ( '¡ hola, mundo! ' )

} )

servidor http de vainilla

Aplicación simple que registrará todas las solicitudes en el formato combinado de Apache en
STDOUT

var  finalhandler  = require ( ' finalhandler ' ) 

var  http  = require ( ' http ' ) 

var  morgan  = require ( ' morgan ' ) 

//  crear "middleware"

var  logger  = morgan ( ' combinado ' ) 

 
http . createServer ( función ( req , res )   { 

  var  done  = finalhandler ( req ,  res ) 

  logger ( req ,  res , function ( err ) {   

    si ( err ) volver hecho ( err )   

    //  responder a la solicitud

    res . setHeader ( ' tipo de contenido ' , ' texto / plano

' ) 

    res . end ( ' hola mundo! ' )

  } )

} )

escribir registros en un archivo

fila india

Aplicación simple que registrará todas las solicitudes en el formato combinado de Apache en el
archivo access.log.

var  express  = require ( ' express ' ) 

var  fs  = require ( ' fs ' ) 

var  morgan  = require ( ' morgan ' ) 

var  ruta  = require ( ' ruta ' ) 

 aplicación  var = express ( ) 

 
//  crea una secuencia de escritura (en modo adjuntar)

var  accessLogStream  = fs . createWriteStream ( ruta . join

( __dirname , ' access.log ' ) , {  flags : ' a ' } )     

//  configurar el registrador

aplicación . use ( morgan ( ' combinado ' , {  flujo :

accessLogStream  } )  )

aplicación . get ( ' / ' , function ( req , res ) {    

  res . enviar ( '¡ hola, mundo! ' )

} )

rotación del archivo de registro

Aplicación simple que registrará todas las solicitudes en el formato combinado de Apache en un
archivo de registro por día en el log/directorio utilizando el módulo de flujo de archivos
rotativos .

var  express  = require ( ' express ' ) 

var  morgan  = require ( ' morgan ' ) 

var  ruta  = require ( ' ruta ' ) 

var  rfs  = require ( ' rotating-file-stream ' ) //  versión

2.x  

 aplicación  var = express ( ) 

//  crea una secuencia de escritura rotativa

var  accessLogStream  = rfs . createStream ( ' access.log ' ,
{  

  intervalo : ' 1d ' , //  rotar diariamente  

  camino : camino . unirse ( __dirname , ' log ' )  

} )

//  configurar el registrador

aplicación . use ( morgan ( ' combinado ' , {  flujo :

accessLogStream  } )  )

aplicación . get ( ' / ' , function ( req , res ) {    

  res . enviar ( '¡ hola, mundo! ' )

} )

registro dividido / dual

El morganmiddleware se puede usar tantas veces como sea necesario, permitiendo
combinaciones como:

 Entrada de registro a petición y una a respuesta

 Registre todas las solicitudes en el archivo, pero los errores en la consola
 ... ¡y más!
Aplicación de muestra que registrará todas las solicitudes en un archivo usando el formato
Apache, pero las respuestas de error se registran en la consola:

var  express  = require ( ' express ' ) 

var  fs  = require ( ' fs ' ) 

var  morgan  = require ( ' morgan ' ) 

var  ruta  = require ( ' ruta ' ) 

 

 aplicación  var = express ( ) 

//  registra solo respuestas 4xx y 5xx en la consola

aplicación . use ( morgan ( ' dev ' , { 

  skip : function ( req , res )    { return res . statusCode

< 400 }      

} ) )

//  registra todas las solicitudes a access.log

aplicación . use ( morgan ( ' común ' , { 

  corriente : fs . createWriteStream ( ruta . join (

__dirname , ' access.log ' ) , {  flags : ' a ' } )     

} ) )

aplicación . get ( ' / ' , function ( req , res ) {    

  res . enviar ( '¡ hola, mundo! ' )

} )

usar formatos de token personalizados

Aplicación de muestra que utilizará formatos de token personalizados. Esto agrega un ID a todas
las solicitudes y lo muestra usando el :idtoken.

var  express  = require ( ' express ' ) 

var  morgan  = require ( ' morgan ' ) 

var  uuid  = require ( ' node-uuid ' ) 

Morgan . token ( ' id ' , function getId ( req ) {    

  retorno req . carné de identidad 

} )

 aplicación  var = express ( ) 

aplicación . use ( assignId )

aplicación . use ( morgan ( ' : id: método: url: tiempo de

respuesta ' ) )

aplicación . get ( ' / ' , function ( req , res ) {    

  res . enviar ( '¡ hola, mundo! ' )

} )

function assignId ( req , res , siguiente )     { 

  req . id = uuid . v4 ( )  

  siguiente ( )

26. Cómo la ruta recibe los parámetros, cuál es a función que se utiliza para poder recibir
parámetros.
PARÁMETROS O ARGUMENTOS

Los parámetros o argumentos son una forma de intercambiar información con el método. Pueden
servir para introducir datos para ejecutar el método (entrada) o para obtener o modificar datos
tras su ejecución (salida).

DECLARACIÓN DE PARÁMETROS

Los parámetros se declaran en la cabecera de la declaración de los métodos. Al declararse el

parámetro, se indica el tipo de dato y el identificador correspondiente. Los parámetros o
argumentos de un constructor o de un método pueden ser de cualquier tipo, ya sean tipos
primitivos o referencias de objetos (en este caso debe indicarse el identificador de la clase
correspondiente). Ejemplos de declaraciones de cabeceras de métodos:

// Sin parametros

public double devuelve() {

return ...;

// Un parametro, x de tipo double

public void asigna(double x) {

...

// Dos parametros, a y b de tipo int

public int elMayor(int a, int b) {

...

// Un parametro, v, array real

public static double sumatorio (double [] v) {

...

// Un parámetro de la clase Fecha

public boolean caducado (Fecha fechaLimite) {

...
}

El identificador del parámetro se emplea sólo dentro del método para hacer referencia al
argumento correspondiente y puede coincidir con el de un atributo de la misma clase. En tal caso,
se dice que oculta a la variable miembro. Esta técnica suele emplearse en los constructores para
inicializar una instancia. Por ejemplo en la clase Circulo:

public class Circulo {

int x, y, radio;

public Circulo(int x, int y, int radio) {

...

La clase Circulo tiene tres atributos o variables miembro x, y y radio y un constructor con tres
argumentos con los mismos identificadores que facilitan los valores iniciales a los atributos
respectivamente. Los identificadores de los parámetros ocultan a las variables miembro dentro del
cuerpo del constructor, de forma que x, y y radio dentro del constructor hacen referencia a los
parámetros y no a las variables miembro. Para acceder a las variables miembro, es necesario
emplear la palabra reservada this que referencia a la instancia que está siendo inicializada por el
constructor.
public class Circulo {
int x, y, radio;
public Circulo(int x, int y, int radio) {
this.x = x; // this.x hace referencia al
atributo x
// x hace referencia al parametro x
this.y = y; // this.y hace referencia al
atributo y
// y hace referencia al parametro y
this.radio = radio;
}

Normalmente dentro del cuerpo del método de una clase puede hacerse referencia directa a las
variables miembro de las instancias. Salvo en el caso del ejemplo anterior en el que las variables
miembro están ocultas. Por otro lado, los parámetros de un mismo método no puede compartir el
mismo identificador (no pueden coincidir) con el de una variable local. El siguiente código genera
un error de compilación:
public void asigna(double x) {

// Un parametro, x de tipo double

double x; // Error de compilacion

...

USO ALTERNATIVO DE THIS COMO REFERENCIA AL PARÁMETRO IMPLÍCITO

En la clase CuentaBancaria se implementa un método transferencia que transfiere el saldo de una

cuenta origen (parámetro formal explícito) a otra cuenta (parámetro implícito):

/**
* Declaracion de la clase CuentaBancaria
* Ejemplo de declaracion de variables
* metodos estaticos y uso de this
*/
public class CuentaBancaria {
// Atributos o variables miembro
private double saldo;
public static int totalCuentas=0;
 
// Metodos
public CuentaBancaria() {
this(0.0);
}
 
public CuentaBancaria( double ingreso ) {
saldo = ingreso;
incCuentas();
}
 
public double saldo() {
return saldo;
}
 
public static void incCuentas () {
totalCuentas++;
}
 
// Transfiere todo el dinero de la cuenta origen a la actual
public void transferencia( CuentaBancaria origen ) {
saldo += origen.saldo;
 origen.saldo=0;
}
}
Ejemplo de programa que emplea la clase CuentaBancaria con una llamada al método
transferencia:

/**
* Ejemplo de uso de la clase CuentaBancaria
*/
public class PruebaCuentaBancaria {
public static void main (String [] args) {
System.out.println("Total cuentas: " +
CuentaBancaria.totalCuentas);
CuentaBancaria c1;
c1 = new CuentaBancaria(17.5);
 
System.out.println("Nueva cuenta con: " + c1.saldo() + "
euros");
System.out.println("Total cuentas: " +
CuentaBancaria.totalCuentas);
 
CuentaBancaria c2;
c2 = new CuentaBancaria(20.0);
System.out.println("Nueva cuenta con: " + c2.saldo() + "
euros");
System.out.println("Total cuentas: " +
CuentaBancaria.totalCuentas);
System.out.println("Transferencia de cuenta 2 a cuenta
1");
 
c1.transferencia(c2);
System.out.println("Cuenta 1 con: " + c1.saldo() + "
euros");
System.out.println("Cuenta 2 con: " + c2.saldo() + "
euros");
} }
La ejecución del código anterior origina la siguiente salida por pantalla:
$>java PruebaCuentaBancaria
Total cuentas: 0
Nueva cuenta con: 17.5 euros
Total cuentas: 1
Nueva cuenta con: 20.0 euros
Total cuentas: 2
Transferencia de cuenta 2 a cuenta 1
Cuenta 1 con: 37.5 euros
Cuenta 2 con: 0.0 euros
27. Cuál es la función para poder enviar por el método post los valores que se envían desde un
formulario Handlebars

Lo primero que debes saber para enviar datos de formularios es recuperar la información escrita
en los campos de uno de los formularios de la página. Para ello en Javascript disponemos de los
objetos FormData.

FormData nos permite disponer de un objeto con todos los datos del formulario, con pares clave
valor. Donde la clave es el "name" del campo de formulario y el valor es su propiedad "value".

Recibir todos los datos de un formulario es tan sencillo como ejecutar el constructor FormData,
enviando como parámetro el objeto formulario que queremos usar para recuperar sus datos. Sería
algo como esto:
const data = new
FormData(document.getElementById('formulario'));

Ahora ya podemos usar este objeto para enviar los datos por POST. Esta parte es muy sencilla, ya
que simplemente tenemos que configurar el method como "POST" y pasar los datos en el body de
la solicitud. Lo harías con un código como este:
fetch('../post.php', {
method: 'POST',
body: data
})

El código completo de nuestra llamada Ajax podría ser algo como esto:
const data = new
FormData(document.getElementById('formulario'));
fetch('../post.php', {
method: 'POST',
body: data
})
.then(function(response) {
if(response.ok) {
return response.text()
} else {
throw "Error en la llamada Ajax";
 }

})
.then(function(texto) {
console.log(texto);
})
.catch(function(err) {
console.log(err);
});
Componer los datos del envío POST sin necesidad de un formulario
Podría ocurrirte que necesites enviar datos por POST pero que no dispongas de un formulario en la
página donde el usuario haya escrito esos datos. Es decir, generar desde cero los datos del
formulario, con variables o datos que tengas en Javascript.

Esto es perfectamente posible, aunque es algo más relativo al uso del objeto FormData que a la
propia llamada Ajax con Fetch. Lo conseguimos mediante dos pasos.

Creamos un objeto FormData vacío, simplemente enviando al constructor FormData los paréntesis
vacíos.
Creamos todos los datos arbitrarios con el método append() que recibe el dato que se quiere
agregar al FormData, con su par clave/valor.
El código te quedará como puedes ver a continuación
const data = new FormData();
data.append('empresa', 'DesarrolloWeb.com');
data.append('CIF', 'ESB00001111');
data.append('formacion_profesional', 'EscuelaIT');
fetch('../post.php', {
method: 'POST',
body: data
})
.then(function(response) {
if(response.ok) {
return response.text()
} else {
 throw "Error en la llamada Ajax";
}

})
.then(function(texto) {
console.log(texto);
})
.catch(function(err) {
console.log(err);
});

28. Para que sirve la sentencia console.log cómo funciona:

Muestra un mensaje en la consola web (o del intérprete JavaScript).

Sintaxis:

console.log(obj1 [, obj2, ..., objN]);

console.log(msg [, subst1, ..., substN]);

Parámetros:

obj1 ... objN

Una lista de objetos JavaScript para mostrar. Las representaciones en texto de cada uno de los
objetos se agregan y muestran juntas (al final una tras otra), en el orden listado.
msg
Un texto (mensaje) conteniendo cero o más sustituciones de cadenas (sustituciones de strings).
subst1 ... substN
Objetos JavaScript con la sustitución a reemplazar dentro del texto (msg). Esto brinda control
adicional en el formato de salida del texto.
Vea "Mostrando texto en la consola" en la documentación de console para mas detalles.

29. Definir el proyecto (aplicación web) de aula: breve descripción, módulos, cuales son las
vistas que lleva.

30. Cuál es la direncia y para que sirve el res.render y res.redirect:

res.render (ver [, locales] [, devolución de llamada])

Renderiza viewy envía la cadena HTML renderizada al cliente. Parámetros opcionales:

locals, un objeto cuyas propiedades definen variables locales para la vista.
callback, una función de devolución de llamada. Si se proporciona, el método devuelve tanto el
posible error como la cadena representada, pero no realiza una respuesta automática. Cuando
ocurre un error, el método invoca next(err)internamente.
El viewargumento es una cadena que es la ruta del archivo de vista que se va a representar. Esta
puede ser una ruta absoluta o una ruta relativa a la viewsconfiguración. Si la ruta no contiene una
extensión de archivo, la view engineconfiguración determina la extensión del archivo. Si la ruta
contiene una extensión de archivo, Express cargará el módulo para el motor de plantilla
especificado (via require()) y lo renderizará usando la __expressfunción del módulo cargado .
El viewargumento realiza operaciones del sistema de archivos, como leer un archivo del disco y
evaluar los módulos Node.js, por lo que, por razones de seguridad, no debe contener información
del usuario final.

La variable local cachehabilita el almacenamiento en caché de la vista. Configúrelo truepara

almacenar en caché la vista durante el desarrollo; El almacenamiento en caché de vistas está
habilitado en producción de forma predeterminada.

// send the rendered view to the client

res.render('index')

// if a callback is specified, the rendered HTML string has to be sent

explicitly
res.render('index', function (err, html) {
res.send(html)
})

// pass a local variable to the view

res.render('user', { name: 'Tobi' }, function (err, html) {
// ...
})

res.redirect ([estado,] ruta)

Redirige a la URL derivada del especificado path, con especificado status, un entero positivo que
corresponde a un código de estado HTTP . Si no se especifica, el valor statuspredeterminado es
"302" Encontrado ".
res.redirect('/foo/bar')
res.redirect('http://example.com')
res.redirect(301, 'http://example.com')
res.redirect('../login')

Los redireccionamientos pueden ser una URL totalmente calificada para redireccionar a un sitio
diferente:

res.redirect('http://google.com')

los redireccionamientos pueden ser relativos a la raíz del nombre de host. Por ejemplo, si la
aplicación está encendida http://example.com/admin/post/new, lo siguiente redirigirá a la URL
http://example.com/admin:

res.redirect('/admin')

Los redireccionamientos pueden ser relativos a la URL actual. Por ejemplo, desde
http://example.com/blog/admin/(observe la barra inclinada), lo siguiente redirigirá a la URL
http://example.com/blog/admin/post/new.

res.redirect('post/new')

Redirigir a post/newdesde http://example.com/blog/admin(sin barra inclinada), redirigirá

a http://example.com/blog/post/new.

Si encuentra confuso el comportamiento anterior, piense en los segmentos de ruta como

directorios (con barras inclinadas) y archivos, comenzará a tener sentido.

También son posibles las redirecciones relativas a la ruta. Si estuviera

activado http://example.com/admin/post/new, lo siguiente redirigiría
a http://example.com/admin/post:

res.redirect('..')

Una backredirección redirige la solicitud de nuevo al remitente , de forma

predeterminada /cuando falta el remitente.

res.redirect('back')

31. Para que sirve el require:

RequireJS es una librería JavaScript que nos permite aislar mediante módulos los componentes de
nuestra aplicación cliente y resolver las dependencias de estos mismos.

RequireJS implementa el patron de diseño de software AMD (Asynchronous module definition) lo

cual se podría decir es muy similar al Dependency injection implementado por muchos
frameworks como Symfony.

A continuación algunas de las características de RequireJS:

Carga dinámica de dependencias

Descarga automáticas de dependencias
Manejo de timeouts y carga de fallbacks

Definir punto de entrada para RequireJS.

Debemos bajar la librería de RequireJS disponible en el sitio web http://requirejs.org que
ubicaremos un directorio llamado libs para efectos de este ejemplo (probado con la version
2.1.11).

Ahora definiremos en un archivo html que podría ser index.html la carga de RequireJS como se
muestra a continuación.
1 <!DOCTYPE html>
2 <html>
3 <head>
4 </head>
5 <body>
6   <script data-main="libs/main" src="libs/require.js"></script>
7 </body>
8 </html>

Como se ve la inclusión se realiza con la etiqueta script de HTML dentro del body, pero también
podría hacerse dentro del <head></head>.

Configurar RequireJS.
En nuestro archivo libs/main.js definiremos las opciones, lo primero que debemos hacer definir los
archivos con los cuales vamos a trabajar como se muestra a continuación.
1 require.config({
2     baseUrl: 'libs',
3     paths : {
4       backbone : 'backbone',
5       underscore : 'underscore',
6       jquery : 'jquery',
7       marionette : 'backbone.marionette',
8       wreqr : 'backbone.wreqr',
9       eventbinder : 'backbone.eventbinder',
10       babysitter : 'backbone.babysitter'
11   }
12 });
Todos los archivo se buscaran dentro de directorio definido usando la propiedad baseUrl, y con la
propiedad paths se definirán la ubicación de las librerías y se definirá una llave para referirse a la
librería posteriormente, la extensión .js no es necesaria y será agregada por RequireJS
posteriormente.

Como su nombre lo indica el patron AMD realiza una carga asíncrona de los paquetes. Debido a
que no todas la librerias implementan este patron AMD es probable que una librería A intente a
usar una función de una librería B que aun no este cargada ocasionando un error.

Para resolver este problema utilizaremos la propiedad Shim de la configuración de RequireJS,

como podemos apreciar a continuación.
1 require.config({,
2   shim : {
3     jquery : {
4       exports : 'jQuery'
5     },
6     underscore : {
7       exports : '_'
8     },
9     backbone : {
10       deps : ['jquery', 'underscore'],
11       exports : 'Backbone'
12     },
13     wreqr: {
14       deps : ['backbone']
15     },
16     eventbinder : {
17       deps : ['backbone']
18     },
19     babysitter : {
20       deps: ['backbone']
21     },
22     marionette : {
23       deps: ['wreqr', 'eventbinder', 'babysitter'],
24       exports : 'Marionette'
25     }
26   }
27 });
Como ejecutar código con require.
Una vez definidos las librerías y sus dependencias si es necesario, ahora podemos reescribir el
código que necesitamos como se muestra a continuación.
1 // Loading dependences and execute Marionette App
2 require( ["marionette"], function (Marionette) {
3     // set up the app instance
4     var MyApp = new Marionette.Application();
5  
6     MyApp.on("initialize:after", function(){
7       alert("Application has started!");
8     });
9  
10     MyApp.start();
11 });
Como crear módulos nombrados.
Si deseamos encapsular nuestra App debemos hacer módulos nombrados usando la función
define y se diferencia del require en que recibe un parámetro que se usa para nombrar el modulo
y retorna un objeto o variable que sera utilizada cuando se instancia el modulo. A continuación
veamos el ejemplo de punto anterior como un modulo nombrado.
1 define( 'MyApp', ["marionette"], function (Marionette) {
2  
3     // set up the app instance
4     var MyApp = new Marionette.Application();
5  
6     MyApp.on("initialize:after", function(){
7       alert("Application has started!");
8     });
9  
10     // export the app from this module
11     return MyApp;
12 });
13  
14 // Fetch and execute Marionette App
15 require( ["MyApp"], function (MyApp) {
16     // Execute App
17     MyApp.start();
18 });
Como se ve el define registra el modulo llamado MyApp y retorna un objeto definido en
Marionette, posteriormente con un requiere se carga el modulo, se recibe como parámetros el
objeto que retorna el modulo y podemos de esta forma iniciar nuestra aplicación.

32. Cuales son las sentencia SQL para (consultar, modificar, eliminar, agregar ) un registro a la
base de datos.

Modificar registros

imagen sql
Borrar registros.
Hasta ahora hemos visto cómo crear y consultar registros o filas de las tablas. Veremos ahora
cómo borrarlos o modificarlos. Empezamos por el borrado.
Para eliminar un registro de una tabla utilizaremos la sentencia DELETE:

DELETE FROM nombre_tabla WHERE columna1='valor'

Con "DELETE FROM nombre_tabla" localizamos la tabla en la que queremos borrar un registro, y
con la instrucción "WHERE columna1='valor' " localizamos el o los registros que queremos borrar.

Observa la importancia de la instrucción WHERE, en ella indicamos los registros que queremos
borrar: todos los registros que cumplan con la condición indicada (es decir en cuya columna
indicada esté el valor indicado) serán eliminados.

De no poner la instrucción WHERE se eliminarán todos los registros de la tabla. La tabla seguirá
existiendo, pero será una tabla vacía, sin ningún registro (sólo se mantiene la estructura).
Hay que tener mucho cuidado con la instrucción DELETE, ya que la eliminación de un registro se
hace de forma irreversible. Una vez eliminado ya no se pueden recuperar los datos.

Por ejemplo, tenemos una tabla "agenda" con las columnas "nombre", "telefono" y "email".
Queremos eliminar un registro que tiene en "nombre" el valor 'Juan Ruiz', lo haremos con la
siguiente sentencia:

DELETE FROM agenda WHERE nombre='Juan Ruiz'

Actualizar un registro

Supongamos ahora que en la tabla "agenda" anterior, tenemos un nombre, por ejemplo 'Alberto
Sanchez' que ha cambiado su teléfono y su email. Para cambiar su teléfono y su email en la agenda
podríamos borrar su registro y crear uno nuevo con el nuevo teléfono y email. Sin embargo esto
no resulta práctico, ya que podemos modificar el registro mediante la sentencia UPDATE:
UPDATE agenda
SET telefono='662142223' , email='[email protected]'
WHERE nombre='Alberto Sanchez'
Para cambiar los datos de un registro (actualizarlo) procedemos de la siguiente manera:

Escribimos primero la palabra clave UPDATE seguida del nombre de la tabla

Escribimos después la palabra clave SET, seguida por los datos que queremos cambiar para ello
indicamos la columna en la que los pondremos, seguida del signo igual, y el valor del dato. si hay
más de un dato a cambiar, los separaremos por comas.

Podemos después la instruccion WHERE, que indica cual es la fila o registro en donde se debe
cambiar el dato. La fila o filas que coincidan con la condición indicada son las que cambiarán sus
datos.

De forma general la instrucción UPDATE tendrá la siguiente sintaxis:

UPDATE nombre_tabla
SET col_cambio1='valor1',co2_cambio2='valor2'
WHERE col_ref='valor_ref'
Insertar registros
Básicamente, existen dos métodos para agregar registros a una tabla. El primero consiste en
agregar un registro cada vez, el segundo consiste en agregar varios registros a la vez. En ambos
casos, se usa la instrucción SQL INSERT INTO para llevar a cabo la tarea. Las instrucciones INSERT
INTO se suelen denominar "consultas de datos anexados".
Para agregar un registro a una tabla, debe usar la lista de campos para definir en qué campos se
colocarán los datos y, luego, proporcionar los datos en una lista de valores. Para definir la lista de
valores, use la cláusula VALUES. Por ejemplo, la siguiente instrucción inserta los valores “1”,
“Kelly” y “Jill” en los campos CustomerID, Last Name y First Name, respectivamente.

INSERT INTO tblCustomers (CustomerID, [Last Name], [First Name])

 VALUES (1, 'Kelly', 'Jill')

Puede omitir la lista de campos, pero solo si proporciona todos los valores que puede contener el
registro.
INSERT INTO tblCustomers
VALUES (1, Kelly, 'Jill', '555-1040', '[email protected]')

Correo: LEONARDO JIMENEZ PINZON

[email protected]

3194780042