Versión del GeoPortal para dispositivos móviles, se ve desde el navegador web inicialmente.
- nodejs (necesario instalar): con este lenguaje se hace el build del proyecto y el arranque de entorno de desarrollo. https://nodejs.org
- npm (necesario instalar): maneja las dependencias usadas en el proyecto. https://www.npmjs.com
- babel-loader: babel es un compilador de javascript que lee otros lenguajes para web y los compila en javascript que entiende el navegador web. Ejemplos de esos lenguajes son JSX, Next-JS, es2015, es2016, es2017, entre otros. https://github.com/babel/babel-loader
- babel-minify-webpack-plugin: permite minificar/minimizar el código compilado por babel. http://webpack.js.org/plugins/babel-minify-webpack-plugin
- css-loader: este loader de webpack permite leer archivos CSS y ponerlos en un único archivo CSS. https://www.npmjs.com/package/css-loader
- extract-text-webpack-plugin: este loader permite extraer el texto de ficheros que contentan texto. Se usa para extraer el texto CSS y concatenarlo en un único fichero. https://www.npmjs.com/package/extract-text-webpack-plugin
- file-loader: permite que cualquier recurso especificado, sea cargado desde el código javascript como un archivo, al momento del build se crean esto con nombres en código. https://www.npmjs.com/package/file-loader
- html-webpack-plugin: es un loader que permite extraer el texto de ficheros html, se usa para el index.html como plantilla. https://github.com/jantimon/html-webpack-plugin
- jshint: herramienta de análisis de código, permite detectar errores de sintáxis, lógica y estilo principalmente. http://jshint.com
- jshint-loader: el loader de jshint para webpack. https://github.com/webpack-contrib/jshint-loader
- url-loader: por ahora no se usa por problemas de rendimiento del JS compilado, pero se puede usar para codificar archivos en base64 y dárselos a los programas JS como URLs. Ejemplo, una imagen punto.png se convierte en la URL, "data:image/png;base64,iVBORw0KGgoAAA ANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4 //8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU 5ErkJggg==". https://www.npmjs.com/package/url-loader
- webpack: es el componente más importante del proyecto, es un constructor, qué permite cargar cualquier recurso usado para generar elementos estáticos de un sitio web. https://webpack.js.org/
- webpack-dev-server: componente de webpack para realizar el live-reload (al modificar un archivo, compila una versión del programa y recarga el navegador). https://webpack.js.org/configuration/dev-server https://github.com/webpack/webpack-dev-server
- chart.js: api escogida para realizar gráficas. http://chartjs.org
- color: biblioteca para la transformación de colores. https://www.npmjs.com/package/color
- jquery: nos permite manejar el dom de la aplicación. https://jquery.com
- materialize-css: la biblioteca de gráficos con diseño material (creado por google). http://materializecss.com https://material.io
- ol: biblioteca para el manejo del mapa. http://openlayers.org http://openlayers.org/en/latest/apidoc
- proj4: convierte entre coordenadas geográficas. Se usa para transformar las coordenadas de medios externos como shapefile a coordenadas del mapa para visualizarse correctamente. http://proj4js.org
- Clonar el proyecto.
git clone https://github.com/AgenciaImplementacion/mobile-geoportal- Instalar las dependencias.
cd mobile-geoportal
npm installnpm run liveCrear el bundle.
npm run buildAbrir el index.html para ver los resultados.
open index.html