MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-Learn-Section-Survey

Traducción en curso

Ahora que usted conoce para que es Express, nosotros te mostraremos como preparar y testear un entorno de desarrollo Node/Express, en Windows, Linux (Ubuntu), y macOS. Cual sea el sistema operativo común que esté usando, este artículo debería darle lo que usted necesita para poder empezar a desarrollar apps en Express.

Prerequisitos: Saber como abrir una terminal / linea de comando. Saber como instalar paquetes de software en su sistema operativo de su computadora de desarrollo.
Objectivo: Configurar un ambiente de desarrollo para Express (X.XX) en su computadora.

Express ambiente de desarrollo reseña

NodeExpress hacen muy fácil configurar su computadora con el propósito de iniciar el desarrollo de aplicaciones web. Esta seccion provee una reseña de qué herramientas son necesarias, explica algunos de los métodos más simples para instalar Node (y Express) en Ubuntu, macOS, y Windows, y muestra como puede probar su instalación.

Qué es el ambiente de desarrollo Express?

El ambiente de desarrollo Express incluye una instalación de Nodejs, el NPM administrador de paquetes, y (opcionalmente) el Generador de Aplicaciones de Express en su computadora local.

Node y el NPM administrador de paquetes son instalados juntos desde paquetes binarios, instaladores, administradores de paquetes del sistema operativo o desde los fuentes (como se muestra en las siguientes secciónes). Express es entonces instalado por NPM como una dependencia individual de sus aplicasiones web Express (conjuntamente con otras librerías como motores de plantillas, controladores de bases de datos, middleware de autenticación, middleware para servir archivos estáticos, etc.)

NPM puede ser usado también para (globalmente) instalar el Generador de Aplicaciones de Express, una herramienta manual para crear la estructura de las web apps de Express que siguen el  patrón MVC . El generador de aplicaciones es opcional porque no necesita utilizar esta herramienta para  crear apps que usan Express, o construir apps Express que tienen el mismo diseño arquitectónico o dependencias. No obstante estaremos usandolo, porque hace mucho mas fácil, y promueve una estrucura modular de aplicación.

Nota: A diferencia de otros frameworks web , el ambiente de desarrollo no incluye un servidor web independiente. Una aplicación web Node/Express  crea y ejecuta su propio servidor web!

Hay otras herramientas periféricas que son parte de un ambiente de desarrollo típico, incluyendo editores de texto o IDEs para edición de código, y herramientas de administración de control de fuentes como Git para administrar con seguridad diferentes versiones de su codigo. Asumimos que usted ya tiene instaladas esta clase de herramientas (en particular un editor de texto).

Qué sistemas operativos son soportados?

Node puede ser ejecutado en Windows, macOS, varias "versiones" de Linux, Docker, etc. (hay una lista completa de paginas de Downloads de nodejs). Casi cualquier computadora personal podría tener el desempeño necesario para ejecutar Node durante el desarrollo. Express es ejecutado en un ambiente Node, y por lo tanto puede ejecutarse en cualquier plataforma que ejecute Node.

En este articulo proveemos instruciones para configurarlo para Windows, macOS, and Ubuntu Linux.

Qué versión de Node/Express podría usar?

Hay varios lanzamientos de Node — newer lanzamientos recientes contienen reparacion de bugs, soporte para versiones mas recientes de ECMAScript (JavaScript) estandares, y mejoras a las APIs de Node . 

Generalmente debería usar el lanzamiento más reciente SLP (soporte de largo-plazo), un lanzamiento como éste sería más estable que el lanzamiento "actual" mientras que sigue teniendo características relativamente recientes  (y continua siendo activamente actualizado). Debería utilizar el lanzamiento Actual si necesita una característica que no esta presente en la versión SLP.

Para Express debería utilizar siempre la versión más reciente.

Qué pasa con las bases de datos y otras dependencias?

Otras dependencias, tales como los controladores de bases de datos, motores de plantillas, motores de autenticación, etc. son parte de la aplicación, y son importadas dentro del ambiente de la aplicación utilizando el administrador de paquetes NPM. Estos los discutiremos en artículos posteriores app-specific.

Instalando Node

Con el propósito de utilizar Express primero tendrá que instalar Nodejs y el Administrador de Paquetes de Node (NPM) en su sistema operativo. Las siguientes secciones explican la forma más fácil de instalar la versión Soporte de Largo-Plazo (SLP) de Nodejs en Ubuntu Linux 16.04, macOS, y Windows 10.

Tip: Las secciones de abajo muestran la forma más facil de instalar Node y NPM en nuestras plataformas de sistemas operativo a elegir. Si esta utilizando otro SO o solo quiere ver alguna de otros enfoques para las plataformas actuales entonce vea Instalando Node.js via administrador de paquetes (nodejs.org).

Windows and macOS

Instalar Node y NPM en Windows y macOS es directo porque puede solo utilizar el instalador provisto:

  1. Descargue el instalador requerido:
    1. Vaya a https://nodejs.org/en/
    2. Seleccione el boton para descargar la versión SLP que es "Recomendada la mayoría de los usuarios".
  2. Instale Node al dar doble-click en el archivo de descarga y en seguida la  instalación inicia.

Ubuntu 16.04

La forma más fácil de instalar la versión SLP de Node 6.x es la usar el administrador de paquetes al obtenerlo de el repositorio de distribuciones binarias de Ubuntu. Esto puede ser hecho muy simple al ejecutar los siguientes dos comandos en su terminal:

curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash -
sudo apt-get install -y nodejs

Advertencia: No instale directamente desde los repositorios normales de Ubuntu porque pueden contener versions muy antiguas de Node.

Probando su instalación de  Nodejs y NPM

La forma más fácil de probar que Node está instalado es ejecutar el comando "version" en su prompt de terminal/command y checar que una cadena de versión es devuelta:

>node -v
v8.11.3

The administrador de paquetes NPM  de Nodejs también podría haber sido instalado, y puede ser probado en la misma forma:

>npm -v
5.8.0

Como una pruega un poco más emocionante creemos un muy básico "básico servidor node" que simplemente imprima "Hola Mundo" en el browser cuando visite la URL correcta en él:

  1. Copiie el siguiente texto en un archivo llamado holanode.js. Este utiliza características básicas de Node (nada desde Express) y algo de sintáxis ES6:
    //Load HTTP module
    const http = require("http");
    const hostname = '127.0.0.1';
    const port = 3000;
    
    //Create HTTP server and listen on port 3000 for requests
    const server = http.createServer((req, res) => {
    
      //Set the response HTTP header with HTTP status and Content type
      res.statusCode = 200;
      res.setHeader('Content-Type', 'text/plain');
      res.end('Hello World\n');
    });
    
    //listen for request on port 3000, and as a callback function have the port listened on logged
    server.listen(port, hostname, () => {
      console.log(`Server running at http://${hostname}:${port}/`);
    });
    
    

    The code imports the "http" module and uses it to create a server (createServer()) that listens for HTTP requests on port 3000. The script then prints a message to the console about what browser URL you can use to test the server. The createServer() function takes as an argument a callback function that will be invoked when an HTTP request is received — this simply returns a response with an HTTP status code of 200 ("OK") and the plain text "Hello World".

    Note:  Don't worry if you don't understand exactly what this code is doing yet! We'll explain our code in greater detail once we start using Express!

  2. Start the server by navigating into the same directory as your hellonode.js file in your command prompt, and calling node along with the script name, like so:
    >node hellonode.js
    Server running at http://127.0.0.1:3000/
    
  3. Navigate to the URL http://127.0.0.1:3000 . If everything is working, the browser should simply display the string "Hello World".

Using NPM

Next to Node itself, NPM is the most important tool for working with Node applications. NPM is used to fetch any packages (JavaScript libraries) that an application needs for development, testing, and/or production, and may also be used to run tests and tools used in the development process. 

Note: From Node's perspective, Express is just another package that you need to install using NPM and then require in your own code.

You can manually use NPM to separately fetch each needed package. Typically we instead manage dependencies using a plain-text definition file named package.json. This file lists all the dependencies for a specific JavaScript "package", including the package's name, version, description, initial file to execute, production dependencies, development dependencies, versions of Node it can work with, etc. The package.json file should contain everything NPM needs to fetch and run your application (if you were writing a reusable library you could use this definition to upload your package to the npm respository and make it available for other users).

Adding dependencies

The following steps show how you can use NPM to download a package, save it into the project dependencies, and then require it in a Node application.

Note: Here we show the instructions to fetch and install the Express package. Later on we'll show how this package, and others, are already specified for us using the Express Application Generator. This section is provided because it is useful to understand how NPM works and what is being created by the application generator.

  1. First create a directory for your new application and navigate into it:
    mkdir myapp
    cd myapp
  2. Use the npm init command to create a package.json file for your application. This command prompts you for a number of things, including the name and version of your application and the name of the initial entry point file (by default this is index.js). For now, just accept the defaults:
    npm init

    If you display the package.json file (cat package.json), you will see the defaults that you accepted, ending with the license.

    {
      "name": "myapp",
      "version": "1.0.0",
      "description": "",
      "main": "index.js",
      "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1"
      },
      "author": "",
      "license": "ISC"
    }
    
  3. Now install Express in the myapp directory and save it in the dependencies list of your package.json file
  4. npm install express --save

    The dependencies section of your package.json will now appear at the end of the package.json file and will include Express.

    {
      "name": "myapp",
      "version": "1.0.0",
      "description": "",
      "main": "index.js",
      "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1"
      },
      "author": "",
      "license": "ISC",
      "dependencies": {
        "express": "^4.16.3"
      }
    }
    
  5. To use the library you call the require() function as shown below in your index.js file.
    const express = require('express')
    const app = express();
    
    app.get('/', (req, res) => {
      res.send('Hello World!')
    });
    
    app.listen(8000, () => {
      console.log('Example app listening on port 8000!')
    });
    

    This code shows a minimal "HelloWorld" Express web application. This imports the "express" module and uses it to create a server (app) that listens for HTTP requests on port 8000 and prints a message to the console explaining what browser URL you can use to test the server. The app.get() function only responds to HTTP GET requests with the specified URL path ('/'), in this case by calling a function to send our Hello World! message. 

    Create a file named index.js in the root of the "myapp" application directory and give it the contents shown above.

  6. You can start the server by calling node with the script in your command prompt:
    >node index.js
    Example app listening on port 8000
    
  7. Navigate to the URL (http://127.0.0.1:8000/). If everything is working, the browser should simply display the string "Hello World!".

Development dependencies

If a dependency is only used during development, you should instead save it as a "development dependency" (so that your package users don't have to install it in production). For example, to use the popular JavaScript Linting tool eslint you would call NPM as shown:

npm install eslint --save-dev

The following entry would then be added to your application's package.json:

  "devDependencies": {
    "eslint": "^4.12.1"
  }

Note: "Linters" are tools that perform static analysis on software in order to recognise and report adherence/non-adherance to some set of coding best practice.

Running tasks

In addition to defining and fetching dependencies you can also define named scripts in your package.json files and call NPM to execute them with the run-script command. This approach is commonly used to automate running tests and parts of the development or build toolchain (e.g., running tools to minify JavaScript, shrink images, LINT/analyse your code, etc).

Note: Task runners like Gulp and Grunt can also be used to run tests and other external tools.

For example, to define a script to run the eslint development dependency that we specified in the previous section we might add the following script block to our package.json file (assuming that our application source is in a folder /src/js):

"scripts": {
  ...
  "lint": "eslint src/js"
  ...
}

To explain a little further, eslint src/js is a command that we could enter in our terminal/command line to run eslint on JavaScript files contained in the src/js directory inside our app directory. Including the above inside our app's package.json file provides a shortcut for this command — lint.

We would then be able to run eslint using NPM by calling:

npm run-script lint
# OR (using the alias)
npm run lint

This example may not look any shorter than the original command, but you can include much bigger commands inside your npm scripts, including chains of multiple commands. You could identify a single npm script that runs all your tests at once.

Installing the Express Application Generator

The Express Application Generator tool generates an Express application "skeleton". Install the generator using NPM as shown (the -g flag installs the tool globally so that you can call it from anywhere):

npm install express-generator -g

To create an Express app named "helloworld" with the default settings, navigate to where you want to create it and run the app as shown:

express helloworld

Note: You can also specify the template library to use and a number of other settings. Use the help command to see all the options:

express --help

 

NPM will create the new Express app in a sub folder of your current location, displaying build progress on the console. On completion, the tool will display the commands you need to enter to install the Node dependencies and start the app.

The new app will have a package.json file in its root directory. You can open this to see what dependencies are installed, including Express and the template library Jade:

{
  "name": "helloworld",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www"
  },
  "dependencies": {
    "body-parser": "~1.18.2",
    "cookie-parser": "~1.4.3",
    "debug": "~2.6.9",
    "express": "~4.15.5",
    "jade": "~1.11.0",
    "morgan": "~1.9.0",
    "serve-favicon": "~2.4.5"
  }
}

 

Install all the dependencies for the helloworld app using NPM as shown:

cd helloworld
npm install

Then run the app (the commands are slightly different for Windows and Linux/macOS), as shown below:

# Run the helloworld on Windows with Command Prompt
SET DEBUG=helloworld:* & npm start

# Run the helloworld on Windows with PowerShell
SET DEBUG=helloworld:* | npm start

# Run helloworld on Linux/macOS
DEBUG=helloworld:* npm start

The DEBUG command creates useful logging, resulting in an output like that shown below.

>SET DEBUG=helloworld:* & npm start

> helloworld@0.0.0 start D:\Github\expresstests\helloworld
> node ./bin/www

  helloworld:server Listening on port 3000 +0ms

Open a browser and navigate to http://127.0.0.1:3000/ to see the default Express welcome page.

Express - Generated App Default Screen

We'll talk more about the generated app when we get to the article on generating a skeleton application.

Summary

You now have a Node development environment up and running on your computer that can be used for creating Express web applications. You've also seen how NPM can be used to import Express into an application, and also how you can create applications using the Express Application Generator tool and then run them.

In the next article we start working through a tutorial to build a complete web application using this environment and associated tools.

See also

 

In this module

 

Etiquetas y colaboradores del documento

Colaboradores en esta página: GUEROZ, mdnwebdocs-bot, maringenio
Última actualización por: GUEROZ,