Capítulo 11: JavaScript y el Servidor
Ejercicios Prácticos para el Capítulo 11: JavaScript y el Servidor
Estos ejercicios prácticos están diseñados para reforzar tu comprensión de los conceptos discutidos en el Capítulo 11, enfocándose en Node.js, la construcción de APIs REST con Express, y la implementación de comunicación en tiempo real usando WebSockets. Al completar estos ejercicios, ganarás experiencia práctica con JavaScript del lado del servidor, mejorando tu capacidad para desarrollar aplicaciones web dinámicas e interactivas.
Ejercicio 1: Servidor Node.js Básico
Objetivo: Crear un servidor Node.js simple que responda con "¡Hola, Node.js!" para cualquier solicitud.
Solución:
// Create a file named server.js
const http = require('http');
const server = http.createServer((req, res) => {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');
res.end('Hello, Node.js!');
});
const port = 3000;
server.listen(port, () => {
console.log(`Server running at <http://localhost>:${port}/`);
});Ejecuta este servidor con node server.js y navega a http://localhost:3000 en tu navegador para ver la respuesta.
Ejercicio 2: Construyendo una API REST Simple con Express
Objetivo: Crear una aplicación Express que gestione una lista de tareas, soportando operaciones para crear, leer, actualizar y eliminar tareas.
Solución:
const express = require('express');
const app = express();
app.use(express.json()); // Middleware to parse JSON bodies
let tasks = [{ id: 1, task: 'Do laundry' }, { id: 2, task: 'Write code' }];
app.get('/tasks', (req, res) => {
res.status(200).json(tasks);
});
app.post('/tasks', (req, res) => {
const newTask = { id: tasks.length + 1, task: req.body.task };
tasks.push(newTask);
res.status(201).json(newTask);
});
app.put('/tasks/:id', (req, res) => {
let task = tasks.find(t => t.id === parseInt(req.params.id));
if (!task) res.status(404).send('Task not found');
else {
task.task = req.body.task;
res.status(200).json(task);
}
});
app.delete('/tasks/:id', (req, res) => {
tasks = tasks.filter(t => t.id !== parseInt(req.params.id));
res.status(204).send();
});
const port = 3000;
app.listen(port, () => {
console.log(`Server running on <http://localhost>:${port}`);
});Ejercicio 3: Aplicación de Chat en Tiempo Real con WebSockets
Objetivo: Implementar una aplicación de chat simple en tiempo real utilizando WebSockets.
Solución:
// Server setup (server.js)
const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log('received: %s', message);
wss.clients.forEach(function each(client) {
if (client !== ws && client.readyState === WebSocket.OPEN) {
client.send(message);
}
});
});
});HTML del Cliente (index.html):
<!DOCTYPE html>
<html>
<head>
<title>WebSocket Chat</title>
</head>
<body>
<textarea id="messages" cols="30" rows="10" readonly></textarea><br>
<input type="text" id="messageBox" autocomplete="off"><button onclick="sendMessage()">Send</button>
<script>
const ws = new WebSocket('ws://localhost:8080');
const messages = document.getElementById('messages');
ws.onmessage = function (event) {
messages.value += event.data + '\\n';
};
function sendMessage() {
const messageBox = document.getElementById('messageBox');
ws.send(messageBox.value);
messageBox.value = '';
}
</script>
</body>
</html>Estos ejercicios ofrecen una forma práctica de aplicar las habilidades de JavaScript del lado del servidor que has aprendido en este capítulo. Desde configurar servidores básicos y crear servicios RESTful hasta implementar sistemas sofisticados de comunicación en tiempo real, ahora tienes las herramientas para construir aplicaciones web robustas, eficientes e interactivas.
Ejercicios Prácticos para el Capítulo 11: JavaScript y el Servidor
Estos ejercicios prácticos están diseñados para reforzar tu comprensión de los conceptos discutidos en el Capítulo 11, enfocándose en Node.js, la construcción de APIs REST con Express, y la implementación de comunicación en tiempo real usando WebSockets. Al completar estos ejercicios, ganarás experiencia práctica con JavaScript del lado del servidor, mejorando tu capacidad para desarrollar aplicaciones web dinámicas e interactivas.
Ejercicio 1: Servidor Node.js Básico
Objetivo: Crear un servidor Node.js simple que responda con "¡Hola, Node.js!" para cualquier solicitud.
Solución:
// Create a file named server.js
const http = require('http');
const server = http.createServer((req, res) => {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');
res.end('Hello, Node.js!');
});
const port = 3000;
server.listen(port, () => {
console.log(`Server running at <http://localhost>:${port}/`);
});Ejecuta este servidor con node server.js y navega a http://localhost:3000 en tu navegador para ver la respuesta.
Ejercicio 2: Construyendo una API REST Simple con Express
Objetivo: Crear una aplicación Express que gestione una lista de tareas, soportando operaciones para crear, leer, actualizar y eliminar tareas.
Solución:
const express = require('express');
const app = express();
app.use(express.json()); // Middleware to parse JSON bodies
let tasks = [{ id: 1, task: 'Do laundry' }, { id: 2, task: 'Write code' }];
app.get('/tasks', (req, res) => {
res.status(200).json(tasks);
});
app.post('/tasks', (req, res) => {
const newTask = { id: tasks.length + 1, task: req.body.task };
tasks.push(newTask);
res.status(201).json(newTask);
});
app.put('/tasks/:id', (req, res) => {
let task = tasks.find(t => t.id === parseInt(req.params.id));
if (!task) res.status(404).send('Task not found');
else {
task.task = req.body.task;
res.status(200).json(task);
}
});
app.delete('/tasks/:id', (req, res) => {
tasks = tasks.filter(t => t.id !== parseInt(req.params.id));
res.status(204).send();
});
const port = 3000;
app.listen(port, () => {
console.log(`Server running on <http://localhost>:${port}`);
});Ejercicio 3: Aplicación de Chat en Tiempo Real con WebSockets
Objetivo: Implementar una aplicación de chat simple en tiempo real utilizando WebSockets.
Solución:
// Server setup (server.js)
const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log('received: %s', message);
wss.clients.forEach(function each(client) {
if (client !== ws && client.readyState === WebSocket.OPEN) {
client.send(message);
}
});
});
});HTML del Cliente (index.html):
<!DOCTYPE html>
<html>
<head>
<title>WebSocket Chat</title>
</head>
<body>
<textarea id="messages" cols="30" rows="10" readonly></textarea><br>
<input type="text" id="messageBox" autocomplete="off"><button onclick="sendMessage()">Send</button>
<script>
const ws = new WebSocket('ws://localhost:8080');
const messages = document.getElementById('messages');
ws.onmessage = function (event) {
messages.value += event.data + '\\n';
};
function sendMessage() {
const messageBox = document.getElementById('messageBox');
ws.send(messageBox.value);
messageBox.value = '';
}
</script>
</body>
</html>Estos ejercicios ofrecen una forma práctica de aplicar las habilidades de JavaScript del lado del servidor que has aprendido en este capítulo. Desde configurar servidores básicos y crear servicios RESTful hasta implementar sistemas sofisticados de comunicación en tiempo real, ahora tienes las herramientas para construir aplicaciones web robustas, eficientes e interactivas.
Ejercicios Prácticos para el Capítulo 11: JavaScript y el Servidor
Estos ejercicios prácticos están diseñados para reforzar tu comprensión de los conceptos discutidos en el Capítulo 11, enfocándose en Node.js, la construcción de APIs REST con Express, y la implementación de comunicación en tiempo real usando WebSockets. Al completar estos ejercicios, ganarás experiencia práctica con JavaScript del lado del servidor, mejorando tu capacidad para desarrollar aplicaciones web dinámicas e interactivas.
Ejercicio 1: Servidor Node.js Básico
Objetivo: Crear un servidor Node.js simple que responda con "¡Hola, Node.js!" para cualquier solicitud.
Solución:
// Create a file named server.js
const http = require('http');
const server = http.createServer((req, res) => {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');
res.end('Hello, Node.js!');
});
const port = 3000;
server.listen(port, () => {
console.log(`Server running at <http://localhost>:${port}/`);
});Ejecuta este servidor con node server.js y navega a http://localhost:3000 en tu navegador para ver la respuesta.
Ejercicio 2: Construyendo una API REST Simple con Express
Objetivo: Crear una aplicación Express que gestione una lista de tareas, soportando operaciones para crear, leer, actualizar y eliminar tareas.
Solución:
const express = require('express');
const app = express();
app.use(express.json()); // Middleware to parse JSON bodies
let tasks = [{ id: 1, task: 'Do laundry' }, { id: 2, task: 'Write code' }];
app.get('/tasks', (req, res) => {
res.status(200).json(tasks);
});
app.post('/tasks', (req, res) => {
const newTask = { id: tasks.length + 1, task: req.body.task };
tasks.push(newTask);
res.status(201).json(newTask);
});
app.put('/tasks/:id', (req, res) => {
let task = tasks.find(t => t.id === parseInt(req.params.id));
if (!task) res.status(404).send('Task not found');
else {
task.task = req.body.task;
res.status(200).json(task);
}
});
app.delete('/tasks/:id', (req, res) => {
tasks = tasks.filter(t => t.id !== parseInt(req.params.id));
res.status(204).send();
});
const port = 3000;
app.listen(port, () => {
console.log(`Server running on <http://localhost>:${port}`);
});Ejercicio 3: Aplicación de Chat en Tiempo Real con WebSockets
Objetivo: Implementar una aplicación de chat simple en tiempo real utilizando WebSockets.
Solución:
// Server setup (server.js)
const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log('received: %s', message);
wss.clients.forEach(function each(client) {
if (client !== ws && client.readyState === WebSocket.OPEN) {
client.send(message);
}
});
});
});HTML del Cliente (index.html):
<!DOCTYPE html>
<html>
<head>
<title>WebSocket Chat</title>
</head>
<body>
<textarea id="messages" cols="30" rows="10" readonly></textarea><br>
<input type="text" id="messageBox" autocomplete="off"><button onclick="sendMessage()">Send</button>
<script>
const ws = new WebSocket('ws://localhost:8080');
const messages = document.getElementById('messages');
ws.onmessage = function (event) {
messages.value += event.data + '\\n';
};
function sendMessage() {
const messageBox = document.getElementById('messageBox');
ws.send(messageBox.value);
messageBox.value = '';
}
</script>
</body>
</html>Estos ejercicios ofrecen una forma práctica de aplicar las habilidades de JavaScript del lado del servidor que has aprendido en este capítulo. Desde configurar servidores básicos y crear servicios RESTful hasta implementar sistemas sofisticados de comunicación en tiempo real, ahora tienes las herramientas para construir aplicaciones web robustas, eficientes e interactivas.
Ejercicios Prácticos para el Capítulo 11: JavaScript y el Servidor
Estos ejercicios prácticos están diseñados para reforzar tu comprensión de los conceptos discutidos en el Capítulo 11, enfocándose en Node.js, la construcción de APIs REST con Express, y la implementación de comunicación en tiempo real usando WebSockets. Al completar estos ejercicios, ganarás experiencia práctica con JavaScript del lado del servidor, mejorando tu capacidad para desarrollar aplicaciones web dinámicas e interactivas.
Ejercicio 1: Servidor Node.js Básico
Objetivo: Crear un servidor Node.js simple que responda con "¡Hola, Node.js!" para cualquier solicitud.
Solución:
// Create a file named server.js
const http = require('http');
const server = http.createServer((req, res) => {
res.statusCode = 200;
res.setHeader('Content-Type', 'text/plain');
res.end('Hello, Node.js!');
});
const port = 3000;
server.listen(port, () => {
console.log(`Server running at <http://localhost>:${port}/`);
});Ejecuta este servidor con node server.js y navega a http://localhost:3000 en tu navegador para ver la respuesta.
Ejercicio 2: Construyendo una API REST Simple con Express
Objetivo: Crear una aplicación Express que gestione una lista de tareas, soportando operaciones para crear, leer, actualizar y eliminar tareas.
Solución:
const express = require('express');
const app = express();
app.use(express.json()); // Middleware to parse JSON bodies
let tasks = [{ id: 1, task: 'Do laundry' }, { id: 2, task: 'Write code' }];
app.get('/tasks', (req, res) => {
res.status(200).json(tasks);
});
app.post('/tasks', (req, res) => {
const newTask = { id: tasks.length + 1, task: req.body.task };
tasks.push(newTask);
res.status(201).json(newTask);
});
app.put('/tasks/:id', (req, res) => {
let task = tasks.find(t => t.id === parseInt(req.params.id));
if (!task) res.status(404).send('Task not found');
else {
task.task = req.body.task;
res.status(200).json(task);
}
});
app.delete('/tasks/:id', (req, res) => {
tasks = tasks.filter(t => t.id !== parseInt(req.params.id));
res.status(204).send();
});
const port = 3000;
app.listen(port, () => {
console.log(`Server running on <http://localhost>:${port}`);
});Ejercicio 3: Aplicación de Chat en Tiempo Real con WebSockets
Objetivo: Implementar una aplicación de chat simple en tiempo real utilizando WebSockets.
Solución:
// Server setup (server.js)
const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', function connection(ws) {
ws.on('message', function incoming(message) {
console.log('received: %s', message);
wss.clients.forEach(function each(client) {
if (client !== ws && client.readyState === WebSocket.OPEN) {
client.send(message);
}
});
});
});HTML del Cliente (index.html):
<!DOCTYPE html>
<html>
<head>
<title>WebSocket Chat</title>
</head>
<body>
<textarea id="messages" cols="30" rows="10" readonly></textarea><br>
<input type="text" id="messageBox" autocomplete="off"><button onclick="sendMessage()">Send</button>
<script>
const ws = new WebSocket('ws://localhost:8080');
const messages = document.getElementById('messages');
ws.onmessage = function (event) {
messages.value += event.data + '\\n';
};
function sendMessage() {
const messageBox = document.getElementById('messageBox');
ws.send(messageBox.value);
messageBox.value = '';
}
</script>
</body>
</html>Estos ejercicios ofrecen una forma práctica de aplicar las habilidades de JavaScript del lado del servidor que has aprendido en este capítulo. Desde configurar servidores básicos y crear servicios RESTful hasta implementar sistemas sofisticados de comunicación en tiempo real, ahora tienes las herramientas para construir aplicaciones web robustas, eficientes e interactivas.