NodeJs - Http y Express - primeros pasos - servicios y webs dinámicas
Tutorial para crear servicios con node de forma nativa y con express, Así como alojamiento de contenido estático y dinámico mediante handlebars.
Puedes ver los ejercicios de node en github.com/jolugama/nodejs-ejemplos
Inicio de proyecto
Creamos el package.json
$ npm init
Http
Para crear un servidor de forma nativa, sin instalar bibliotecas, se usa http.
const http = require('http');
http.createServer((req, res) => {
// 1. Podemos crear página web con un body que pone hola mundo
// res.write('Hola Mundo');
// 2. Podemos devolver un servicio
res.writeHead(200, {
'Content-Type': 'application/json'
});
const salida = {
status: 200,
data: {
name: 'Jose',
ciudad: 'Madrid',
sexo: 'v'
}
}
res.write(JSON.stringify(salida));
// siempre hay que teminar despues de usar write.
// Si no, se queda bloqueado.
res.end();
})
.listen(4444)
console.log('Escuchando el puerto 4444');
Express
Se define como un framework web minimalista para node. Con unas pocas lineas puedes crear un servicio. la diferencia en cuanto al uso de http de forma nativa de node es grande, ahorrándonos tiempo.
https://www.npmjs.com/package/express
Su instalación es sencilla:
$ npm install express --save
Servicio con respuesta Json
En este ejemplo tenemos 2 path:
- el primer path lanzamos una html con el body poniendo: 'hola mundo'.
- el segundo path devolvemos un json.
const express = require('express');
const app = express();
app.get('/datos1', (req, res) => {
res.send('Hola mundo');
})
app.get('/datos2', (req, res) => {
const salida = {handlebars
status: 200,handlebars
data: {handlebars
name: 'Jose',handlebars
ciudad: 'Madrid',handlebars
sexo: 'v'handlebars
}handlebars
}handlebars
res.send(salida);handlebars
})handlebars
handlebars
console.log('escuchando en el puerto 400handlebars0');
app.listen(4000);
Páginas estáticas
const express = require('express');
const app = express();
app.use(express.static(__dirname+'/public_html'));
console.log('escuchando en el puerto 4000');
app.listen(4000);
Si se accede a http://localhost:4000/ se visualiza el index.html que se aloja en la carpeta public_html. Si hay más páginas, estas deben indicarse junto con su extensión: http://localhost:4000/otra.html
Páginas dinámicas: handlebars
Motor de visualización de Express.js para handlebars.js. Su uso es sencillo y sirve para poder usar los templates que por ejemplo usa angular y angularjs, todo manejado desde node.
https://www.npmjs.com/package/hbs
$ npm install hbs --save
Ejecutamos de nuevo nodemon, esta vez queremos escuchar todas las extensiones hbs, css, html …
$ nodemon nombreDelArchivo -e js,hbs,html,css
const express = require('express');
const app = express();
const hbs = require('hbs');
// Exoress HBS engine
hbs.registerPartials(__dirname + '/views/shared');
app.set('view engine', 'hbs');
// de esta manera importamos todo el contenido de un js
require('./hbs/helpers');
// con path / cargamos index.hbs, lo renderizamos, y pasamos los datos name y mydate
app.get('/', (req, res) => {
res.render('index', {
name: 'jose luis garcía',
mydate: new Date().toDateString()
})
})
app.get('/about', (req, res) => {
res.render('otra', {
name: 'Jose Luis García',
mydate: new Date().toDateString()
})
})
console.log('escuchando en el puerto 4000');
app.listen(4000);
Del anterior código: require('./hbs/helpers'); Los helpers son datos que podemos pasar a cualquer path, de esta forma el código no se repite.
helpers.js
const hbs = require('hbs');
// helpers
hbs.registerHelper('getCiudad', () => {
return 'madrid';
})
hbs.registerHelper('capitalize', (txt) => {
return txt.charAt(0).toUpperCase() + txt.slice(1);
})
escríbe algo en comentarios 😉 Gracias.