Copyright © SNGULAR. All rights reserved. 1 Copyright © SNGULAR. All rights reserved. ¿Necesitas una aplicación web para la Industria 4.0? Entonces Angular es tu Framework Azahara Fernández Guizán Juan Manuel Rodríguez Pérez JsDayCan2023 

Copyright © SNGULAR. All rights reserved. 2 ¿Quienes somos? @azahara_fergui @juan_manuel_rp 

Copyright © SNGULAR. All rights reserved. 3 Copyright © SNGULAR. All rights reserved. Agenda: ¿Qué nos hemos encontrado en Industria? ¿Por qué usamos Angular? Principales hitos que resolvimos. 

Copyright © SNGULAR. All rights reserved. 4 Copyright © SNGULAR. All rights reserved. SNGULAR case studies ¿Qué nos hemos encontrado en Industria? 

Copyright © SNGULAR. All rights reserved. 5 Peculiaridades ❖ Conexiones con las máquinas ❖ Procedimientos análogicos ❖ Silos de conocimiento ❖ Menos espacio, mejor ❖ Bajo coste 

Copyright © SNGULAR. All rights reserved. 6 Entornos tecnológicos ❖ ERPs obsoletos ❖ Servidores con escaso mantenimiento ❖ On Premise y Cloud ❖ Variedad de bases de datos ❖ Software de las máquinas 

Copyright © SNGULAR. All rights reserved. 7 Requerimientos habituales ❖ Obtención de datos de las máquinas. ❖ Control de flujos de trabajo. ❖ Control de calidad. ❖ OEE ❖ Estado en tiempo real ❖ Generación de informes ❖ Planificación del trabajo 

Copyright © SNGULAR. All rights reserved. 8 Copyright © SNGULAR. All rights reserved. SNGULAR case studies ¿Por qué usamos Angular? 

Copyright © SNGULAR. All rights reserved. 9 Comparativa entre Frameworks 

Copyright © SNGULAR. All rights reserved. 10 Otras consideraciones ❖ Stack tecnológico del equipo ❖ Mantenimiento (robustez y durabilidad) ❖ Manejo datos en tiempo real ❖ Escabilidad 

Copyright © SNGULAR. All rights reserved. 11 Copyright © SNGULAR. All rights reserved. SNGULAR case studies Principales hitos que resolvimos 

Copyright © SNGULAR. All rights reserved. 12 Visualización de datos: Mapas. 

Copyright © SNGULAR. All rights reserved. 13 Visualización de datos: Mapas. 

Copyright © SNGULAR. All rights reserved. 14 Visualización de datos: Gráficas. 

Copyright © SNGULAR. All rights reserved. 15 Visualización de datos: Gráficas. 

Copyright © SNGULAR. All rights reserved. 16 Visualización de datos: Tablas. DataTable Tablas JExcel 

Copyright © SNGULAR. All rights reserved. 17 Control de calidad y tiempos ❖ Generación y visualización de Informes (pdf, csv, xls) ❖ Planificador de turnos (máquinas, turnos, operarios/as) 

Copyright © SNGULAR. All rights reserved. 18 Datos en tiempo real (Conexión con máquinas). ❖ Conexión directa mediante PLCs Máquina PLC DDBB API 

Copyright © SNGULAR. All rights reserved. 19 Datos en tiempo real (Conexión con máquinas). ❖ Conexión Remota (MQTT) MQTT Receptores Emisor 

Copyright © SNGULAR. All rights reserved. 20 Bibliografía Angular web: https://angular.io/ Angular cli: https://angular.io/cli Web Typescript: https://www.typescriptlang.org/ jspreadsheet ce v4.0 bossanova: https://bossanova.uk/jspreadsheet/v4/ chart.js: https://www.chartjs.org/ DataTables.net (use jquery): https://datatables.net/ ag-grid: https://www.ag-grid.com/ threejs.org: https://threejs.org/ Three.js github: https://github.com/mrdoob/three.js/tree/master Leaflet web: https://leafletjs.com/index.html Leaflet github: https://github.com/Leaflet/Leaflet Signal R: https://www.npmjs.com/package/@microsoft/signalr 

Copyright © SNGULAR. All rights reserved. 21 Bibliografía Utilizadas para estudio frameworks https://www.simform.com/blog/angular-vs-vue https://dev.to/josunlp/angular-vs-vue-again-315a https://www.emizentech.com/blog/vue-vs-angular.html https://mindmajix.com/vue-vs-angular https://www.coderhouse.cl/blog/que-es-vue-js-usos-ventajas-como-aprender https://kinsta.com/es/blog/vue-vs-react/ https://fireart.studio/blog/vue-vs-angular-which-technology-is-better-for-your-project/ https://www.monocubed.com/blog/vue-vs-angular/ https://itnext.io/from-angular-to-vue-a-simple-transition-guide-d0a8a952d17f https://openwebinars.net/blog/que-es-vue-js-y-que-lo-diferencia-de-otros-frameworks/ https://www.viewgital.com/blog/react-vs-angular-vs-vue-cual-es-la-mejor-opcion-para-el-2022 https://todoxampp.com/angular-vs-react-vs-vue-el-analisis-definitivo/ https://rootstack.com/es/blog/vue-vs-angular-cual-es-mejor-para-el-desarrollo-frontend-en-2022 https://www.hiberus.com/crecemos-contigo/angular-vs-react-vs-vue/ https://cipsa.net/que-es-angular-para-que-sirve/ 

Copyright © SNGULAR. All rights reserved. 22 v Copyright © SNGULAR. All rights reserved. Thank you Thank you En SNGULAR buscamos gente buena y buena gente