Como Crear un CRUD con Node JS 16.6.2 y Bootstrap 5 – Parte 1

Node JS Tutoriales | | Comunidad: Crear un Post, Eventos Devs, Foro

Node JS es una de las tecnologías más dinámicas en el mundo del desarrollo de software, nos permite crear proyectos que pueden hacerse escalables con el tiempo, asimismo podemos hacer uso de diferentes paquetes NPM para añadir determinadas características o funcionalidades a nuestros proyectos. Algo importante que mencionar es la velocidad con la que funcionan los proyectos creados con Node JS y para verificar esto, vamos a crear un sistema CRUD con Node JS, MySQL y Bootstrap, vamos con ello.


Antes de continuar con este Post, te invito a leer los siguientes artículos:

Asimismo, te invito a escuchar el Podcast: “Razones Por Las Cuales Te Cuesta Aprender A Programar”:

Spotify: Sound Cloud: Apple Podcasts

Bien ahora continuemos con el Post: Como Crear un CRUD con Node JS 16.6.2 y Bootstrap 5 – Parte 1.

Nuevo Proyecto

Para el proyecto tengo que crear un nuevo directorio, yo le pondré de nombre crud-nodejs-16-6-2-bootstrap-5 y dentro de este directorio abro mi consola de comandos y ejecuto el siguiente comando para crear un nuevo proyecto con Node JS:

1
2
# Comando para crear un nuevo proyecto en Node JS
npm init

Luego de ejecutar el comando anterior, Node JS me lanzará en la consola, una serie de preguntas para el proyecto que deseo crear. Tras responder todas las preguntas, al final se me debe crear mi archivo llamado package.json con los siguiente datos que yo le he brindado.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
{
  "name": "crud-nodejs-16-6-2-bootstrap-5",
  "version": "1.0.0",
  "description": "Como Crear un CRUD con Node JS 16.6.2 y Bootstrap 5",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "crud",
    "node",
    "js"
  ],
  "author": "Nube Colectiva",
  "license": "ISC"
}

Entonces mi directorio crud-nodejs-16-6-2-bootstrap-5 debe contener en su interior un archivo llamado package.json con los datos de las preguntas que respondí cuando la consola me pregunto.

1
2
/crud-nodejs-16-6-2-bootstrap-5
├── package.json // Se me ha creado este Archivo

Parece que nuestro proyecto se ha creado correctamente, pero siempre es bueno verificar si es así. Para esto vamos a crear un servidor básico inicial en Node JS, para probar que todo este funcionando bien.

Dentro del directorio de mi proyecto llamado crud-nodejs-16-6-2-bootstrap-5 creo un archivo llamado app.js:

1
2
3
/crud-nodejs-16-6-2-bootstrap-5
├── app.js // Creo este Archivo
├── package.json

Abro el archivo apps.js y dentro de el voy a crear un servidor que muestre un simple mensaje que diga Hola Mundo ! y usaré el puerto 3000 para este servidor:

1
2
3
4
5
6
7
8
9
10
11
12
13
var http = require('http');
var server = http.createServer();
function Servidor(petic, resp) {
resp.writeHead(200, {'content-type': 'text/plain'});
resp.write('Hola Mundo !');
resp.end();
}
server.on('request', Servidor);
server.listen(3000, function () {
   console.log('La Aplicación está funcionando en el puerto 3000');
});

Ahora en mi consola ejecuto el siguiente comando para iniciar el servidor:

1
2
3
4
# Comando para iniciar mi servidor en Node JS
node app
 
La Aplicación está funcionando en el puerto 3000

Si voy al navegador y abro la ruta http://localhost:3000/ debería de ver el mensaje sin problemas:

Con ello he verificado que mi proyecto se ha creado correctamente y ya puedo comenzar a desarrollar el sistema CRUD.

Bien con esto entonces terminamos de crear el proyecto con Node JS para nuestro sistema CRUD y verificamos que este funcione bien.

Ten Paciencia, lo que quiero es que conozcas bien como se crea este proyecto y no llenarte el capitulo de mucho contenido porque te puedes marear y no tendrás un óptimo aprendizaje. 

Nota (s)

  • En la siguiente parte vamos a configurar la base de datos.
  • No olvides que debemos usar la Tecnología para hacer cosas Buenas por el Mundo. 

Síguenos en nuestras Redes Sociales para que no te pierdas nuestros próximos contenidos.

Newsletter

Suscríbete a Nuestro Boletín de Novedades:

(Luego de la suscripción no te va salir ningun mensaje. Solo revisa tu bandeja de Correo para confirmar tu suscripción)
* indicates required

Artículos Relacionados

Subscribirse
Notificar a
guest
0 Comments
Inline Feedbacks
View all comments