• Ir al contenido principal
  • Skip to secondary menu
  • Ir a la barra lateral primaria
  • Ir al pie de página
  • Inicio
  • Secciones
    • Ciencia de datos
    • Criptografía
    • Herramientas
    • Noticias
    • Opinión
  • Programación
    • JavaScript
    • Julia
    • Matlab
    • Python
    • R
  • Boletín
  • Contacto
  • Acerca de Analytics Lane
  • Tienda
    • Libros
    • Equipamiento de oficina
    • Equipamiento en movilidad
    • Tiendas afiliadas
      • AliExpress
      • Amazon
      • GearBest
      • GeekBuying
      • JoyBuy

Analytics Lane

Ciencia e ingeniería de datos aplicada

  • Ciencia de datos
  • Criptografía
  • Python
  • Matlab
  • R
  • Julia
  • JavaScript
  • Herramientas
  • Opinión
  • Noticias

Creación de una librería JavaScript

febrero 8, 2019 Por Daniel Rodríguez 2 comentarios

JavaScript

Hoy comienza una serie de entradas en las que se explicará el proceso de creación de una librería JavaScript desde cero. Para lo que se utilizará el entorno de ejecución Node.js.

JavaScript es uno de los lenguajes más populares en la actualidad, debido a que se encuentra disponible en todos los navegadores. Por lo que no es de extrañar que existan múltiples librerías de Machine Learning JavaScript con las que es posible entrenar y ejecutar modelos. Este es el motivo de esta serie, explicar cómo crear una librería en JavaScript para poder distribuir los modelos para ser ejecutados en navegadores o entornos Node.

La serie consta de ocho entregas, publicándose una cada viernes a partir de hoy. En las entregas se verá cómo estructurar un proyecto en node, la creación de pruebas unitarias, medir el grado de cobertura de estas, auditar el código, la ejecución de scripts npm y la distribución del proyecto. Para seguir la serie solamente es necesario disponer de conocimientos básicos de JavaScript.

En esta primera entrega se verán los pasos básicos para la instalación de Node.js y la creación de un proyecto. Además de escribir las primeras funciones y ejecutar estas en el navegador.

Instalación de Node.js

Node.js es un entorno de ejecución JavaScript que funciona sin la necesidad de tener un navegador web. Basado en el motor V8 desarrollado por Google que es el utilizado en diferentes navegadores como es el caso de Chrome. La instalación de Node.js es tan sencilla como ir a la página web del proyecto, descargar el instalador para nuestro sistema operativo y ejecutar este.

Página web del proyecto Node.js
Página web del proyecto Node.js

Una vez finalizada la instalación de Node.js se puede abrir una terminal y comprobar la versión instalada. Esto se hace escribiendo en la terminal el comando node --version. En el caso de que todo esté correcto debería aparecer el número de versión. También se puede comprobar la versión de npm, el gestor de paquetes que utiliza Node.js, escribiendo el comando npm --version. Al igual que el caso anterior debería aparecer el número de versión.

Inicialización del proyecto

Tras la instalación de Node.js se puede crear una carpeta en la que se albergará el proyecto. En este tutorial llamaremos a la carpeta jslane. Desde la terminal y dentro de esta carpeta escribiremos el comando npm init. Es decir, en la terminal es necesario escribir los siguientes comandos:

$ mkdir jslane
$ cd jslane
$ npm init

Esto inicializará un asistente en el que se preguntará por los datos del proyecto. En esta ocasión simplemente se puede usar las respuestas por defecto del asistente. Una vez finalizado se creará un archivo JSON con los datos indicados al asistente.

{
  "name": "jslane",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

Primera función de la librería

Ahora que se ha creado el proyecto se puede comenzar a escribir el código JavaScript de la primera función. Un ejemplo típico es una función que escriba “Hello, World!” en la terminal del navegador.

El punto de inicio del proyecto, si no se ha seleccionado otra opción en el asistente, es el archivo index.js. Ahora con un editor de texto se creará este archivo con el siguiente código.

const hello = function () {
    console.log('Hello, World!');
};

module.exports = {hello: hello};

En este archivo se puede ver una función hello que imprime por la consola una cadena de texto. Posteriormente esta función de exporta para que pueda ser utilizada fuera del módulo. Para comprobar que el código funciona se puede creará un nuevo archivo run.js con las siguientes líneas.

const jslane = require('./index');

jslane.hello();

En la primera línea se importa la librería mientras que en la segunda se ejecuta la función creada anteriormente. Para comprobar su funcionamiento solamente es necesario escribir en la terminal node run.

$ node run
Hello, World!

Distribuir el trabajo

Para crear una librería que se pueda utilizar posteriormente en el navegador se va a utilizar Browserify. Browserify es una herramienta de código abierto de JavaScript que permite compilar los módulos Node.js en una archivo que posteriormente se puede importar en otro proyecto. La instalación se realiza desde la terminal con el comando:

sudo npm install browserify -g

La opción -g indica que el paquete se instalar de forma global en sistema, por lo que en sistemas UNIX es necesario utilizar sudo. En sistemas Windows el comando sudo se ha de omitir. Al instalarlo de forma global no es necesario volver a instalar la dependencia para cada proyecto. Ahora simplemente se puede compilar la librería escribiendo en la terminal

browserify index.js --standalone jslane -o ./dist/jslane.js

Este comando produce un archivo jslane.js en la carpeta dist del proyecto. Este archivo es el que después se puede utilizar en un navegador.

Como este comando se utiliza continuamente para compilar la librería es mejor guardarlo en el listado de scripts del archivo package.json. Agregando una nueva propiedad build a scripts con el comando anterior. Una vez hecho esto, se puede compilar con el comando

npm run build

Excluir dependencias del archivo final

Puede ser que en el proyecto se utilizan librerías globales que no han de ser incluidas en el archivo generado. Ya que estas se importarán por separado, como puede ser jquery. Browserify por defecto incluirá el código de estas, por lo que es necesario indicar que las ignore explícitamente. El modificador para ellos es --ignore seguido del nombre de nombre de la librería. Por ejemplo, en el caso de utilizar jquery es necesario escribir el siguiente comando

browserify index.js --standalone jslane --ignore workerpool -o ./dist/jslane.js

Ejecutar en el navegador

Una vez creado el archivo compilado se puede ejecutar el código en un navegador. Esto se puede comprobar utilizando el siguiente archivo HTLM.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <script src='./dist/jslane.js'></script>
	</head>
	<body>
        <script language="javascript">
            jslane.hello();
        </script>
	</body>
</html>

En un navegador se puede comprobar cómo este funciona perfectamente.

Resultado de la ejecución en el navegador
Resultado de la ejecución en el navegador

Conclusiones

En esta primera entrada se han visto los primeros pasos del proceso de creación de una librería JavaScript. En futuras entradas se verá cómo dividir el código diferentes módulos para facilitar el desarrollo.

Gracias por el tiempo dedicado a la lectura de esta entrada. En caso de estar interesado en seguir esta serie, además del resto de publicaciones, podéis suscribiros a la lista de correo, al canal de Telegram o seguir a Analytics Lane en las redes sociales.

Todo el código utilizado en esta serie se puede descargar en el siguiente repositorio.

Imágenes: Pixabay (skylarvision)

¿Te ha parecido de utilidad el contenido?

¡Puntúalo entre una y cinco estrellas!

Puntuación promedio 0 / 5. Votos emitidos: 0

Ya que has encontrado útil este contenido...

¡Síguenos en redes sociales!

¡Siento que este contenido no te haya sido útil!

¡Déjame mejorar este contenido!

Dime, ¿cómo puedo mejorar este contenido?

Contenido relacionado

Archivado en:JavaScript Etiquetado con:node

Interacciones con los lectores

Comentarios

  1. chaqui dice

    abril 27, 2020 en 11:02 pm

    tengo el siguiente error a la hora de querer importarlo en el archivo run.js
    SyntaxError: Cannot use import statement outside a module

    Responder
    • Daniel Rodríguez dice

      abril 28, 2020 en 8:58 am

      Entiendo que es al cargar en el navegador. El archivo run.js no se puede usar en el navegador ya que pertenece a un modulo, hay que importar el archivo compilado que se genera en la carpeta dist.

      Responder

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

I accept the Terms and Conditions and the Privacy Policy

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Publicidad


Barra lateral primaria

Suscríbete a nuestro boletín

Suscríbete al boletín semanal para estar al día de todas las publicaciones.

Política de Privacidad

¡Síguenos en redes sociales!

  • facebook
  • github
  • telegram
  • pinterest
  • rss
  • tumblr
  • twitter
  • youtube

Publicidad

Tiendas afiliadas

Ayúdanos realizando tus compras sin coste adicional con los enlaces de la tienda. ¡Gracias!

Entradas recientes

Usar dispositivos USB en VirtualBox

enero 15, 2021 Por Daniel Rodríguez Dejar un comentario

Eliminar elementos en matrices de Matlab

enero 13, 2021 Por Daniel Rodríguez Dejar un comentario

NumPy

NumPy: Crear matrices vacías en NumPy y adjuntar filas o columnas

enero 11, 2021 Por Daniel Rodríguez Dejar un comentario

Publicidad

Es tendencia

  • Operaciones de filtrado de DataFrame con Pandas en base a los valores de las columnas bajo Python
  • Seleccionar filas y columnas en Pandas con iloc y loc bajo Python
  • Unir y combinar dataframes con pandas en Python bajo Python
  • ¿Cómo eliminar columnas y filas en un dataframe pandas? bajo Python
  • Excel en Python Guardar y leer archivos Excel en Python bajo Python

Publicidad

Lo mejor valorado

5 (3)

Ordenar una matriz en Matlab en base a una fila o columna

5 (3)

Automatizar el análisis de datos con Pandas-Profiling

5 (5)

Diferencias entre var y let en JavaScript

5 (6)

Operaciones de filtrado de DataFrame con Pandas en base a los valores de las columnas

5 (3)

Unir y combinar dataframes con pandas en Python

Publicidad

Comentarios recientes

  • Daniel Rodríguez en Calculadora de probabilidades de ganar a la lotería
  • abel en Calculadora de probabilidades de ganar a la lotería
  • David Arias en Diferencias entre regresión y clasificación en aprendizaje automático
  • Juan Aguilar en Archivos JSON con Python: lectura y escritura
  • Camilo en Contar palabras en una celda Excel

Publicidad

Footer

Secciones

  • Ciencia de datos
  • Criptografía
  • Herramientas
  • Noticias
  • Opinión

Programación

  • JavaScript
  • Julia
  • Matlab
  • Python
  • R

Analytics Lane

  • Acerca de Analytics Lane
  • Boletín de noticias
  • Contacto
  • Lo más popular
  • Tienda

Tiendas Afiliadas

  • AliExpress
  • Amazon
  • BangGood
  • GearBest
  • Geekbuying
  • JoyBuy

Sobre de Analytics Lane

En Analytics Lane tratamos de explicar los principales conceptos de la ciencia e ingeniería de datos con un enfoque práctico. Los principales temas tratados son ciencia de datos, ingeniería de datos, inteligencia artificial, machine learning, deep learning y criptografía. Además, también se habla de los principales lenguajes de programación y herramientas utilizadas por los científicos e ingenieros de datos.

Tiendas afiliadas

Ayúdanos realizando tus compras sin coste adicional con los enlaces de la tienda. ¡Gracias!

Amazon

2018-2020 Analytics Lane · Términos y condiciones · Política de Cookies · Política de Privacidad · Herramientas de privacidad · Contacto