Desarrollo

Area de coordinación enfocada a Desarrollo

Descubriendo los Servicios en Angular: Pilares fundamentales para el desarrollo en Angular.

https://youtu.be/Z3Qk3qBoy7s Los Servicios en Angular son elementos cruciales que potencian la modularidad y reutilización de código en el desarrollo de aplicaciones. Se trata de objetos que siguen el patrón de diseño singleton, es decir, se crean una única vez, y son compartidos en toda la aplicación. En este post exploraremos qué son los servicios, cuál es su propósito y cómo podemos aprovecharlos de una manera eficaz. ¿Qué son los Servicios en Angular? Dentro del framework Angular, un servicio es una clase singular con un propósito específico, diseñada para llevar a cabo taras reutilizables…continue reading →

Angular – Manejo de Observables

https://youtu.be/38ZmuMq7o1M Muy Buenas a todos, mi nombre es Juan Carlos Linaje y en esta entrada, veremos cómo trabajar con observables de una manera didáctica, con un ejemplo explicado y detallado paso a paso Lo primero de todo, para poder empezar en nuestro proyecto, lo que vamos a hacer es irnos a Github: https://github.com/desatatufuria/AngularObservers-appNos descargamos el proyecto: Case Study with Binding Una vez nos descarguemos el proyecto, procederemos a preparar el entorno de trabajo. usamos el comando: npm install Levantamos el proyecto.usamos el comando: ng s -o  s, es un alias de server -o, es un argumento…continue reading →

Como obtener datos de un Excel con React

En este nuevo post os indicare como poder obtener los datos de un archivo Excel (.xlsx) con React. Lo primero es crear nuestro proyecto de React, en este caso yo usaré el comando npx create-react-app. https://flic.kr/p/2pifUwg Una vez tengamos nuestro proyecto creado correctamente, crearemos nuestro componente donde vamos a obtener los datos de nuestro Excel. En este caso yo he decidido llamarlo ExcelComponent.jsx, tú puedes darle el nombre que veas oportuno. https://flic.kr/p/2pihzkp Ahora tendremos que importar nuestro componente dentro de App.js para poder visualizarlo en nuestra aplicación y nos debería quedar tal que…continue reading →

Chakra UI en React

Chakra UI Chakra UI es una biblioteca de componentes sencilla, modular y accesible que nos proporciona bloques de construcción muy buenos para nuestros proyectos de React. Para empezar comenzaremos con la instalación de Chakra UI, en nuestro cmd tras crear un proyecto de React : https://www.flickr.com/photos/199600759@N03/53359944489/in/dateposted-public/ Nos introduciremos en el proyecto y descargaremos la librería de Chakra UI: https://www.flickr.com/photos/199600759@N03/53359619786/in/dateposted-public/ Tras descargarla dentro de nuestro proyecto de react en visual studio code o el editor de código que uses nos introduciremos en index.js para modificar el código. Lo primero que haremos dentro de index.js…continue reading →

Dockerizar App React

Equipo  Las características con el equipo que estamos usando seria:  Sistema Operativo: Windows   Versión: Windows 10  Memoria RAM: 16GB  Objetivo  EL objetivo principal es Dockerizar una app React , ya sea proyecto nuevo o personalizado. En el proceso veremos tipos de errores que nos pueden salir y como solucionarlo.  Pasos  Instalación Docker  El primer paso es instalar Docker Desktop para WIndows , ya que nosotros estamos usando este sistema operativo.  Usamos el siguiente link para descargarlo:  https://docs.docker.com/desktop/install/windows-install/  Una vez estemos en la página daremos click en el botón "Docker Desktop for Windows".   https://www.flickr.com/photos/199665078@N08/53357569416/in/datetaken/…continue reading →

ANGULAR+PRIMENG 2023

En este post se va a enseñar como utilizar la librería de componentes PrimeNG. Esta librería ofrece una variedad de componentes como tablas, formularios y menús con un diseño atractivo y una funcionalidad mejorada. Instalar dependencias Primero necesitas ejecutar los comandos de instalación en tu proyecto. A parte de PrimeNG y PrimeIcons (Librería opcional) añadiremos también PrimeFlex que es una librería de estilos css muy parecida a Bootstrap y compatible con PrimeNG, la razón para añadir esta librería es que Bootstrap sobrescribe los estilo de algunos componentes de PrimeNG obligándonos a retocarlos manualmente…continue reading →