aboutsummaryrefslogtreecommitdiff
path: root/files/es/learn/server-side/express_nodejs/introduction/index.html
blob: d607c0dd0f031acc086d21a9e62bf36b7c0da5c8 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
---
title: Introducción a Express/Node
slug: Learn/Server-side/Express_Nodejs/Introduction
tags:
  - Aprender
  - Express
  - MDN
  - Node
  - Servidor
  - javascri
  - lado del servidor
  - nodejs
translation_of: Learn/Server-side/Express_Nodejs/Introduction
---
<div>{{LearnSidebar}}</div>

<div>{{NextMenu("Aprendizaje/Lado-Servidor/Express_Nodejs/Ambiente-Desarrollo", "Aprendizaje/Lado-Servidor/Express_Nodejs")}}</div>

<p class="summary">En este primer articulo de Express resolveremos las preguntas "¿Qué es Node?" y "¿Qué es Express?", y te daremos una visión general de que hace especial al framework web "Express". Delinearemos las características principales, y te mostraremos algunos de los principales bloques de construcción de una aplicación en Express (aunque en este punto no tendrás todavía un entorno de desarrollo en que probarlo).</p>

<table class="learn-box standard-table">
 <tbody>
  <tr>
   <th scope="row">Pre-requisitos:</th>
   <td>
    <p>Conocimientos básicos de informática. Noción general sobre <a href="https://developer.mozilla.org/es/docs/Learn/Server-side/Primeros_pasos">programación lado servidor de sitios web</a>, y en particular los mecanismos de las interacciones <a href="/es/docs/Learn/Server-side/Primeros_pasos/Vision_General_Cliente_Servidor">cliente-servidor en sitios web</a>.</p>
   </td>
  </tr>
  <tr>
   <th scope="row">Objetivo:</th>
   <td>
    <p>Ganar familiaridad con lo que es Express y cómo encaja con Node, qué funcionalidad proporciona y los pilares de construcción de una aplicación Express.</p>
   </td>
  </tr>
 </tbody>
</table>

<h2 id="¿Qué_son_Express_y_Node">¿Qué son Express y Node?</h2>

<p><a href="https://nodejs.org/">Node</a> (o más correctamente: <em>Node.js</em>) 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 <a href="/es/docs/Glossary/JavaScript">JavaScript</a>. 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.</p>

<p>Desde una perspectiva de desarrollo de servidor web, Node tiene un gran número de ventajas:</p>

<ul>
 <li>¡Gran rendimiento! <em>Node</em> ha sido diseñado para optimizar el rendimiento y la escalabilidad en aplicaciones web y es un muy buen complemento para muchos problemas comunes de desarrollo web (ej, aplicaciones web en tiempo real).</li>
 <li>El código está escrito en "simple JavaScript", lo que significa que se pierde menos tiempo ocupándose de las "conmutaciones de contexto" entre lenguajes cuando estás escribiendo tanto el código del explorador web como del servidor.</li>
 <li>JavaScript es un lenguaje de programación relativamente nuevo y se beneficia de los avances en diseño de lenguajes cuando se compara con otros lenguajes de servidor web tradicionales (ej, Python, PHP, etc.) Muchos otros lenguajes nuevos y populares se compilan/convierten a JavaScript de manera que puedes también usar CoffeeScript, ClosureScript, Scala, LiveScript, etc.</li>
 <li>El gestor de paquetes de <em>Node</em> (NPM del inglés: Node Packet Manager) proporciona acceso a cientos o miles de paquetes reutilizables. Tiene además la mejor en su clase resolución de dependencias y puede usarse para automatizar la mayor parte de la cadena de herramientas de compilación.</li>
 <li>Es portable, con versiones que funcionan en Microsoft Windows, OS X, Linux, Solaris, FreeBSD, OpenBSD, WebOS, y NonStop OS. Además, está bien soportado por muchos de los proveedores de hospedaje web, que proporcionan infraestructura específica y documentación para hospedaje de sitios <em>Node</em>.</li>
 <li>Tiene un ecosistema y comunidad de desarrolladores de terceros muy activa, con cantidad de gente deseosa de ayudar.</li>
</ul>

<p>Puedes crear de forma sencilla un servidor web básico para responder cualquier petición simplemente usando el paquete HTTP de <em>Node</em>, como se muestra abajo. Este, creará un servidor y escuchará cualquier clase de peticiones en la URL <code>http://127.0.0.1:8000/</code>; cuando se reciba una petición, se responderá enviando en texto la respuesta: "Hola Mundo!".</p>

<pre class="brush: js notranslate">// Se carga el módulo de HTTP
var http = require("http");

// Creación del servidor HTTP, y se define la escucha
// de peticiones en el puerto 8000
http.createServer(function(request, response) {

   // Se define la cabecera HTTP, con el estado HTTP (OK: 200) y el tipo de contenido
   response.writeHead(200, {'Content-Type': 'text/plain'});

   // Se responde, en el cuerpo de la respuesta con el mensaje "Hello World"
   response.end('Hola Mundo!\n');
}).listen(8000);

// Se escribe la URL para el acceso al servidor
console.log('Servidor en la url http://127.0.0.1:8000/');</pre>

<p>Otras tareas comunes de desarrollo web no están directamente soportadas por el mismo <em>Node</em>. Si quieres añadir el manejo específico de diferentes verbos HTTP (ej, <code>GET</code>, <code>POST</code>, <code>DELETE</code>, etc.), gestionar de forma separada las peticiones por medio de diferentes direcciones URL ("rutas"), servir ficheros estáticos o usar plantillas para crear la respuesta de forma dinámica, necesitarás escribir el código por tí mismo, o ¡puedes evitar reinventar la rueda usando un framework web!</p>

<p><a href="https://expressjs.com/">Express</a> es el framework web más popular de <em>Node</em>, y es la librería subyacente para un gran número de otros <a href="https://expressjs.com/en/resources/frameworks.html">frameworks web de Node</a> populares. Proporciona mecanismos para:</p>

<ul>
 <li>Escritura de manejadores de peticiones con diferentes verbos HTTP en diferentes caminos URL (rutas).</li>
 <li>Integración con motores de renderización de "vistas" para generar respuestas mediante la introducción de datos en plantillas.</li>
 <li>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.</li>
 <li>Añadir procesamiento de peticiones "middleware" adicional en cualquier punto dentro de la tubería de manejo de la petición.</li>
</ul>

<p>A pesar de que <em>Express</em> 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 <code>POST</code>, cabeceras de seguridad y <em>muchos</em> más. Puedes encontrar una lista de paquetes middleware mantenida por el equipo de Express en <a href="https://expressjs.com/es/resources/middleware.html">Express Middleware</a> (junto con una lista de algunos de los paquetes más populares de terceros).</p>

<div class="note">
<p><strong>Nota:</strong> esta flexibilidad es una espada de doble filo. Hay paquetes de middleware para abordar casi cualquier problema o requerimiento, pero deducir cuáles son los paquetes adecuados a usar algunas veces puede ser un auténtico reto. Tampoco hay una "forma correcta" de estructurar una aplicación, y muchos ejemplos que puedes encontrar en la Internet no son óptimos, o sólo muestran una pequeña parte de lo que necesitas hacer para desarrollar una aplicación web.</p>
</div>

<h2 id="¿Dónde_comenzó">¿Dónde comenzó?</h2>

<p><em>Node</em> fué lanzado inicialmente, sólo para Linux, en 2009. El gestor de paquetes NPM fué lanzado en 2010, y el soporte nativo para Windows fue añadido en 2012. La versión actual LTS (Long Term Suppport) es Node v12.18.0 mientras que la última versión es Node 14.4.0. Ésto es sólo una pequeña foto de una historia muy rica; profundiza en <a href="https://en.wikipedia.org/wiki/Node.js#History">Wikipedia</a> si quieres saber más).</p>

<p><em>Express</em> fue lanzado inicialmente en Noviembre de 2010 y está ahora en la versión 4.17.1 de la API. Puedes comprobar en el <a href="https://expressjs.com/en/changelog/4x.html">changelog</a> la información sobre cambios en la versión actual, y en <a href="https://github.com/expressjs/express/blob/master/History.md">GitHub</a> notas de lanzamiento históricas más detalladas.</p>

<h2 id="¿Qué_popularidad_tiene_NodeExpress">¿Qué popularidad tiene Node/Express?</h2>

<p>La popularidad de un framework web es importante porque es un indicador de se continuará manteniendo y qué recursos tienen más probabilidad de estar disponibles en términos de documentación, librerías de extensiones y soporte técnico.</p>

<p>No existe una medida disponible de inmediato y definitiva de la popularidad de los frameworks de lado servidor (aunque sitios como <a href="http://hotframeworks.com/">Hot Frameworks</a> intentan asesorar sobre popularidad usando mecanismos como contar para cada plataforma el número de preguntas sobre proyectos en GitHub y StackOverflow). Una pregunta mejor es si Node y Express son lo "suficientemente populares" para evitar los problemas de las plataformas menos populares. ¿Continúan evolucionando? ¿Puedes conseguir la ayuda que necesitas? ¿Hay alguna posibilidad de que consigas un trabajo remunerado si aprendes Express?</p>

<p>De acuerdo con el número de <a href="https://expressjs.com/en/resources/companies-using-express.html">compañías de perfil alto</a> que usan Express, el número de gente que contribuye al código base, y el número de gente que proporciona soporte tanto libre como pagado, podemos entonces decir que sí, !<em>Express</em> es un framework popular!</p>

<h2 id="¿Es_Express_dogmático">¿Es Express dogmático?</h2>

<p>Los frameworks web frecuentemente se refieren a sí mismos como "dogmáticos" ("<em>opinionated</em>") o "no dogmáticos" ("<em>unopinionated</em>").</p>

<p>Los frameworks dogmáticos son aquellos que opinan acerca de la "manera correcta" de gestionar cualquier tarea en particular. Ofrecen soporte para el desarrollo rápido en un <em>dominio en particular</em> (resolver problemas de un tipo en particular) porque la manera correcta de hacer cualquier cosa está generalmente bien comprendida y bien documentada. Sin embargo pueden ser menos flexibles para resolver problemas fuera de su dominio principal, y tienden a ofrecer menos opciones para elegir qué componentes y enfoques pueden usarse.</p>

<p>Los framewoks no dogmáticos, en contraposición, tienen muchas menos restricciones sobre el modo mejor de unir componentes para alcanzar un objetivo, o incluso qué componentes deberían usarse. Hacen más fácil para los desarrolladores usar las herramientas más adecuadas para completar una tarea en particular, si bien al coste de que necesitas encontrar esos componentes por tí mismo.<br>
 <br>
 Express es no dogmático, transigente. Puedes insertar casi cualquier middleware compatible que te guste dentro de la cadena de manejo de la petición, en casi cualquier orden que te apetezca. Puedes estructurar la app en un fichero o múltiples ficheros y usar cualquier estructura de directorios. ¡Algunas veces puedes sentir que tienes demasiadas opciones!</p>

<h2 id="¿Cómo_es_el_código_para_Express">¿Cómo es el código para Express?</h2>

<p>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 <code>POST</code><code>GET</code>. 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.</p>

<p><em>Express</em> posee métodos para especificar que función ha de ser llamada dependiendo del verbo HTTP usado en la petición (<code>GET</code>, <code>POST</code>, <code>SET</code>, 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 <em>Express</em>, 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 <code>POST</code>/<code>GET</code>.  Puede utilizarse además cualquier sistema de trabajo con bases de datos, que sea soportado por <em>Node</em> (<em>Express</em> no especifica ningún método preferido para trabajar con bases de datos). </p>

<p>En las siguientes secciones, se explican algunos puntos comunes que se pueden encontrar cuando se trabaja con código de <em>Node</em> y <em>Express</em>.</p>

<h3 id="Hola_Mundo!_-_en_Express">Hola Mundo! - en Express</h3>

<p>Primero consideremos el tradicional ejemplo de <a href="https://expressjs.com/en/starter/hello-world.html">Hola Mundo!</a> (se comentará cada parte a continuación).</p>

<div class="note">
<p><strong>Consejo:</strong> Si tiene <em>Node</em> y <em>Express</em> instalado (o piensa instalarlos posteriormente) puede guardar este código en un archivo llamado <strong>app.js</strong> y ejecutarlo posteriormente en la linea de comandos invocándolo mediante: <code>node app.js</code></p>
</div>

<pre class="brush: js notranslate">var express = require('express');
var app = express();

<strong>app.get('/', function(req, res) {
  res.send('Hola Mundo!');
});</strong>

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

<p>Las primeras dos líneas incluyen (mediante la orden <code>require()</code>) el módulo de Express y crean una <a href="https://expressjs.com/en/4x/api.html#app">aplicación de Express</a>. Este elemento se denomina comúnmente <code>app</code>, 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 <a href="https://expressjs.com/en/4x/api.html#app.settings.table">configuraciones de las aplicaciones </a> que controlan la aplicación (por ejemplo el entorno, las definiciones para enrutado ... etcetera.)</p>

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

<p>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  <code>localhost:3000</code>  en un navegador, y ver como el servidor de este ejemplo devuelve el mensaje de respuesta.</p>

<h3 id="Importando_y_creando_módulos">Importando y creando módulos</h3>

<p>Un modulo es una librería o archivo JavaScript que puede ser importado dentro de otro código utilizando la función <code>require()</code> de Node.  Por sí mismo, <em>Express</em> es un modulo,  como lo son el middleware y las librerías de bases de datos que se utilizan en las aplicaciones <em>Express.</em></p>

<p>El código mostrado abajo, muestra como puede importarse un modulo con base a su nombre, como ejemplo se utiliza el  framework <em>Express</em> . Primero se invoca la función <code style="font-style: normal; font-weight: normal;">require()</code>, indicando como parámetro el nombre del módulo o librería como una cadena (<code>'express'</code>),  posteriormente se invoca el objeto obtenido para crear una <a href="https://expressjs.com/en/4x/api.html#app">aplicación Express</a>.</p>

<p>Posteriormente, se puede acceder a las propiedades y funciones del objeto Aplicación.</p>

<pre class="brush: js notranslate">var express = require('express');
var app = express();
</pre>

<p>También podemos crear nuestros propios módulos que puedan posteriormente ser importados de la misma manera.</p>

<div class="note">
<p><strong>Consejo:</strong>  Usted puede desear crear sus propios módulos, esto le permitirá organizar su código en partes más administrables; una aplicación que reside en un solo archivo es difícil de entender y manejar.</p>

<p>El utilizar módulos independientes también le permite administrar el espacio de nombres, de esta manera unicamente las variables que exporte explícitamente son importadas cuando utilice un módulo.</p>
</div>

<p>Para hacer que los objetos esten disponibles fuera de un modulo, solamente es necesario asignarlos al objeto <code>exports</code>. Por ejemplo, el modulo mostrado a continuación <strong>square.js</strong>  es un archivo que exporta los métodos <code>area()</code> y <code>perimeter()</code> :</p>

<pre class="brush: js notranslate"><strong>exports</strong>.area = function(width) { return width * width; };
<strong>exports</strong>.perimeter = function(width) { return 4 * width; };
</pre>

<p>Nosotros podemos importar este módulo utilizando la función <code>require()</code>, y entonces podremos invocar los métodos exportados de la siguiente manera:</p>

<pre class="brush: js notranslate">// Utilizamos la función<strong> require()</strong> El nombre del archivo se ingresa sin la extensión (opcional) .js
var square = require('./square');
// invocamos el metodo <strong>area()</strong>
console.log('El área de un cuadrado con lado de 4 es ' + square.area(4));</pre>

<div class="note">
<p><strong>Nota:</strong> Usted también puede especificar una ruta absoluta a la  ubicación del módulo  (o un nombre como se realizó inicialmente). </p>
</div>

<p>Si usted desea exportar completamente un objeto en una asignación en lugar de construir cada propiedad por separado, debe asignarlo al módulo <code>module.exports</code> como se muestra a continuación (también puede hacer esto al inicio de un constructor o de otra función.)</p>

<pre class="brush: js notranslate">module.exports = {
  area: function(width) {
    return width * width;
  },

  perimeter: function(width) {
    return 4 * width;
  }
};
</pre>

<p>Para más información acerca de módulos vea <a href="https://nodejs.org/api/modules.html#modules_modules">Modulos</a> (<em>Node</em> API docs).</p>

<h3 id="Usando_APIs_asíncronas">Usando APIs asíncronas</h3>

<p>El código JavaScript usa frecuentemente APIs asíncronas antes que sincrónicas para operaciones que tomen algún tiempo en completarse. En una API sincrónica cada operación debe completarse antes de que la siguiente pueda comenzar. Por ejemplo, la siguiente función de registro es síncrona, y escribirá en orden el texto en la consola (Primero, Segundo).</p>

<pre class="brush: js notranslate">console.log('Primero');
console.log('Segundo');
</pre>

<p>En contraste, en una API asincrónica, la API comenzará una operación e inmediatamente retornará (antes de que la operación se complete). Una vez que la operación finalice, la API usará algún mecanismo para realizar operaciones adicionales. Por ejemplo, el código de abajo imprimirá "Segundo, Primero" porque aunque el método <code>setTimeout()</code> es llamado primero y retorna inmediatamente, la operación no se completa por varios segundos.</p>

<pre class="brush: js notranslate">setTimeout(function() {
   console.log('Primero');
   }, 3000);
console.log('Segundo');
</pre>

<p>Usar APIs asíncronas sin bloques es aun mas importante en <em>Node</em> que en el navegador, porque <em>Node</em> es un entorno de ejecución controlado por eventos de un solo hilo. "Un solo hilo" quiere decir que todas las peticiones al servidor son ejecutadas en el mismo hilo ( en vez de dividirse en procesos separados). Este modelo es extremadamente eficiente en términos de velocidad y recursos del servidor, pero eso significa que si alguna de sus funciones llama a métodos sincrónicos que tomen demasiado tiempo en completarse, bloquearan no solo la solicitud actual, sino también cualquier otra petición que este siendo manejada por tu aplicación web.</p>

<p>Hay muchas maneras para una API asincrónica de notificar a su aplicación que se ha completado. La manera mas común es registrar una función callback cuando usted invoca a una API asincrónica, la misma será llamada de vuelta cuando la operación se complete. Éste es el enfoque utilizado anteriormente.</p>

<div class="note">
<p><strong>Tip:</strong> Usar "callbacks" puede ser un poco enmarañado si usted tiene una secuencia de operaciones asíncronas dependientes que deben ser llevadas a cabo en orden, porque esto resulta en múltiples niveles de "callbacks" anidadas. Este problema es comúnmente conocido como "callback hell" (callback del infierno). Este problema puede ser reducido con buenas practicas de código (vea <a href="http://callbackhell.com/">http://callbackhell.com/</a>), usando un modulo como <a href="https://www.npmjs.com/package/async">async</a>, o incluso avanzando a características de ES6 como las <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise">promesas</a>.</p>
</div>

<div class="note">
<p><strong>Nota:</strong> Una convención común para <em>Node</em> y <em>Express</em> es usar callbacks de error primero. En esta convención el primer valor en su función callback es un error, mientras que los argumentos subsecuentes contienen datos correctos. Hay una buena explicación de porque este enfoque es útil en este blog: <a href="http://fredkschott.com/post/2014/03/understanding-error-first-callbacks-in-node-js">The Node.js Way - Understanding Error-First Callbacks</a> (fredkschott.com).</p>
</div>

<h3 id="Creando_manejadores_de_rutas">Creando manejadores de rutas</h3>

<p>En nuestro ejemplo anterior de "Hola Mundo!" en <em>Express</em> (véase mas arriba), definimos una función (callback) manejadora de ruta para peticiones HTTP <code>GET</code> a la raíz del sitio (<code>'/'</code>).</p>

<pre class="brush: js notranslate">app.<strong>get</strong>('/', function(req, res) {
  res.send('Hello World!');
});
</pre>

<p>La función callback toma una petición y una respuesta como argumentos. En este caso el método simplemente llama a <code><a href="https://expressjs.com/en/4x/api.html#res.send">send()</a></code> en la respuesta para retornar la cadena "Hello World!". Hay un <a href="https://expressjs.com/en/guide/routing.html#response-methods">número de otros métodos de respuesta</a> para finalizar el ciclo de solicitud/respuesta, por ejemplo podrá llamar a <code><a href="https://expressjs.com/en/4x/api.html#res.json">res.json()</a></code> para enviar una respuesta JSON o <code><a href="https://expressjs.com/en/4x/api.html#res.sendFile">res.sendFile()</a></code> para enviar un archivo.</p>

<div class="note">
<p><strong>JavaScript tip:</strong> Usted puede utilizar cualquier nombre que quiera para los argumentos en las funciones callback; cuando la callback es invocada el primer argumento siempre sera la petición y el segundo siempre sera la respuesta. Tiene sentido nombrarlos de manera que pueda identificar el objeto con el que esta trabajando en el cuerpo de la callback.</p>
</div>

<p>El objeto que representa una aplicación de <em>Express</em>, también posee métodos para definir los manejadores de rutas para el resto de los verbos HTTP: <code>post()</code>, <code>put()</code>, <code>delete()</code>, <code>options()</code>, <code>trace()</code>, <code>copy()</code>, <code>lock()</code>, <code>mkcol()</code>, <code>move()</code>, <code>purge()</code>, <code>propfind()</code>, <code>proppatch()</code>, <code>unlock()</code>, <code>report()</code>, <code>mkactivity()</code>, <code>checkout()</code>, <code>merge()</code>, <code>m-</code><code>search</code><code>()</code>, <code>notify()</code>, <code>subscribe()</code>, <code>unsubscribe()</code>, <code>patch()</code>, <code>search()</code>, y <code>connect()</code>.</p>

<p>Hay un método general para definir las rutas:  <code>app.all()</code>, el cual será llamado en respuesta a cualquier método HTTP. Se usa para cargar funciones del middleware en una dirección particular para todos los métodos de peticiones. El siguiente ejemplo (de la documentación de <em>Express</em>) muestra el uso de los manejadores a  <code>/secret</code>  sin tener en cuenta el verbo HTTP utilizado (siempre que esté definido por el <a href="https://nodejs.org/api/http.html#http_http_methods">módulo http</a>).</p>

<pre class="brush: js notranslate">app.all('/secret', function(req, res, next) {
  console.log('Accediendo a la seccion secreta ...');
  next(); // pasa el control al siguiente manejador
});</pre>

<p>Las rutas le permiten igualar patrones particulares de caracteres en la URL, y extraer algunos valores de ella y pasarlos como parámetros al manejador de rutas (como atributo del objeto petición pasado como parámetro).</p>

<p>Usualmente es útil agrupar manejadores de rutas para una parte del sitio juntos y accederlos usando un prefijo de ruta en común. (Ej: un sitio con una Wiki podría tener todas las rutas relacionadas a dicha sección en un archivo y siendo accedidas con el prefijo de ruta /wiki/. En <em>Express</em> esto se logra usando el objeto <code><a href="http://expressjs.com/en/guide/routing.html#express-router">express.Router</a></code>. Ej: podemos crear nuestra ruta wiki en un módulo llamado wiki.js, y entonces exportar el objeto <code>Router</code>, como se muestra debajo:</p>

<pre class="brush: js notranslate">// wiki.js - Modulo de rutas Wiki

var express = require('express');
var router = express.Router();

// Home page route
router.get('/', function(req, res) {
  res.send('Página de inicio Wiki');
});

// About page route
router.get('/about', function(req, res) {
  res.send('Acerca de esta wiki');
});

module.exports = router;
</pre>

<div class="note">
<p><strong>Nota:</strong> Agregar rutas al objeto <code>Router</code> es como agregar rutas al objeto <code>app</code> ( como se vio anteriormente).</p>
</div>

<p>Para usar el router en nuestro archivo app principal, necesitamos <code>require()</code> el módulo de rutas (<strong>wiki.js</strong>), entonces llame <code>use()</code> en la aplicación <em>Express</em> para agregar el Router al software intermediario que maneja las rutas. Las dos rutas serán accesibles entonces desde <code style="font-style: normal; font-weight: normal;">/wiki/</code> y <code style="font-style: normal; font-weight: normal;">/wiki/about/</code>.</p>

<pre class="brush: js notranslate">var wiki = require('./wiki.js');
// ...
app.use('/wiki', wiki);</pre>

<p>Le mostraremos mucho más sobre como trabajar con rutas, y en particular, acerca de como usar el <code>Router</code>, más adelante en la sección<a href="https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/routes"> Rutas y controladores .</a></p>

<h3 id="Usando_middleware">Usando middleware</h3>

<p>El "middleware" es ampliamente utilizado en las aplicaciones de <em>Express:</em> desde tareas para servir archivos estáticos, a la gestión de errores o la compresión de las respuestas HTTP. Mientras las funciones de enrutamiento, con el objeto <a href="http://expressjs.com/en/guide/routing.html#express-router" rel="noopener">express.Router</a>, se encargan del ciclo petición-respuesta, al gestionar la respuesta adecuada al cliente, las funciones de middleware normalmente realizan alguna operación al gestionar una petición o respuesta y a continuación llaman a la siguiente función en la "pila", que puede ser otra función de middleware  u otra función de enrutamiento. El orden en el que las funciones de middleware son llamadas depende del desarrollador de la aplicación.</p>

<div class="note">
<p><strong>Nota:</strong> El middleware puede realizar cualquier operación: hacer cambios a una petición, ejecutar código, realizar cambios a la petición o al objeto pedido, puede también finalizar el ciclo de petición-respuesta. Si no finaliza el ciclo debe llamar a la función <code>next()</code> para pasar el control de la ejecución a la siguiente función del middleware ( o a la petición quedaría esperando una respuesta ... ). </p>
</div>

<p>La mayoría de las aplicaciones usan middleware desarrollado por terceras partes, para simplificar funciones habituales en el desarrollo web, como puede ser: gestión de cookies, sesiones, autentificado de usuarios, peticiones <code>POST</code>  y datos en JSON, registros de eventos, etc. Puede encontrar en el siguiente enlace una  <a href="http://expressjs.com/en/resources/middleware.html">lista de middleware mantenido por el equipo de <em>Express</em></a> (que también incluye otros paquetes populares de terceras partes). Las librerías de <em>Express</em> están disponibles con la aplicación NPM (Node Package Manager).</p>

<p>Para usar estas colecciones, primero ha de instalar la aplicación usando NPM. Por ejemplo para instalar el registro de peticiones HTTP <a href="http://expressjs.com/en/resources/middleware/morgan.html">morgan</a>, se haría con el comando Bash:  </p>

<pre class="brush: bash notranslate"><code>$ npm install morgan
</code></pre>

<p>Entonces podría llamar a la función <code>use()</code> en un objeto de aplicación <em>Express</em> para utilizar este middleware a su aplicación. </p>

<pre class="brush: js notranslate">var express = require('express');
<strong>var logger = require('morgan');</strong>
var app = express();
<strong>app.use(logger('dev'));</strong>
...</pre>

<div class="note">
<p><strong>Note:</strong> Las funciones Middleware y routing son llamadas en el orden que son declaradas. Para algunos middleware el orden es importante (por ejemplo si el middleware de sesion depende del middleware de cookie, entonces el manejador de cookie tiene que ser llamado antes). Casi siempre es el caso que el middleware es llamado antes de configurar las rutas, o tu manejador de rutas no tendra acceso a la funcionalidad agregada por tu middleware.</p>
</div>

<p>Tu puedes escribir tu propia funcion middleware, y si quieres hacerlo así (solo para crear código de manejo de error). La única diferencia entre una función middleware y un callback manejador de rutas es que las funciones middleware tienen un tercer argumento <code>next</code>, cuyas funciones  middleware son esperadas para llamarlas si ellas no completan el ciclo request (cuando la función midleware es llamada, esta contiene la próxima función que debe ser llamada).</p>

<p>Puede agregar una función middleware a la cadenan de procesamiento con cualquier <code>app.use()</code><code>app.add()</code>, dependiendo de si quiere aplicar el middleware a todas las respuestas o a respuestas con un verbo particular HTTP (<code>GET</code>, <code>POST</code>, etc). Usted especifica rutas, lo mismo en ambos casos, aunque la ruta es opcional cuando llama <strong>app.use()</strong>.</p>

<p>El ejemplo de abajo muestra como puede agregar la función middleware usando ambos métodos, y con/sin una ruta.</p>

<pre class="brush: js notranslate">var express = require('express');
var app = express();

// An example middleware function
var a_middleware_function = function(req, res, <em>next</em>) {
  // ... perform some operations
  next(); // Call next() so Express will call the next middleware function in the chain.
}

// Function added with use() for all routes and verbs
app.use(a_middleware_function);

// Function added with use() for a specific route
app.use('/someroute', a_middleware_function);

// A middleware function added for a specific HTTP verb and route
app.get('/', a_middleware_function);

app.listen(3000);</pre>

<div class="note">
<p><strong>JavaScript Tip:</strong> Arriba declaramos la función middleware separadamente y la configuramos como el callback. En nuestra función previous manejadora de ruta declaramos la función callback cuando esta fué usada. En JavaScript, cuealquer aproximación es valida.</p>
</div>

<p>La documentación Express tiene mucha mas documentación excelente acerca del uso y escritura de middleware Express.</p>

<h3 id="Sirviendo_archivos_estáticos">Sirviendo archivos estáticos</h3>

<p>Puede utilizar el middleware <a href="http://expressjs.com/en/4x/api.html#express.static">express.static</a> para servir archivos estáticos, incluyendo sus imagenes, CSS y JavaScript (<code>static()</code> es la única función  middleware que es actualmente <strong>parte</strong> de <em>Express</em>). Por ejemplo, podria utilizar la linea de abajo para servir imágenes, archivos CSS, y archivos JavaScript desde un directorio nombrado '<strong>public'</strong> al mismo nivel desde donde llama a node:</p>

<pre class="brush: js notranslate">app.use(express.static('public'));
</pre>

<p>Cualesquiere archivos en el directorio público son servidos al agregar su nombre de archivo (<em>relativo</em> a la ubicación del directorio "público" ) de la ubicación URL. Por ejemplo:</p>

<pre class="notranslate"><code>http://localhost:3000/images/dog.jpg
http://localhost:3000/css/style.css
http://localhost:3000/js/app.js
http://localhost:3000/about.html
</code></pre>

<p>Puede llamar <code>static()</code> multiples ocasiones a servir multiples directorios. Si un archivo no puede ser encontrado por una función middleware entonces este simplemente será pasado en la subsequente middleware (el orden en que el middleware está basado en  su orden de declaración).</p>

<pre class="brush: js notranslate">app.use(express.static('public'));
app.use(express.static('media'));
</pre>

<p>Tambien puede crear un prefijo virtual para sus URLs estáticas, aun más teniendo los archivos agregados en la ubicación URL. Por ejemplo, aqui especificamos <a href="http://expressjs.com/en/4x/api.html#app.use">a mount path</a> tal que los archivos son bajados con el prefijo "/media":</p>

<pre class="brush: js notranslate">app.use('/media', express.static('public'));
</pre>

<p>Ahora, puede bajar los archivos que estan en el directorio <code>publico</code> del path con prefijo <code>/media</code>.</p>

<pre class="notranslate"><code>http://localhost:3000/media/images/dog.jpg
http://localhost:3000/media/video/cat.mp4
http://localhost:3000/media/cry.mp3</code>
</pre>

<p>Para más información, ver <a href="Serving static files in Express">Sirviendo archivos estáticos en Express</a>.</p>

<h3 id="Manejando_errores">Manejando errores</h3>

<p>Los errores majejados por una o más funciones especiales middleware que tienen cuatro argumentos, en lugar de las usuales tres: <code>(err, req, res, next)</code>. For example:</p>

<pre class="brush: js notranslate">app.use(function(err, req, res, next) {
  console.error(err.stack);
  res.status(500).send('Something broke!');
});
</pre>

<p>Estas pueden devolver cualquier contenido, pero deben ser llamadas despues de todas las otras <code>app.use()</code> llamadas de rutas tal que ellas son las últimas middleware en el proceso de manejo de request!</p>

<p>Express viene con un manejador de error integrado, el que se ocupa de error remanente que pudiera ser encontrado en la app. Esta función middleware manejador de error esta agregada al final del stack de funciones middleware. Si pasa un error a <code>next()</code> y no lo maneja en un manejador de error, este sera manejado por el manejador de error integrado; el error sera escrito en el cliente con el rastreo de pila.</p>

<div class="note">
<p><strong>Note:</strong> El rastreo de pila no esta incluido en el ambiente de producción. Para ejecutarlo en modo de producción necesita configurar la variable de ambiente <code>NODE_ENV</code> to '<code>production'</code>.</p>
</div>

<div class="note">
<p><strong>Note:</strong> HTTP404 y otros codigos de estatus de "error" no son tratados como errores. Si quiere manejar estos, puede agregar una función middleware para hacerlo. Para mas información vea las <a href="http://expressjs.com/en/starter/faq.html#how-do-i-handle-404-responses">FAQ</a>.</p>
</div>

<p>Para mayor información vea Manejo de error (Docs. Express).</p>

<h3 id="Usando_Bases_de_datos">Usando Bases de datos</h3>

<p>Las apps de <em>Express</em> pueden usar cualquier mecanismo de bases de datos suportadas por <em>Node</em> (<em>Express</em> en sí mismo no define ningúna conducta/requerimiento specifico adicional para administración de bases de datos). Hay muchas opciones, incluyendo PostgreSQL, MySQL, Redis, SQLite, MongoDB, etc.</p>

<p>Con el propósito de usar éste, debe primero instalar el manejador de bases de datos utilizando NPM. Por ejemplo, para instalar el manejador para el popular NoSQL MongoDB querría utilizar el comando:</p>

<pre class="brush: bash notranslate"><code>$ npm install mongodb
</code></pre>

<p>La base de datos por si misma puede ser instalada localmente o en un servidor de la nube. En su codigo Express requiere el manejador, conectarse a la base de datos, y entonces ejecutar operaciones crear, leer, actualizar, y borrar (CLAB). }El ejemplo de abajo (de la documentación Express documentation) muestra como puede encontrar registros en la colección "mamiferos" usando MongoDB.</p>

<pre class="brush: js notranslate">var MongoClient = require('mongodb').MongoClient;

MongoClient.connect('mongodb://localhost:27017/animals', function(err, db) {
  if (err) throw err;

  db.collection('mammals').find().toArray(function (err, result) {
    if (err) throw err;

    console.log(result);
  });
});</pre>

<p>Otra aproximación popular es acceder a su base de datos indirectamente, via an Mapeo Objeto Relacional ("MOR"). En esta aproximación usted define sus datos como "objetos" o "modelos" y el MOR mapea estos a través del deliniamiento basico de la base de datos. Esta aproximación tiene el beneficio de que como un desrrollador puede continuar pensando en términos de objetos de JavaScript mas que en semántica de bases de datos, y en esto hay un lugar obvio para ejecutar la validación y chequeo de entrada de datos. Hablaremos más de bases de datos en un artículo posterior.</p>

<p>Para más información ver <a href="https://expressjs.com/en/guide/database-integration.html">Integracion de Bases de Datos</a> (docs Express ).</p>

<h3 id="Renderización_de_data_vistas">Renderización de data (vistas)</h3>

<p>El Motor de plantilla (referido como "motor de vistas" por <em>Express</em>) le permite definir la estructura de documento de salida en una plantilla, usando marcadores de posición para datos que seran llenados cuando una pagina es generada. Las plantillas son utilizadas generalmete para crear HTML, pero tambien pueden crear otros tipos de documentos. Express tiene soporte para  <a href="https://github.com/expressjs/express/wiki#template-engines">numerosos motores de plantillas</a>, y hay una util comparación de los motores más populares aquí: <a href="https://strongloop.com/strongblog/compare-javascript-templates-jade-mustache-dust/">Comparando Motores de Plantillas de JavaScript: Jade, Mustache, Dust and More</a>.</p>

<p>En su código de configuración de su aplicación usted configura el motor de plantillas para usar y su localización Express podiría buscar plantillas usando las configuraciones de 'vistas' y 'motores de vistas', mostrado abajo (tendría también que instalar el paquete conteniendo su librería de plantillas!)</p>

<pre class="brush: js notranslate">var express = require('express');
var app = express();

// Set directory to contain the templates ('views')
app.set('views', path.join(__dirname, 'views'));

// Set view engine to use, in this case 'some_template_engine_name'
app.set('view engine', 'some_template_engine_name');
</pre>

<p>La apariencia de la plantilla dependera de qué motor use. Asumiendo que tiene un archivo de plantillas nombrado "index.&lt;template_extension&gt;" este contiene placeholders para variables de datos nombradas 'title' y "message", podría llamar <code><a href="http://expressjs.com/en/4x/api.html#res.render">Response.render()</a></code> en una función manejadora de rutas para crear y enviar la HTML response:</p>

<pre class="brush: js notranslate">app.get('/', function(req, res) {
  res.render('index', { title: 'About dogs', message: 'Dogs rock!' });
});</pre>

<p>Para más información vea <a href="http://expressjs.com/en/guide/using-template-engines.html">Usando motores de plantillas con Express</a> (docs Express ).</p>

<h3 id="Estructura_de_Archivos">Estructura de Archivos</h3>

<p>Express no hace asunciones en términos de estructura o que componentes usted usa. Rutas, vistas, archivos estáticos, y otras lógicas de aplicación específica puede vivir en cualquier número de archivos con cualquier estructura de directorio. Mientras que esto es perfectamente posible, se puede tener toda la aplicación en un solo archivo, en <em>Express</em>, tipicamente esto tiene sentido al desplegar su aplicacion dentro de archivos basados en función (e.g. administracion de cuentas, blogs, tableros de discusion) y dominio de problema arquitectonico (e.g. modelo, vista or controlador si tu pasas a estar usando una <a href="/en-US/docs/Web/Apps/Fundamentals/Modern_web_app_architecture/MVC_architecture">arquitectura MVC</a>).</p>

<p>En un tópico posterior usaremos el Generador de Aplicaciones <em>Express Application Generator</em>, el que crea un esquelo de una app modular que podemos facilmente extender para crear aplicaciones web.</p>

<ul>
</ul>

<h2 id="Resumen">Resumen</h2>

<p><span class="tlid-translation translation" lang="es"><span title="">¡Felicitaciones, ha completado el primer paso en su viaje Express/Node!</span> <span title="">Ahora debes comprender los principales beneficios de Express y Node, y más o menos cómo se verían las partes principales de una aplicación Express (rutas, middleware, manejo de errores y plantillas).</span> <span title="">¡También debe comprender que con Express como un </span></span> framework unopinionated<span class="tlid-translation translation" lang="es"><span title="">, la forma en que une estas partes y las bibliotecas que usa dependen en gran medida de usted!</span><br>
 <br>
 <span title="">Por supuesto, Express es deliberadamente un un </span></span> framework <span class="tlid-translation translation" lang="es"><span title="">de aplicaciones web muy ligero, por lo que gran parte de sus beneficios y potencial proviene de bibliotecas y características de terceros.</span> <span title="">Lo veremos con más detalle en los siguientes artículos.</span> <span title="">En nuestro próximo artículo, veremos cómo configurar un entorno de desarrollo de Node, para que pueda comenzar a ver código de Express en acción.</span></span></p>

<h2 id="Ver_también">Ver también</h2>

<ul>
 <li><a href="https://nodejs.org/api/modules.html#modules_modules">Modules</a> (Node API docs)</li>
 <li><a href="https://expressjs.com/">Express</a> (home page)</li>
 <li><a href="http://expressjs.com/en/starter/basic-routing.html">Basic routing</a> (Express docs)</li>
 <li><a href="http://expressjs.com/en/guide/routing.html">Routing guide</a> (Express docs)</li>
 <li><a href="http://expressjs.com/en/guide/using-template-engines.html">Using template engines with Express</a> (Express docs)</li>
 <li><a href="https://expressjs.com/en/guide/using-middleware.html">Using middleware</a> (Express docs)</li>
 <li><a href="http://expressjs.com/en/guide/writing-middleware.html">Writing middleware for use in Express apps</a> (Express docs)</li>
 <li><a href="https://expressjs.com/en/guide/database-integration.html">Database integration</a> (Express docs)</li>
 <li><a href="Serving static files in Express">Serving static files in Express</a> (Express docs)</li>
 <li><a href="http://expressjs.com/en/guide/error-handling.html">Error handling</a> (Express docs)</li>
</ul>

<div>{{NextMenu("Learn/Server-side/Express_Nodejs/development_environment", "Learn/Server-side/Express_Nodejs")}}</div>

<h2 id="En_este_modulo">En este modulo</h2>

<ul>
 <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/Introduction">Express/Node introduction</a></li>
 <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/development_environment">Setting up a Node (Express) development environment</a></li>
 <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/Tutorial_local_library_website">Express Tutorial: The Local Library website</a></li>
 <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/skeleton_website">Express Tutorial Part 2: Creating a skeleton website</a></li>
 <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/mongoose">Express Tutorial Part 3: Using a Database (with Mongoose)</a></li>
 <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/routes">Express Tutorial Part 4: Routes and controllers</a></li>
 <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/Displaying_data">Express Tutorial Part 5: Displaying library data</a></li>
 <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/forms">Express Tutorial Part 6: Working with forms</a></li>
 <li><a href="/en-US/docs/Learn/Server-side/Express_Nodejs/deployment">Express Tutorial Part 7: Deploying to production</a></li>
</ul>