npm package: @hcd-bsas/escaner-client
Description: ## Estructura del proyecto
Latest version: 0.0.8


# Cliente Js para HCDEscaner Tool

## Estructura del proyecto

El archivo index por donde comienza webpack es **HCDEscanerClient.js** el cual hace uso de una librería externa llamada [magic-methods](https://gist.github.com/loilo/4d385d64e2b8552dcc12a0f5126b6df8) la cual provee una funcionalidad similar a los métodos mágicos de PHP para javascript. Esto es utilizado para poder pivotar entre las posibles versiones que puedan existir del proyecto **Electron App**. 

Primero lo que hace es abrir la App **HCDEscaner Tool** y consultar el número de versión de la aplicación localmente instalada. A partir de ahi crear la instancia para la clase que corresponda, en donde se encuentra implementada la funcionalidad concreta para esa versión. Dado que el Cliente se encuentra directamente relacionado con los endpoint REST que exponga la aplicación.

Estas versiones se encuentran listadas con el nombre **HCDEscanerClient@0.0.0.js** y todas heredan de la clase **HCDEscanerParent.js** que tiene toda la funcionalidad común entre versiones.

## Pre-requisitos

### Es necesario tener instalado

* [Node Js LTS](https://nodejs.org/en/) La versión utilizada para el primer desarrollo fue 16.14.0 LTS.
* [yarn](https://yarnpkg.com/) 

    ~~~ 
    npm install -g yarn
    ~~~

### Recomendaciones opcionales para instalar

* [Visual Studio Code](https://code.visualstudio.com/)
* [CMDER](https://github.com/cmderdev/cmder) es una consola de comandos sencilla con algunas sintaxis linux

## Instalación

El proyecto javascript esta armado con [webpack](https://webpack.js.org/concepts/) y algunas librerías adicionales. 

Su instalación es sencilla ejecutando en la raíz del directorio el comando **install** que agregara todas las dependencias necesarias:

~~~
    yarn install
~~~

## Compilación desarrollo

El comando **serve** compila el proyecto sin comprimirlo y activa la opción [watch](https://webpack.js.org/configuration/watch/) que permite a webpack observar los archivos y recompilarlos si cambian.

~~~
    yarn serve
~~~

Este archivo compilado se encontrara en el directorio **dist** y se puede probar haciendo uso del **test_app.html** que se encuentra en la raíz y se puede abrir con cualquier navegador web.

## Compilación productiva y publicación en NPM

### Compilación producción

El comando **build** compila el proyecto comprimido para luego poder ser distribuido.

~~~
    yarn build
~~~

### Publicación NPM

Posteriormente para poder publicar la librería en [NPM](https://www.npmjs.com/) se debe:

1) Tener un usuario registrado. [Ir al registro...](https://www.npmjs.com/signup)

2) Acceder a la cuenta de NPM de la HDC desde el navegador  y agregar como administrador al usuario registrado en la librería **escaner-client** dentro de la organización **@hcd-bsas**. Credenciales: 
    > Usuario: desarrollohcd

    > Contraseña:  "la misma que se utiliza en el correo hcddesarrolladoras@gmail.com"

3) Autenticar con el usuario registrado en el paso 1 desde la linea de comandos

~~~
    yarn login
~~~

4) Asegurase de previamente haber compilado la librería en modo producción (comando **build**).

5) Publicar librería con el comando **publish**, el cual preguntara cual es el número de la nueva versión. En donde "version": *.*.* --> El primer número corresponde a cambios grandes, el segundo nuevas funcionalidades y el tercero corrección de errores o cambios menores.

~~~
    yarn publish
~~~

Nota: En ocasiones da error al no poder cambiar la versión de la librería desde la linea de comandos. Para ello se debe aumentar el número de versión en la opción **version** del package.json

### Como hacer uso de la librería con NPM

Como se menciono anteriormente hay un ejemplo en test_app.html de como utilizar la clase y sus métodos:

* getPdf()
* getImage()
* getArrayOfImages()

Pero para poder instalar la librería en cualquier otro proyecto se debe correr el comando en el directorio donde el proyecto contenga las librerías javascript.

~~~
    yarn add @hcd-bsas/escaner-client
~~~

Y luego es posible importar el archivo .js en donde se necesite desde la carpeta node_modules que creara el comando anterior. Por ejemplo:

~~~
    <script src="../node_modules/@hcd-bsas/escaner-client/dist/HCDEscanerClient.min.js"></script>
    
~~~