Debes iniciar sesión

Para ver esta clase crea una cuenta sin costo o inicia sesión

Express application generator

4/42

En esta clase veremos cómo usar el generador de aplicaciones oficial de Express, llamado express-generator, que permite generar toda una estructura base o scafold predeterminada para iniciar un proyecto nuevo.

Primero debemos instalarlo como una dependencia global con la instrucción:

npm i express-generator -g

Luego para generar una aplicación, ejecutamos la instrucción:

express --view=pug <nombre-de-la-aplicacion>

Finalmente seguimos las instrucciones que nos indica:

#Cambiar de directorio:
cd <nombre-de-la-aplicacion>

#Instalar las dependencias:
npm install

#Ejecutar la app:
DEBUG=<nombre-de-la-aplicacion>:* npm start

Con esta funcionalidad creamos una estructura inicial, predeterminada para un nuevo proyecto con Express.js, con algunas rutas y middlewares iniciales con los que podemos empezar a trabajar, ahorrándonos algunos pasos de configuración.

Si no les ha funcionado el comando DEBUG=myapp:* npm start en Windows
pueden usar este comando set DEBUG=myapp:* & npm start

https://expressjs.com/en/starter/generator.html

La explicacion es muy pobre y se nota que a pesar de manejar el tema, no puede comunicar sus ideas en la clase

Les comparto:

Agregué un nuevo archivo en la carpeta routes y lo llamé about-me.js, este es el código:

// routes/about-me.js
var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function (req, res, next) {
    res.render('about-me', {
        me: {
            name: 'Luis Angel',
            last_name: 'Frias',
            favorite_food: 'chilaquiles :O___',
            size: '1.65m',
            weight: '85kg >:D'
        }
    });
});

module.exports = router;

En archivo anterior, al momento de dar una respuesta lo estamos haciendo usando una vista la cual también agregaré en la carpeta views llamando al archivo, about-me.pug con el siguiente código:

// views/about-me.pug
extends layout

block content
    p !{JSON.stringify(me)} /* <= Con esto muestro el JSON completo dentro de la vista*/

Importamos/agregamos nuestro archivo de la carpeta routes en el archivo app.js del proyecto:

// app.js
var usersRouter = require('./routes/users');
var aboutMe = require('./routes/about-me'); /* <= Mi ruta */

Y al final declaramos la ruta que usaremos para llamar a ese archivo:

// app.js
app.use('/users', usersRouter);
app.use('/about', aboutMe); /* <= Mi ruta about */

Si tienen problemas en arrancar Express en Windows ejecuten las siguientes líneas por separado y solucionado:

  • set DEBUG=express-app-gen:*
  • npm start

Para los que llegamos tarde:

npx express-generator --view=pug

para que no se instale de forma global.

Reto:

1.PNG
2.PNG

Para los usuarios de windows como yo, les recomiendo:
1er. Crean una carpeta llamada express-app-gen
2do. Entren a la carpeta express-app-gen
3ero. Corran el comando npx express-generator
Con este ultimo paso tendran toda app creada con sus carpetas, tal cual esta en la clase.

falto un poco mas de explicación

Para el ejercicio quise crear un objeto ‘Usuarios’ con dos elementos, los cuales tienen atributos cada uno. Lo hice de la siguiente manera:

const express = require('express');
const app = express();

var usuarios = {
  'Alberto': {
    nombre: 'alberto',
    apellido: 'Lopez jimenez',
    edad: 21
  },
  'Maximina' : {
    nombre: 'Maximina',
    apellido: 'Sanchez Garcia',
    edad: 22
  }
};

app.get("/usuarios", function(req, res,next){
  res.send(usuarios)
});

const server = app.listen(3000, function(){
  console.log(`Escuchando en htttp://localhost:${server.address().port}`);
});

Para los que usan PowerShell, el comando para cambiar la variable ENV, es: $env:NODE_ENV=“production”, despues ejecuten el comando npm start; Fuente: https://stackoverflow.com/questions/9249830/how-can-i-set-node-env-production-on-windows.

Genial introducción, conciso, claro y preciso. Por eso me gusta tanto express, no conocía este generador de aplicaciones… Genial curso le veo futuro

no me gusta pug :S …

Comparto código de ejemplo…

const express = require("express");
const app = express();

app.get("/", (req, res)=>{
    res.send({
        "Información personal": {
            Nombre: "Omar Velez",
            Profesión: "Ingeniero de Sistemas",
            Genero: "Masculino",
            País: "Colombia",
            Ciudad: "Bogota",
        },
        "Hobbies": {
            1: "Leer",
            2: "Escuchar Musica",
            3: "Cine",
            4: "Cocina"
        },
        "Bandas Preferidas": {
            1: "AC/DC",
            2: "The Strokes",
            3: "Prisioneros",
            4: "The Offspring",
            5: "Daft Punk"
        },
    });
});

const server = app.listen(8000, ()=>{
    console.info(`Listening on http://localhost:${server.address().port}`);
});

Si no te es posible ejecutar en Windows el comando:

express --view=pug [Nombre de aplicacion]

Solución:

  1. Abre PowerShell como administrador
  2. Escribe: Set-ExecutionPolicy Unrestricted
  3. Dale que sí

Reto : en este caso estoy renderizando directamente un html y el cubo generado es con la libreria three.js

Igual y llego alo tarde pero si no les ah funcionado el comando mostrado den el video el de DEBUG=express-app-gen …

Abajo hay una respuesta publicada por David Vargas Dominguez la cual es la documentacion , pero en resumen , el comando cambia dependiendo de en que S.O o linea de comandos lo ejecutes:

MacOS o Linux
$ DEBUG=myapp:* npm start

Windows Command Prompt:

set DEBUG=myapp:* & npm start

Windows PowerShell
PS> $env:DEBUG=‘myapp:*’; npm start

Adicional como comentario a Platzi , si es que actualizan el curso posteriormente seria bueno que hicieran el video en este tipo de cosas como lo vi alguna vez en otros cursos lo hacia Freddy en estos casos, el explicaba en los 3 S.O lo que se hacia para que funcionara lo que explicaba y los videos no quedaban largos. Creo que eso resolvia muchas dudas

express --pug --git express-app-gen

muy claro la info, vamos bien!

En el app.js en la funcion de error handler, se hace req.app.get('env') esto me causa una duda.

me canse muchos errores en Windows ,instalando ubuntu para no perder tanto tiempo

Cual es la diferencia entre el método

res.render() y res.send()

Captura.JPG

si les sale error de express not recognized as internal or external command, es porque creo que tienen que estar linkeados al users root, no se, me estuve una noche entera solucionandolo, creo que fue eso

El 'env' viaja en todos los request?

vamo a darle
retoexpress.png

Buenos dias, tengo un problemas me sale esto, intente de varias formas pero sigue en lo mismo, alguien me puede ayudar??

PS C:\Users\Milton\Desktop\express\express-app-gen> set DEBUG=express-app-gen:* & npm start
En línea: 1 Carácter: 29

  • set DEBUG=express-app-gen:* & npm start
  •                         ~
    

No se permite usar el carácter de Y comercial (&). El operador & está reservado para un uso futuro; encierre un símbolo de Y comercial
entre comillas dobles ("&") para pasarlo como parte de una cadena.
+ CategoryInfo : ParserError: (😃 [], ParentContainsErrorRecordException
+ FullyQualifiedErrorId : AmpersandNotAllowed

Reto

const express = require('express')
const app = express()

const puerto = process.env.PORT || 8000

const dev = { 
    name: "Brian",
    lastName: "Bentancourt",
    gitHub: "https://github.com/brianbentancourt"
}

app.get('/',(req, res, next)=>{
    res.send(dev)
})

const server = app.listen(puerto, ()=>{
    console.log(`Puerto ejecutando en puerto: ${server.address().port}`)
})

const express = require('express')

const app = express()

const Person = {
  name: 'Michael',
  lastName: 'Sornoza',
  eMail: '[email protected]'
}

app.get('/', function(req, res, next) {
  res.send({Person})
})

const server = app.listen(8000, function() {
  console.log(`Listening: http://localhost:${server.address().port}`);
})```

Alguien que haya tenido problemas con el comando DEBUG=myapp:* npm start y lo haya solucionado? por que acá no funciono y ya lo intente de varias maneras.

Crear un modulo de rutas para nuestra aplicación

const express = require('express')
// Inicializar nuestro enrutador
const router = express.Router()

// Registrar rutas en nuestro enrutador
router.get('/', function (req, res) {
  res.send('<h1>Bienvenidos al sitio</h1>')
})

router.get('/products', function (req, res) {
  res.json({
    results: [
      {
        id: Math.floor(Math.random() * 1000),
        name: 'Producto A',
        createdAt: new Date
      },
      {
        id: Math.floor(Math.random() * 1000),
        name: 'Producto B',
        createdAt: new Date
      }
    ]
  })
})

router.get('/servicios', function (req, res) {
  res.render('site/servicios', {
    title: 'Express JS Servicios',
    contents: 'Contenido principal de la vista para servicios del estado mexicano'
  })
})

// Exportar nuestro enrutador
module.exports = router
const express = require("express");
const app = express();
const port = process.env.PORT || 3000;
app.get("/", (req, res, next) => {
  res.status(200).send({
    firstName: "Rubén",
    lastName: "Chanamé",
    age: 29
  });
});
const server = app.listen(port, () => {
  console.log(`Escuchando en el puerto ${port}`);
});

Reto completado

const express = require('express');
const app = express();

let data = {
    status: 200,
    error: null,
    body : {
        fullname: "Emanuel Mamani",
        age: 22,
        profession: 'Desarrollador Web'
    }
}

app.get('/', (req, res, next) => {
    res.send(data);
});

const server = app.listen(3000, () => console.log('Listening http://localhost:3000'))

Dejo mi aporte

<code> 
const express = require('express');
const app = express();

app.get('/', (req, res, next) => {
  res.send({
    nombre: "Daniel",
    apellido: "Salazar",
    edad: "26",
  });
});

const server = app.listen(21301, () => {
  console.log(`Aplicacion corriendo en localhost:  ${server.address().port}`);
})

en ruta

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

router.get("/datos", function (req, res, next) {
  res.send({
    nombre: "mathias",
    edad: 27,
  });
});

module.exports = router;

en app.js

Vengo usando este generador de archivos .gitignore para mis proyectos, ya que te permite elegir que quieres omitir al momento de hacer el commit:

Página oficial: https://www.toptal.com/developers/gitignore
Extensión para VSC: https://marketplace.visualstudio.com/items?itemName=piotrpalarz.vscode-gitignore-generator

Espero les sirva.

En mi anterior trabajo tenían este témplate generado, siempre me preguntaba como es que lo configuraban y no me querían decir, hasta que me puse a investigar por propia cuenta y hasta que llegue a un blog de como construirlo (viví engañado unos días por mi equipo)

El codigo del servidor.

const express = require('express');
const app = express();

app.get('/', (req, res, next) => {
  res.send({
    name: "Ricardo",
    surname: "Enciso",
    age: "21",
    hair_color: "brown"
  });
});

const server = app.listen(8000, () => {
  console.log("Escuchando en el puerto " + server.address().port);
})

SOLO USUARIOS WINDOWS
Pasos para la instalacion

  • npm i -g express
  • npm install express-generator -g
  • express express-app-gen --view=pug
  • cd express-app-gen
  • npm install
  • SET DEBUG=express-app-gen:*
  • npm start

link

Annotation 2020-07-03 001401.png

Aquí está mi ejemplo regresando un json usando express.

const express = require('express')
const app = express()

// Declaración de rutas y sus respectivos controladores
app.get('/', function (req, res) {
  // Enviar respuestas en formato HTML
  res.send('<h1>Hello world</h1>');
})

app.get('/json', function (req, res) {
  // Enviar respuestas en formato json
  res.json({
    message: "Hello world javascripters",
    date: new Date
  })
})

// Iniciar el servidor de la aplicación
const server = app.listen(8000, function () {
  console.log(`Listening http://localhost:${server.address().port}`)
})

// Recomendable exportar como modulo para hacer pruebas unitarias a nuestra app, u ofrecerla como una librería para otros proyectos
exports.module = server
var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

router.get('/info', function(req, res, next) {
  res.send({
    'name': 'Ricardo',
    'last_name': 'Lugo',
    'age': 29
  });
});

module.exports = router;

En mi caso para usar PowerShell tuve que utilizar el siguiente código:

[Environment]::SetEnvironmentVariable("DEBUG","express:*"); & npm start

Original: https://stackoverflow.com/a/51459879/7426916

<code>
const express = require('express');
const app = express();

let usuarios = [];

class Usuario {
    constructor(nombre, edad, sexo) {
        this.nombre = nombre;
        this.edad = edad;
        this.sexo = sexo;
    }
}

usuarios.push(new Usuario('sergio', 18, 'M'));

usuarios.push(new Usuario('miguel', 18, 'M'));

usuarios.push(new Usuario('nicolas', 18, 'M'));


app.get('/usuarios', (req, res) => {
    res.send(usuarios);
});

app.listen(2000, () => {
    console.log("Servidor iniciado");
});
const express = require('express')

const app = express()

const port = process.env.PORT || 8000

app.get('/', (req, res, next) => {
  res.send({
    name: 'Santiago Rincón',
    pokedex: {
      _1: 'Bulbasaur',
      _4: 'Charmander',
      _7: 'Squirtle',
      _10: 'Caterpie',
      _13: 'Weedle'
    }
  })
})

const server = app.listen(port, () => {
  console.log(`Your Pokemon list at http://127.0.0.1:8000`)
})

Si eres un usuario en WINDOWS y no te es posible ejecutar el comando express --vies=pug [Nombre de la aplicacion] debes de modificar tu variable de entorno e ir a buscar en la carpeta de tu usuario la carpeta appData>Roaming>node . Luego de esto ya te sera posible ejectuar el comando express

les dejo un recurso para no tener que escribir toda la ruta o comando en la consola

alias express="DEBUG=express-app:* npm start"

“express” puede ser remplazado por la palabra que quieras, ya solo en la consola ejecutas express y listo!

const express = require(‘express’);
const app = express();

app.get(’/’, function(req, res, next) {
res.send({ title: “Bienvenido a este su servidor de express”,
name: ‘Juan Sebastian’,
age: 22,
Profesion: ‘Ingeniero de Software’,
hobbies: {
1: ‘aeromodelismo’,
2: ‘tocar acordeon’,
3: ‘Jugar Futbol’
} });
});

const server = app.listen(8000, function() {
console.log(Listening http://localhost: ${server.address().port});
});

const express = require("express")
const app =  express();

app.get("/",(req, res, next)=> {
    res.send({
        "Personal information":{
            name: "Rabi León",
            profession: "I.S.C",
            gender: "male",
            country: "México",
            city: "Mérida"

        },
        "Hobbies":{
            1: "listen to music",
            2: "watch comic series",
            3: "read a book"
        }
    })
}) 

const server = app.listen(8500, function(){
    console.log(`Listen http://localhost:${server.address().port}`)
})```

const express = require(‘express’);
const app = express();
app.get(’/’, function(req, res, next){
res.send({ “Information”: {
“test information”: “Test information”,
Example: “This is an example”
}});
})

const server = app.listen(3000, function(){
console.log(Server Listening http://localhost:${server.address().port});
});

My Code!

const express =  require('express');
const app = express();

app.get('/',(req, res) =>{
    const me = {
        name: 'Carlos Ramírez Flores',
        year_old: '32',
        country: 'México',
        city: 'Zacatecas'
        
    }
    res.send(me);
});

const server = app.listen(3001, () =>{
    console.log(`Corriendo en http://localhost:${server.address().port}`);
})

const express = require(‘express’);
const app = express();
const port = 3000

app.get(’*’, (req, res) => {
res.send({
name: “Jose Banega”,
age: ‘24’,
country: ‘Argentina’,
})
});

app.listen(port, () => console.log(listening on http://localhost:${port}));

Solución al reto:

const express = require('express');
const app = express();

app.get('/', (req, res, next) => {
  res.send({
    name: 'Mario Alejandro',
    lastname: 'Quevedo Gámez',
    country: 'México',
    city: 'Guadalajara',
  });
});

const server = app.listen(3000, () => {
  console.log(`Listening http://localhost${server.address().port}`);
});

const express = require('express');
const app = express();


var datos = {
    nombre: "Ivan",
    edad: "23",
    sexo: "Masculino",
    pais: "México",
    ciudad: "Mérida"
}

app.get('/', function(req,res,next){
    res.send({datos})
})

const server = app.listen(8000, function(){
    console.log(`listening http://localhost:${server.address().port}`);
})```
const express = require('express')
const app = express()

app.get('/', (req, res, next) => {
    res.send({ name: "Eden", 
		     lastName: "Gress", })
})

const server = app.listen(7000, () => {
    console.log(`listening on http://localhost:${server.address().port}`);
})

¿Qué tema de visual studio code usa el profesor?, me gusta el tema pero es por las guide line que se resaltan cuando estamos en un bloque de código

Baby steps

const express = require('express');
const app = express();

const info = {
  name: 'David',
  age: 22,
  city: 'Bogotá D.C'
}

app.get('/', (req, res) => {
  res.send(info)
})

const server = app.listen(3000, () => {
  console.log(`App is listening at ${server.address().port}.`)
})

Buenas, acá comparto mi respuesta al reto:
 
 Code.png
 
View.png

const expres = require("express")
const app = expres()

app.get("/", function(req, res, next){
    res.json({
        nombre: "Johan",
        info:{
            edad: 20,
            ciudad: "CDMX"
        }
    })
} )

const server = app.listen(8000, function(){
    console.log(`Listen on http://localhost:${server.address().port}`);      
}) ```
const express = require("express");
const app = express();

app.get("/", function (req, res, next) {
  res.json({
    nombre: "camilo velandia",
    edad: "21",
  });
});

const server = app.listen(8000, function () {
  console.log(
    `Listening http://localhost:${
      server.address().port
    }`
  );
});

en el index:

'use strict';
const express = require('express');
const app = express();

const personalData = require('../utils/response');
const { port } = require('../config').api;

app.get('*', (req, res) => {
  res.send(personalData);
});

const server = app.listen(port, () => {
  try {
    console.log(`Listening on port: http://localhost:${server.address().port}`);
  } catch (err) {
    console.error(err);
  }
});

response:

‘use strict’;
module.exports = {
name: ‘Derek’,
lastname: ‘Paúl’,
age: 17
}```
const express = require("express");
const app = express();

app.get("/", function (req, res, next) {
	res.send({
		fullname: "Alexis Barba",
		age: 25,
		country: "Mexico",
		lovecoding: true,
	});
});

const server = app.listen(8000, function () {
	console.log(`Listening http://localhost:${server.address().port}`);
});
const express = require('express');
const app = express();

app.get('/', (req, res) => {
    res.send({
        "full name": "Alejandro Zapata Molina",
        "age": 20,
        "github account": "Alejandro2134",
    })
})

const server = app.listen(3000, () => {
    console.log('App corriendo en el puerto 3000');
})

Excelente

Reto listo 😃

Screenshot_1.png

Comparto el reto logrado con un pequeño ejemplo de información.
Recuerden que esa información declara en la ruta, puede ser rendereada en una visa (pug template).

Ruta de información (info.js)

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

/** Obtenemos los datos de la pantalla de informacion */
router.get("/", function (req, res, next) {
  res.render("info", {
    //Enviamos un JSON
    name: "Paul Teran",
    age: "21 años",
    mayor: "Software Development",
  });
});

module.exports = router;

Render template (info.pug)

extends layout

block content
  p Nombre: #{name}
  p Edad: #{age}
  p Carrera: #{mayor}

Reto usando TypeScript:
express1.png
express1.1.png

Vas muy rápido, se jactan de decir que son mejores que las universidades pero hasta en mi universidad el profesor explica más despacio

El reto
data.js

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

/* GET data listing. */
router.get('/', function(req, res, next) {
  res.send({
      person: {
          name: "Francisco",
          lastName: "Garcia",
          age: "52"
      },
      skills: {
        hard: "Data analysis, Cestifications, Marketing, Scrum Master, Design, Cloud Computing",
        soft: "Inteligencia Emocional, Gestion de Tiempo, Habilidad de Negociacion, Profecionalidad y Actitud, Liderazgo, Colaborativo, Resolucion de problemas, Comunicacion"
      },

  });
});

module.exports = router;

app.js

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var dataRouter = require('./routes/data');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/users', usersRouter);
app.use('/data', dataRouter);
var express = require('express');
var router = express.Router();

router.get('/', function(req, res, next){
    res.send({
        name: 'Andres armas',
        country: 'Peru',
        age: '22',
        sex: 'Male',
        profession: 'Developer'
    })
})

module.exports = router;
const express = require('express');
const app = express();

app.get('/', (req, res) => {
    res.json({
        name: "Carlos",
        lastname: "Sánchez",
        username: "carlosvldz",
        gender: "M",
        country: "Mexico"
    })
});

const server = app.listen(3000, function(){
    console.log(`Listening on https://localhost:${server.address().port}`);
});```

Mi pequeño aporte

const express = require('express');
const app = express();

const userInformatin = {
    name: "Michael Camelo",
    age: "30",
    Profesion: "Físico",
}

app.get('/', (request,response, next)=>{
    response.send(userInformatin);
});

const server = app.listen(8000, ()=>{
    console.log("Server listen at  ${server.address().port}");
})

Hola a todos! Les dejo mi solución al reto 😄

const express = require('express');
const app = express();

app.get('/', function(req, res, next) {
    res.send({ "name": "Edward", "last_name": "Fernandez", "age": 27, "eyes_color": "brown" })
});

const server = app.listen(8000, function() {
    console.log(`Listening to localhost:${server.address().port}`);
});

Acá el reto 😃
Screenshot from 2021-04-12 11-16-17.png

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var index = require('./routes/index');
var users = require('./routes/users');
var javier1nc = require('./routes/javier1nc');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', index);
app.use('/users', users);
app.use('/javier1nc', javier1nc);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

app.listen(process.env.PORT || 3000, () => console.log('Example app listening on port 3000!'));

module.exports = app;

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


me = {
    me: {
            name: 'Javier',
            user: 'javier1nc',
            email: '[email protected]'
        }
}


/* GET users listing. */
router.get('/', function(req, res, next) {
  res.send(me);
});

module.exports = router;

const express = require(‘express’);

const app = express();

app.set(‘port’, 3000);
app.set(‘name’, ‘Challenge’);

app.get(’/about’, (req, res) => {
res.send({
name: ‘arturo’,
age: ‘39’,
eyes: ‘two and brown’,
tall: ‘173cm’,
hair: 'black and almost bald '
})
})

app.listen(app.set(‘port’), () => {
console.log(Server of ${app.set('name')} is ready in port ${app.set('port')})
})

Mi código quedo asíCaptura de pantalla de 2021-01-19 15-03-39.png

Desarrollo

![](ab.PNG

Resultado

![](ab2.PNG

Recuerden moverse a la carpeta indicada, en este caso
curso de express>express-app-gen
y ejecuten este comando:
$env:DEBUG='express-app-gen:*'; npm start

Al final, entren al localhost 3000

Para algunos que estamos en linux y están teniendo con algunos paquetes desactualizados espero que estos comando les pueda servir
-Paso1: Primero listamos las paquetes
-> npm outdated
-Paso2: para actualizar todos los paquetes metemos el sgt comando
-> npm install -g npm-check-updates (en todo caso le paso la letra
"para que se actualice de forma global"
paso3: actualizamos con el sgt comando todas las dependecias
-> ncu -u
pas4: le pasamos update
-> npm update
paso5: por ultimo instalamos
-> npm install

Si no les ha funcionado el comando DEBUG=myapp:* npm start en Windows
pueden usar este comando set DEBUG=myapp:* & npm start

https://expressjs.com/en/starter/generator.html

La explicacion es muy pobre y se nota que a pesar de manejar el tema, no puede comunicar sus ideas en la clase

Les comparto:

Agregué un nuevo archivo en la carpeta routes y lo llamé about-me.js, este es el código:

// routes/about-me.js
var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function (req, res, next) {
    res.render('about-me', {
        me: {
            name: 'Luis Angel',
            last_name: 'Frias',
            favorite_food: 'chilaquiles :O___',
            size: '1.65m',
            weight: '85kg >:D'
        }
    });
});

module.exports = router;

En archivo anterior, al momento de dar una respuesta lo estamos haciendo usando una vista la cual también agregaré en la carpeta views llamando al archivo, about-me.pug con el siguiente código:

// views/about-me.pug
extends layout

block content
    p !{JSON.stringify(me)} /* <= Con esto muestro el JSON completo dentro de la vista*/

Importamos/agregamos nuestro archivo de la carpeta routes en el archivo app.js del proyecto:

// app.js
var usersRouter = require('./routes/users');
var aboutMe = require('./routes/about-me'); /* <= Mi ruta */

Y al final declaramos la ruta que usaremos para llamar a ese archivo:

// app.js
app.use('/users', usersRouter);
app.use('/about', aboutMe); /* <= Mi ruta about */

Si tienen problemas en arrancar Express en Windows ejecuten las siguientes líneas por separado y solucionado:

  • set DEBUG=express-app-gen:*
  • npm start

Para los que llegamos tarde:

npx express-generator --view=pug

para que no se instale de forma global.

Reto:

1.PNG
2.PNG

Para los usuarios de windows como yo, les recomiendo:
1er. Crean una carpeta llamada express-app-gen
2do. Entren a la carpeta express-app-gen
3ero. Corran el comando npx express-generator
Con este ultimo paso tendran toda app creada con sus carpetas, tal cual esta en la clase.

falto un poco mas de explicación

Para el ejercicio quise crear un objeto ‘Usuarios’ con dos elementos, los cuales tienen atributos cada uno. Lo hice de la siguiente manera:

const express = require('express');
const app = express();

var usuarios = {
  'Alberto': {
    nombre: 'alberto',
    apellido: 'Lopez jimenez',
    edad: 21
  },
  'Maximina' : {
    nombre: 'Maximina',
    apellido: 'Sanchez Garcia',
    edad: 22
  }
};

app.get("/usuarios", function(req, res,next){
  res.send(usuarios)
});

const server = app.listen(3000, function(){
  console.log(`Escuchando en htttp://localhost:${server.address().port}`);
});

Para los que usan PowerShell, el comando para cambiar la variable ENV, es: $env:NODE_ENV=“production”, despues ejecuten el comando npm start; Fuente: https://stackoverflow.com/questions/9249830/how-can-i-set-node-env-production-on-windows.

Genial introducción, conciso, claro y preciso. Por eso me gusta tanto express, no conocía este generador de aplicaciones… Genial curso le veo futuro

no me gusta pug :S …

Comparto código de ejemplo…

const express = require("express");
const app = express();

app.get("/", (req, res)=>{
    res.send({
        "Información personal": {
            Nombre: "Omar Velez",
            Profesión: "Ingeniero de Sistemas",
            Genero: "Masculino",
            País: "Colombia",
            Ciudad: "Bogota",
        },
        "Hobbies": {
            1: "Leer",
            2: "Escuchar Musica",
            3: "Cine",
            4: "Cocina"
        },
        "Bandas Preferidas": {
            1: "AC/DC",
            2: "The Strokes",
            3: "Prisioneros",
            4: "The Offspring",
            5: "Daft Punk"
        },
    });
});

const server = app.listen(8000, ()=>{
    console.info(`Listening on http://localhost:${server.address().port}`);
});

Si no te es posible ejecutar en Windows el comando:

express --view=pug [Nombre de aplicacion]

Solución:

  1. Abre PowerShell como administrador
  2. Escribe: Set-ExecutionPolicy Unrestricted
  3. Dale que sí

Reto : en este caso estoy renderizando directamente un html y el cubo generado es con la libreria three.js

Igual y llego alo tarde pero si no les ah funcionado el comando mostrado den el video el de DEBUG=express-app-gen …

Abajo hay una respuesta publicada por David Vargas Dominguez la cual es la documentacion , pero en resumen , el comando cambia dependiendo de en que S.O o linea de comandos lo ejecutes:

MacOS o Linux
$ DEBUG=myapp:* npm start

Windows Command Prompt:

set DEBUG=myapp:* & npm start

Windows PowerShell
PS> $env:DEBUG=‘myapp:*’; npm start

Adicional como comentario a Platzi , si es que actualizan el curso posteriormente seria bueno que hicieran el video en este tipo de cosas como lo vi alguna vez en otros cursos lo hacia Freddy en estos casos, el explicaba en los 3 S.O lo que se hacia para que funcionara lo que explicaba y los videos no quedaban largos. Creo que eso resolvia muchas dudas

express --pug --git express-app-gen

muy claro la info, vamos bien!

En el app.js en la funcion de error handler, se hace req.app.get('env') esto me causa una duda.

me canse muchos errores en Windows ,instalando ubuntu para no perder tanto tiempo

Cual es la diferencia entre el método

res.render() y res.send()

Captura.JPG

si les sale error de express not recognized as internal or external command, es porque creo que tienen que estar linkeados al users root, no se, me estuve una noche entera solucionandolo, creo que fue eso

El 'env' viaja en todos los request?

vamo a darle
retoexpress.png

Buenos dias, tengo un problemas me sale esto, intente de varias formas pero sigue en lo mismo, alguien me puede ayudar??

PS C:\Users\Milton\Desktop\express\express-app-gen> set DEBUG=express-app-gen:* & npm start
En línea: 1 Carácter: 29

  • set DEBUG=express-app-gen:* & npm start
  •                         ~
    

No se permite usar el carácter de Y comercial (&). El operador & está reservado para un uso futuro; encierre un símbolo de Y comercial
entre comillas dobles ("&") para pasarlo como parte de una cadena.
+ CategoryInfo : ParserError: (😃 [], ParentContainsErrorRecordException
+ FullyQualifiedErrorId : AmpersandNotAllowed

Reto

const express = require('express')
const app = express()

const puerto = process.env.PORT || 8000

const dev = { 
    name: "Brian",
    lastName: "Bentancourt",
    gitHub: "https://github.com/brianbentancourt"
}

app.get('/',(req, res, next)=>{
    res.send(dev)
})

const server = app.listen(puerto, ()=>{
    console.log(`Puerto ejecutando en puerto: ${server.address().port}`)
})

const express = require('express')

const app = express()

const Person = {
  name: 'Michael',
  lastName: 'Sornoza',
  eMail: '[email protected]'
}

app.get('/', function(req, res, next) {
  res.send({Person})
})

const server = app.listen(8000, function() {
  console.log(`Listening: http://localhost:${server.address().port}`);
})```

Alguien que haya tenido problemas con el comando DEBUG=myapp:* npm start y lo haya solucionado? por que acá no funciono y ya lo intente de varias maneras.

Crear un modulo de rutas para nuestra aplicación

const express = require('express')
// Inicializar nuestro enrutador
const router = express.Router()

// Registrar rutas en nuestro enrutador
router.get('/', function (req, res) {
  res.send('<h1>Bienvenidos al sitio</h1>')
})

router.get('/products', function (req, res) {
  res.json({
    results: [
      {
        id: Math.floor(Math.random() * 1000),
        name: 'Producto A',
        createdAt: new Date
      },
      {
        id: Math.floor(Math.random() * 1000),
        name: 'Producto B',
        createdAt: new Date
      }
    ]
  })
})

router.get('/servicios', function (req, res) {
  res.render('site/servicios', {
    title: 'Express JS Servicios',
    contents: 'Contenido principal de la vista para servicios del estado mexicano'
  })
})

// Exportar nuestro enrutador
module.exports = router
const express = require("express");
const app = express();
const port = process.env.PORT || 3000;
app.get("/", (req, res, next) => {
  res.status(200).send({
    firstName: "Rubén",
    lastName: "Chanamé",
    age: 29
  });
});
const server = app.listen(port, () => {
  console.log(`Escuchando en el puerto ${port}`);
});

Reto completado

const express = require('express');
const app = express();

let data = {
    status: 200,
    error: null,
    body : {
        fullname: "Emanuel Mamani",
        age: 22,
        profession: 'Desarrollador Web'
    }
}

app.get('/', (req, res, next) => {
    res.send(data);
});

const server = app.listen(3000, () => console.log('Listening http://localhost:3000'))

Dejo mi aporte

<code> 
const express = require('express');
const app = express();

app.get('/', (req, res, next) => {
  res.send({
    nombre: "Daniel",
    apellido: "Salazar",
    edad: "26",
  });
});

const server = app.listen(21301, () => {
  console.log(`Aplicacion corriendo en localhost:  ${server.address().port}`);
})

en ruta

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

router.get("/datos", function (req, res, next) {
  res.send({
    nombre: "mathias",
    edad: 27,
  });
});

module.exports = router;

en app.js

Vengo usando este generador de archivos .gitignore para mis proyectos, ya que te permite elegir que quieres omitir al momento de hacer el commit:

Página oficial: https://www.toptal.com/developers/gitignore
Extensión para VSC: https://marketplace.visualstudio.com/items?itemName=piotrpalarz.vscode-gitignore-generator

Espero les sirva.

En mi anterior trabajo tenían este témplate generado, siempre me preguntaba como es que lo configuraban y no me querían decir, hasta que me puse a investigar por propia cuenta y hasta que llegue a un blog de como construirlo (viví engañado unos días por mi equipo)

El codigo del servidor.

const express = require('express');
const app = express();

app.get('/', (req, res, next) => {
  res.send({
    name: "Ricardo",
    surname: "Enciso",
    age: "21",
    hair_color: "brown"
  });
});

const server = app.listen(8000, () => {
  console.log("Escuchando en el puerto " + server.address().port);
})

SOLO USUARIOS WINDOWS
Pasos para la instalacion

  • npm i -g express
  • npm install express-generator -g
  • express express-app-gen --view=pug
  • cd express-app-gen
  • npm install
  • SET DEBUG=express-app-gen:*
  • npm start

link

Annotation 2020-07-03 001401.png

Aquí está mi ejemplo regresando un json usando express.

const express = require('express')
const app = express()

// Declaración de rutas y sus respectivos controladores
app.get('/', function (req, res) {
  // Enviar respuestas en formato HTML
  res.send('<h1>Hello world</h1>');
})

app.get('/json', function (req, res) {
  // Enviar respuestas en formato json
  res.json({
    message: "Hello world javascripters",
    date: new Date
  })
})

// Iniciar el servidor de la aplicación
const server = app.listen(8000, function () {
  console.log(`Listening http://localhost:${server.address().port}`)
})

// Recomendable exportar como modulo para hacer pruebas unitarias a nuestra app, u ofrecerla como una librería para otros proyectos
exports.module = server
var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

router.get('/info', function(req, res, next) {
  res.send({
    'name': 'Ricardo',
    'last_name': 'Lugo',
    'age': 29
  });
});

module.exports = router;

En mi caso para usar PowerShell tuve que utilizar el siguiente código:

[Environment]::SetEnvironmentVariable("DEBUG","express:*"); & npm start

Original: https://stackoverflow.com/a/51459879/7426916

<code>
const express = require('express');
const app = express();

let usuarios = [];

class Usuario {
    constructor(nombre, edad, sexo) {
        this.nombre = nombre;
        this.edad = edad;
        this.sexo = sexo;
    }
}

usuarios.push(new Usuario('sergio', 18, 'M'));

usuarios.push(new Usuario('miguel', 18, 'M'));

usuarios.push(new Usuario('nicolas', 18, 'M'));


app.get('/usuarios', (req, res) => {
    res.send(usuarios);
});

app.listen(2000, () => {
    console.log("Servidor iniciado");
});
const express = require('express')

const app = express()

const port = process.env.PORT || 8000

app.get('/', (req, res, next) => {
  res.send({
    name: 'Santiago Rincón',
    pokedex: {
      _1: 'Bulbasaur',
      _4: 'Charmander',
      _7: 'Squirtle',
      _10: 'Caterpie',
      _13: 'Weedle'
    }
  })
})

const server = app.listen(port, () => {
  console.log(`Your Pokemon list at http://127.0.0.1:8000`)
})

Si eres un usuario en WINDOWS y no te es posible ejecutar el comando express --vies=pug [Nombre de la aplicacion] debes de modificar tu variable de entorno e ir a buscar en la carpeta de tu usuario la carpeta appData>Roaming>node . Luego de esto ya te sera posible ejectuar el comando express

les dejo un recurso para no tener que escribir toda la ruta o comando en la consola

alias express="DEBUG=express-app:* npm start"

“express” puede ser remplazado por la palabra que quieras, ya solo en la consola ejecutas express y listo!

const express = require(‘express’);
const app = express();

app.get(’/’, function(req, res, next) {
res.send({ title: “Bienvenido a este su servidor de express”,
name: ‘Juan Sebastian’,
age: 22,
Profesion: ‘Ingeniero de Software’,
hobbies: {
1: ‘aeromodelismo’,
2: ‘tocar acordeon’,
3: ‘Jugar Futbol’
} });
});

const server = app.listen(8000, function() {
console.log(Listening http://localhost: ${server.address().port});
});

const express = require("express")
const app =  express();

app.get("/",(req, res, next)=> {
    res.send({
        "Personal information":{
            name: "Rabi León",
            profession: "I.S.C",
            gender: "male",
            country: "México",
            city: "Mérida"

        },
        "Hobbies":{
            1: "listen to music",
            2: "watch comic series",
            3: "read a book"
        }
    })
}) 

const server = app.listen(8500, function(){
    console.log(`Listen http://localhost:${server.address().port}`)
})```

const express = require(‘express’);
const app = express();
app.get(’/’, function(req, res, next){
res.send({ “Information”: {
“test information”: “Test information”,
Example: “This is an example”
}});
})

const server = app.listen(3000, function(){
console.log(Server Listening http://localhost:${server.address().port});
});

My Code!

const express =  require('express');
const app = express();

app.get('/',(req, res) =>{
    const me = {
        name: 'Carlos Ramírez Flores',
        year_old: '32',
        country: 'México',
        city: 'Zacatecas'
        
    }
    res.send(me);
});

const server = app.listen(3001, () =>{
    console.log(`Corriendo en http://localhost:${server.address().port}`);
})

const express = require(‘express’);
const app = express();
const port = 3000

app.get(’*’, (req, res) => {
res.send({
name: “Jose Banega”,
age: ‘24’,
country: ‘Argentina’,
})
});

app.listen(port, () => console.log(listening on http://localhost:${port}));

Solución al reto:

const express = require('express');
const app = express();

app.get('/', (req, res, next) => {
  res.send({
    name: 'Mario Alejandro',
    lastname: 'Quevedo Gámez',
    country: 'México',
    city: 'Guadalajara',
  });
});

const server = app.listen(3000, () => {
  console.log(`Listening http://localhost${server.address().port}`);
});

const express = require('express');
const app = express();


var datos = {
    nombre: "Ivan",
    edad: "23",
    sexo: "Masculino",
    pais: "México",
    ciudad: "Mérida"
}

app.get('/', function(req,res,next){
    res.send({datos})
})

const server = app.listen(8000, function(){
    console.log(`listening http://localhost:${server.address().port}`);
})```
const express = require('express')
const app = express()

app.get('/', (req, res, next) => {
    res.send({ name: "Eden", 
		     lastName: "Gress", })
})

const server = app.listen(7000, () => {
    console.log(`listening on http://localhost:${server.address().port}`);
})

¿Qué tema de visual studio code usa el profesor?, me gusta el tema pero es por las guide line que se resaltan cuando estamos en un bloque de código

Baby steps

const express = require('express');
const app = express();

const info = {
  name: 'David',
  age: 22,
  city: 'Bogotá D.C'
}

app.get('/', (req, res) => {
  res.send(info)
})

const server = app.listen(3000, () => {
  console.log(`App is listening at ${server.address().port}.`)
})

Buenas, acá comparto mi respuesta al reto:
 
 Code.png
 
View.png

const expres = require("express")
const app = expres()

app.get("/", function(req, res, next){
    res.json({
        nombre: "Johan",
        info:{
            edad: 20,
            ciudad: "CDMX"
        }
    })
} )

const server = app.listen(8000, function(){
    console.log(`Listen on http://localhost:${server.address().port}`);      
}) ```
const express = require("express");
const app = express();

app.get("/", function (req, res, next) {
  res.json({
    nombre: "camilo velandia",
    edad: "21",
  });
});

const server = app.listen(8000, function () {
  console.log(
    `Listening http://localhost:${
      server.address().port
    }`
  );
});

en el index:

'use strict';
const express = require('express');
const app = express();

const personalData = require('../utils/response');
const { port } = require('../config').api;

app.get('*', (req, res) => {
  res.send(personalData);
});

const server = app.listen(port, () => {
  try {
    console.log(`Listening on port: http://localhost:${server.address().port}`);
  } catch (err) {
    console.error(err);
  }
});

response:

‘use strict’;
module.exports = {
name: ‘Derek’,
lastname: ‘Paúl’,
age: 17
}```
const express = require("express");
const app = express();

app.get("/", function (req, res, next) {
	res.send({
		fullname: "Alexis Barba",
		age: 25,
		country: "Mexico",
		lovecoding: true,
	});
});

const server = app.listen(8000, function () {
	console.log(`Listening http://localhost:${server.address().port}`);
});
const express = require('express');
const app = express();

app.get('/', (req, res) => {
    res.send({
        "full name": "Alejandro Zapata Molina",
        "age": 20,
        "github account": "Alejandro2134",
    })
})

const server = app.listen(3000, () => {
    console.log('App corriendo en el puerto 3000');
})

Excelente

Reto listo 😃

Screenshot_1.png

Comparto el reto logrado con un pequeño ejemplo de información.
Recuerden que esa información declara en la ruta, puede ser rendereada en una visa (pug template).

Ruta de información (info.js)

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

/** Obtenemos los datos de la pantalla de informacion */
router.get("/", function (req, res, next) {
  res.render("info", {
    //Enviamos un JSON
    name: "Paul Teran",
    age: "21 años",
    mayor: "Software Development",
  });
});

module.exports = router;

Render template (info.pug)

extends layout

block content
  p Nombre: #{name}
  p Edad: #{age}
  p Carrera: #{mayor}

Reto usando TypeScript:
express1.png
express1.1.png

Vas muy rápido, se jactan de decir que son mejores que las universidades pero hasta en mi universidad el profesor explica más despacio

El reto
data.js

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

/* GET data listing. */
router.get('/', function(req, res, next) {
  res.send({
      person: {
          name: "Francisco",
          lastName: "Garcia",
          age: "52"
      },
      skills: {
        hard: "Data analysis, Cestifications, Marketing, Scrum Master, Design, Cloud Computing",
        soft: "Inteligencia Emocional, Gestion de Tiempo, Habilidad de Negociacion, Profecionalidad y Actitud, Liderazgo, Colaborativo, Resolucion de problemas, Comunicacion"
      },

  });
});

module.exports = router;

app.js

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
var dataRouter = require('./routes/data');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', indexRouter);
app.use('/users', usersRouter);
app.use('/data', dataRouter);
var express = require('express');
var router = express.Router();

router.get('/', function(req, res, next){
    res.send({
        name: 'Andres armas',
        country: 'Peru',
        age: '22',
        sex: 'Male',
        profession: 'Developer'
    })
})

module.exports = router;
const express = require('express');
const app = express();

app.get('/', (req, res) => {
    res.json({
        name: "Carlos",
        lastname: "Sánchez",
        username: "carlosvldz",
        gender: "M",
        country: "Mexico"
    })
});

const server = app.listen(3000, function(){
    console.log(`Listening on https://localhost:${server.address().port}`);
});```

Mi pequeño aporte

const express = require('express');
const app = express();

const userInformatin = {
    name: "Michael Camelo",
    age: "30",
    Profesion: "Físico",
}

app.get('/', (request,response, next)=>{
    response.send(userInformatin);
});

const server = app.listen(8000, ()=>{
    console.log("Server listen at  ${server.address().port}");
})

Hola a todos! Les dejo mi solución al reto 😄

const express = require('express');
const app = express();

app.get('/', function(req, res, next) {
    res.send({ "name": "Edward", "last_name": "Fernandez", "age": 27, "eyes_color": "brown" })
});

const server = app.listen(8000, function() {
    console.log(`Listening to localhost:${server.address().port}`);
});

Acá el reto 😃
Screenshot from 2021-04-12 11-16-17.png

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var index = require('./routes/index');
var users = require('./routes/users');
var javier1nc = require('./routes/javier1nc');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', index);
app.use('/users', users);
app.use('/javier1nc', javier1nc);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handler
app.use(function(err, req, res, next) {
  // set locals, only providing error in development
  res.locals.message = err.message;
  res.locals.error = req.app.get('env') === 'development' ? err : {};

  // render the error page
  res.status(err.status || 500);
  res.render('error');
});

app.listen(process.env.PORT || 3000, () => console.log('Example app listening on port 3000!'));

module.exports = app;

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


me = {
    me: {
            name: 'Javier',
            user: 'javier1nc',
            email: '[email protected]'
        }
}


/* GET users listing. */
router.get('/', function(req, res, next) {
  res.send(me);
});

module.exports = router;

const express = require(‘express’);

const app = express();

app.set(‘port’, 3000);
app.set(‘name’, ‘Challenge’);

app.get(’/about’, (req, res) => {
res.send({
name: ‘arturo’,
age: ‘39’,
eyes: ‘two and brown’,
tall: ‘173cm’,
hair: 'black and almost bald '
})
})

app.listen(app.set(‘port’), () => {
console.log(Server of ${app.set('name')} is ready in port ${app.set('port')})
})

Mi código quedo asíCaptura de pantalla de 2021-01-19 15-03-39.png

Desarrollo

![](ab.PNG

Resultado

![](ab2.PNG

Recuerden moverse a la carpeta indicada, en este caso
curso de express>express-app-gen
y ejecuten este comando:
$env:DEBUG='express-app-gen:*'; npm start

Al final, entren al localhost 3000

Para algunos que estamos en linux y están teniendo con algunos paquetes desactualizados espero que estos comando les pueda servir
-Paso1: Primero listamos las paquetes
-> npm outdated
-Paso2: para actualizar todos los paquetes metemos el sgt comando
-> npm install -g npm-check-updates (en todo caso le paso la letra
"para que se actualice de forma global"
paso3: actualizamos con el sgt comando todas las dependecias
-> ncu -u
pas4: le pasamos update
-> npm update
paso5: por ultimo instalamos
-> npm install