El punto de entrada — JS: Configuración del entorno

• ¿Cómo luce el punto de entrada en una aplicación?
  • ¿Qué pasa si ejecutamos esto?
• ¿Y qué pasa con las bibliotecas?
• Proyecto que es aplicación y también biblioteca
  • Versión solo como aplicación
  • Mejorando el proyecto: aplicación + biblioteca

Cuando comenzamos a crear un proyecto en JavaScript, ya sea una aplicación o una biblioteca, necesitamos saber por dónde empieza todo. Ese primer archivo que se ejecuta es lo que llamamos el punto de entrada (en inglés, entry point).

Para entenderlo mejor, pensemos en una aplicación como una obra de teatro. El punto de entrada sería la primera escena: la que da inicio a todo lo que viene después. Sin esa primera escena, los actores no sabrían qué hacer.

¿Cómo luce el punto de entrada en una aplicación?

A veces nuestros proyectos tienen muchos archivos, pero siempre hay uno que se encarga de poner todo en marcha. Veamos un ejemplo sencillo:

Estructura del proyecto

.
├── index.js
├── package.json
└── src
    └── my-application
        └── index.js

Archivos involucrados

// src/my-application/index.js
export  default () =>  console.log('¡Bienvenido a mi aplicación!');

Este archivo define una función. Lo único que hace es mostrar un mensaje en la consola.

// index.js
import  app  from  './src/my-application/index.js';
app(); // Ejecutamos la función

Este segundo archivo es nuestro punto de entrada. Importa el archivo anterior y lo ejecuta.

¿Qué pasa si ejecutamos esto?

Si abrimos una terminal y escribimos:

node  index.js

Veremos en la consola:

¡Bienvenido a mi aplicación!

En este proyecto, index.js es claramente el punto de entrada. Es donde empieza todo.

¿Y qué pasa con las bibliotecas?

En las bibliotecas, el uso del punto de entrada es distinto. No se ejecuta automáticamente como en una aplicación. En lugar de eso, las bibliotecas contienen funciones listas para ser usadas cuando las necesitemos.

Por ejemplo, Lodash es una biblioteca que tiene muchas funciones útiles. Supongamos que solo queremos una:

import { random } from  'lodash';
console.log(random(0, 5)); // Un número aleatorio entre 0 y 5

Aquí usamos solo una función, pero no indicamos ningún archivo específico. Node.js sabe dónde buscar porque cada biblioteca define su punto de entrada en el archivo package.json.

Revisemos un package.json básico:

La propiedad "main" le dice a Node.js qué archivo exporta la funcionalidad principal de la biblioteca.

Así, cuando alguien instala tu paquete, puede acceder a sus funciones sin preocuparse por la ruta exacta del archivo.

Proyecto que es aplicación y también biblioteca

Veamos un ejemplo con algo práctico. Imaginemos que queremos crear una herramienta para calcular el año de nacimiento según la edad.

Versión solo como aplicación

// index.js
console.log('¿Cuántos años tienes?');
const  age = 18; // Supongamos que esta es la edad ingresada
const  birthYear = 2005; // Año calculado manualmente
console.log(`Tu año de nacimiento: ${birthYear}`);

Funciona, pero no es flexible. Si queremos reutilizar la fórmula en otra parte, sería mejor tenerla en una función separada.

Mejorando el proyecto: aplicación + biblioteca

Vamos a mover la lógica a un archivo independiente:

// src/index.js
export  default  function  getBirthYear(age) {
return  new  Date().getFullYear() - age; // Resta para calcular el año
}

// index.js
import  getBirthYear  from  './src/index.js';
console.log('¿Cuántos años tienes?');
const  age = 18;
const  birthYear = getBirthYear(age);
console.log(`Tu año de nacimiento: ${birthYear}`);

Ahora tenemos dos archivos: uno que contiene la lógica y otro que actúa como punto de entrada para la aplicación.

Además, si en package.json definimos:

Hacemos que el archivo src/index.js también sea el punto de entrada de la biblioteca. Esto significa que otros proyectos podrían importar nuestra función fácilmente.

// En otro proyecto
import  getBirthYear  from  'calculador-edad';
console.log(getBirthYear(30)); // 1994 (por ejemplo)

Trabajo independiente

// ❌ Mala práctica: importa toda la librería
import _ from "lodash";

// ✅ Mejor: importa solo lo que necesitas
import { debounce } from "lodash";

mkdir -p src
mv index.js src/

export function miFuncion() {
  console.log("Hola desde codica-js");
}

import { miFuncion } from "./src/index.js";
miFuncion();

git add .
git commit -m "Refactor: mover lógica a src y optimizar importaciones"
git push origin main