domingo, 19 de septiembre de 2021

Componentes en React

Los componentes permiten separar la interfaz de usuario en piezas independientes, reutilizables y pensar en cada pieza de forma aislada.

Existen dos tipos de componentes en React:
  • Componentes funcionales: Solo tienen propiedades.
  • Componentes de clase: Tienen propiedades, ciclos de vida y propiedades.
Componentes funcionales.

La forma más sencilla de definir un componente es escribir una función de JavaScript ,por
 convenio se pone el nombre de la función en mayúsculas y para renderizarlo simplemente se pone una etiqueta con el nombre de la función.

Componentes de clase.

Un componente de clase es una clase de javascript que extiende la clase Component de React.

martes, 31 de agosto de 2021

Ramas y Pull request

Para ver las ramas que tenemos en un repositorio, utilizamos git branch, existen varias opciones que podemos añadir al comando:

  • git branch -a -->si queremos ver las ramas que tenemos tanto en local como en remoto, utilizamos , saldrá un * al lado de la rama que te encuentres actualmente.
  • git branch -v (-vv, --verbose) --> ,muestra con más detalla las ramas.
  • git branch -r -->para ver solos las ramas en remoto.
  • git branch NOMBRE_RAMA --> te crea una rama.
  • git checkout NOMBRE_RAMA --> te mueves a la rama.
  • git checkout -b NOMBRE_RAMA --> te crea la rama y te mueve a ella del tirón.
  • git branch -m VIEJO_NOMBRE NUEVO_NOMBRE --> renombra la rama.
  • git branch -d NOMBRE_RAMA --> elimina la rama, para que se pueda eliminar no podemos encontrarnos en ella.
  • git branch -D NOMBRE_RAMA --> forzamos que se elimine la rama, aunque tengan cambios, tambien podemos utilizar git branch -d --force NOMBRE_RAMA.
  • git branch --merged --> vemos las ramas que han sido fusionadas con la rama activa
  • git merge nombre_rama --> fusionamos los cambios de la rama con la actual, si existen cambios que no tienen commit en la actual, Git no dejará hacer la fusión.

NOTA:hay que saber que Git no te dejará moverte a otra rama si tienes cosas pendiente en la actual.

Integrar cambios entre ramas

Se puede hacer de dos formas:

  1. Con el comando git merge nombre_rama (después hacemos el push para subir los cambios al repo)
  2. Desde el stio web github:



Como Publicar mi proyecto en Github

Tenemos un proyecto en local y queremos publicarlo a un repositorio github, los pasos que vamos a seguir son los siguientes:

  • Nos colocamos en la carpeta que queremos publicar, y ejecutamos el comando git init
  • A continuación ejecutamos el comando git add sobre la carpeta o sobre el archivo que queremos publicar, con esto indicamos a git que queremos preparar y poner en cola para el próximo commit. Git trabaja con 3 estados, confirmado (committed), modificado (modified) y preparado (staged), para ver el estado se utiliza el comando git status.
  • Lanzamos el comando git  commit -m "Mi primer commmit" para incluir en el repo local. Puede solicitarle el usuario y la contraseña, en mi caso al tener configurar el Git Bash, ya lo tenía configurado y no hace falta introducir las credenciales. 

  • Utilizamos el comando git remote add origin https://github.com/nrobles83/pruebaRepo para conectar nuestro repositorio local con el github,la url tiene que ser exactamente igual al url que creamos en el github.
  • Para publicar lo que tenemos en nuestro servidor local al servidor remoto de git , utilizamos el comando git push https://github.com/nrobles83/pruebaRepo

lunes, 23 de agosto de 2021

Configurar una cuenta en Github, crear repositorio y clonarlo

Configuración de la cuenta

Visitamos la url https://github.com, pulsamos el botón verde grande “Sign up for GitHub” que aparece en el centro de la pantalla o el enlace Sign up arriba a la derecha.                                                     Proporcionamos un correo y una contraseña y elegimos un usuario que esté disponible.

Crear repositorio

Para subir tu proyecto a GitHub, deberás crear un repositorio donde alojarlo. Para ello en la pagína, arriba a la derecha vemos el símbolo + pulsamos New repository:

 
Y vamos rellenando los campos que nos solicitan, nombre, si es publico o privado, y si queremos inicializarlo con un  README

Inicialización de un repositorio local

El comando git init se puede utilizar para convertir un proyecto existente y sin versión en un repositorio de Git, o para inicializar un nuevo repositorio vacío.

Clonar un repositorio

En git el término clonar , se refiere a tener un copia en tu local de un repositorio, lo que en subversión sería un checkout.

El comando es clone y la sentencia sería:

git clone url (nombre directorio, es opcional)

jueves, 18 de marzo de 2021

SASS

SASS es el mejor ayudante para el desarrollador web a la hora de trabajar en CSS gracias a sus múltiples funcionalidades: mixins, variables, funciones, herencia, nesting.

SASS dispone de dos formatos diferentes para la sintaxis, lo que hace se traduce en dos extensiones de fichero diferentes:

  •  .sass : se caracteriza en no hacer uso de llaves ni punto y coma final, en busca de la simplicidad y eliminación de ruido.
  • .scss : permiten utilizar llaves e incorporar código de CSS clásico.

Algunas funcionalidades básicas de SASS utilizando la sintaxis .scss:

 

 

Procesadores de CSS

CSS te permite diseñar una página web, pero para diseñar un solo elemento se necesita escribir mucho código. Este puede ser difícil de leer y difícil de mantener. Esto se debe a que CSS carece de variables y funciones que poseen otros lenguajes de programación, lo que te obliga a repetir código.

CSS ha evolucionado y se han añadido métodos para escribir código CSS más eficientemente , esto se consigue a través de los preprocesadores de CSS. El objetivo de estos preprocesadores es tener un código más sencillo de mantener y editar.

Un preprocesador te permite escribir CSS en un idioma alternativo (muy parecido al CSS nativo) y ofrece funciones avanzadas como variables, funciones y la posibilidad de incluir archivos.

Una vez que el código CSS esté escrito en este nuevo idioma, se compilará para volver a transformarse en CSS nativo, el único que los navegadores web pueden entender.

 Los procesadores más conocidos son SASS, LESS, Stylus, PostCSS.

 

martes, 16 de marzo de 2021

Comprobar si existe tabla SQL

 DECLARE   
     V_TABLA NUMBER;  
BEGIN
 
    SELECT count(*) INTO V_TABLA FROM user_tables  WHERE TABLE_NAME='NOMBRE_TABLA'; --el nombre en mayúscula en la comprobación
 
  IF V_TABLA=0  then
            EXECUTE IMMEDIATE 'create table nombre_tabla...';
  END IF;
 
END;

martes, 23 de febrero de 2021

Conceptos básicos de la arquitectura de microservicios

Los microservicios son pequeñas unidades de servicios independientes que se crea después de dividir una aplicación monolítica, para así tener un mejor mantenimiento de los componentes. 

Con los microservicios, los desarrolladores ahora deben escribir menos códigos. Y, si escriben menos códigos, pueden mantenerlos mejor. 

Cada microservicio puede ser actualizado o escalado sin que esto afecte a la disponibilidad de los demás unidades y de la aplicación en su conjunto

lunes, 15 de febrero de 2021

Rest

Es un modelo de arquitectura web basado en el protocolo HTTP para mejorar las comunicaciones cliente-servidor. Es una alternativa a SOAP , que disponen de una gran capacidad pero también mucha complejidad. 

En un sistema REST, cada recurso es direccionable únicamente a través de su URI.

 Las operaciones más importantes relacionadas con los datos en cualquier sistema REST y la especificación HTTP son cuatro:, a estos operaciones se les llama verbo y se coloca en el encabezado de la solicitud.

  1. POST (crear).
  2. GET (leer y consultar),
  3.  PUT (editar).
  4. DELETE (eliminar).

Otra de las características es que es independiente del tipo de plataformas o lenguajes. Da igual qué lenguaje de programación estés utilizando o qué plataforma. Con una API REST podrás trabajar de cualquier manera. Lo único necesario es que el intercambio de información sea mediante XML o JSON.

Se utiliza en java la API JAX-RS para proprocionar soporte en la creación de servicios web de acuerdo con el estilo arquitectónico Rest.​ JAX-RS usa anotaciones. entre estas anotaciones se incluyen:

  • @Path especifica la ruta de acceso relativa para una clase recurso o método.
  • @GET, @PUT, @POST, @DELETE y @HEAD especifican el tipo de petición HTTP de un recurso.
  • @Produces especifica los tipos de medios MIME de respuesta.
  • @Consumes especifica los tipos de medios de petición aceptados.

RESTful se suele utilizar para referirse a los servicios web que ejecutan la arquitectura REST.

martes, 9 de febrero de 2021

React

Es una librería Javascript desarrollada por Facebook y diseñada para ayudarnos a crear SPA's (Single Page Application), su objetivo es tratar de facilitar la tarea de desarrollar interfaces de usuario. Podríamos decir que React es la V en un contexto en el que se use el patrón MVC.

Para instalar React JS debemos tener instalado nodejs y ejecutar algunos comandos sencillos:

  •  Lo primero que tenemos que instalar es Node.js ya que vamos a utilizar npm para la instalación de los paquetes de ReactJs. Para verificar que se ha instalado correctamente ejecutamos en una consola de comando node -v. 
  • Con el comando npm install -g create-react-app  lo que hacemos es instalar ReactJS en nuestro ordenador de forma global. Si no agregásemos el parámetro -g sólo podríamos usar ReactJS en la carpeta donde hemos ejecutado el código.
  •  Nos vamos a la carpeta donde vamos a tener los proyectos que van a utilizar react y lanzamos el ejecutamos create-react-app nombreproyecto.
  • E inicializamos el proyecto npm start

Si todo esta bien, la aplicación estará corriendo en el puerto 3000. Suele abrirse solo el navegador en esta dirección, pero si no es así, sólo debes ingresar a http://localhost:3000.

Si editamos App.js, los cambios que metamos en ese archivo se reflejaran en el navegador automaticamente, sin necesidad de recargar, esto es debido el Webpack, es un empaquetador de módulos que permite automatizar procesos como transpilación de código, preprocesamiento (de .scss a .css), al instalar node, se obtiene esta funcionalidad.

Las aplicaciones React se construyen mediante componentes, los cuales son elementos independientes y pueden ser reutilizados, además, describen cómo tienen que visualizarse y cómo tienen que comportarse.

Angular

Angular es un framework para aplicaciones web desarrollado en TypeScript, de código abierto, mantenido por Google, que se utiliza para crear y mantener aplicaciones web de una sola página.

 Su principal particularidad es que impulsa el uso del patrón de diseño de software MVC (Modelo - Vista - Controlador).

Aunque ofrece principalmente una base para el desarrollo de la parte frontal, la programación Javascript del lado del cliente, también aborda técnicas de desarrollo de la parte del backend.

lunes, 8 de febrero de 2021

Node.js

Node.js es un entorno que permite ejecutar código Javascript en el servidor.

Algunas caracterñisticas de Node.js:

  • Es Open Source.
  • Basado en eventos.
  • Programación Asíncrona.
  • Basado en el motor V8 de Google. 
  • Node.js trabaja con un único hilo de ejecución que es el encargado de organizar todo el flujo de trabajo que se deba realizar.

Integración continúa

Con el fin de evitar mayores problemas al final de un nuevo desarrollo extenso, se aconseja utilizar la integración continúa como buenas prácticas.

Los desarrolladores van integrando su código una o varias veces al día en el código base principal. Debido a que se trata de pequeños fragmentos de código, la integración se realiza rápidamente y, en tan solo unos minutos y si se descubre algún error en este proceso, se podrá localizar y solucionar rápidamente.

domingo, 7 de febrero de 2021

RabbitMQ

Es una librería para intercambio de mensajes mediante colas.

Implementa el protocolo AMQP (Advanced Message Queuing Protocol), cuya gran ventaja es que emisores y destinatarios no tienen por qué entender el mismo lenguaje de programación.

Lombok

Es una librería que nos permite a través de las anotaciones obtener un código más limpio y reducido.

Algunas de las anotaciones más utilizadas:

  • @Data ,con esta anotación a nivel de clase, nos ahorramos  tener que añadir  getter/setter o constructores, o los métodos equals, toString().. a una clase.
  • @Setter o @Getter a nivel de propiedad, no es necesario generar el getter y setter de las propiedades que tengan esta anotación. Se puede utilizar también a nivel de clase y generaría para todos las propiedades de la misma.
  • @NotNull  nos ahorramos comprobar si un parámetro de entrada de un método es nulo o no.
Para poder utilizar Lombok, lo único que necesitamos es importar el jar en nuestro proyecto y configurar nuestro entorno de desarrollo para que procese las anotaciones.



martes, 19 de enero de 2021

MongoDB

MongoDB es una de las más famosas entre las bases de datos no relacionales. 

Las bases de datos no relacionales no trabajan con SQL, no tienen tablas ni registros.

MongoDB guarda los datos en documentos, sin seguir ningún esquema predefinido, es una de las diferencias más importante con respecto a las bbdd relacionales. 

Estos documentos son almacenados en BSON, que es una representación binaria de JSON.

MongoDB está escrito en C++, aunque las consultas se hacen pasando objetos JSON como parámetro.

martes, 12 de enero de 2021

Docker Compose

 Docker Compose es una herramienta que permite simplificar el uso de Docker con la utilización de archivos YAML (docker-compose.yml), gracias a esta herramienta podremos crear distintos contenedores, y en cada uno crear diferentes servicios. 

El archivo compose debe estar colocado en la ráiz del proyecto.

Algunos de los comandos más comunes que nos podemos encontrar son:

  • version: muestra la versión de docker-compose. 

  • build: Construye las imágenes de los servicios indicados en el docker-compose file.

  • up: crea y levanta los servicios indicados en el docker-compose file, con el argumento -d lo hace en segundo plano.

  • down: Para todo los servicios indicados en el docker-compose file, destruyendo los contenedores.

  • stop: Solo para los servicios no destruye los contenedores.

  • start: solo levanta los servicios pero no los crea.

  • restart: Reinicia todos los servicios.

Usar Compose es básicamente un proceso de 3 pasos. 

  1. Definir el  entorno de la aplicación con un Dockerfile. 
  2. Definir los servicios que conforman la aplicación en docker-compose.yml para que puedan ejecutarse juntos en un entorno aislado.
  3. Ejecutar docker-compose up y se iniciará y ejecutará toda la aplicación.
  4.  

Veamos un ejemplo sencillo de un archivo yml:

version : "3.8"
services:
    imagen1:
        image: imagen1:1.0
        ports:
            - 80:80
        restart: always
        volumes:
            - app-volume:/var/www/html

version: Es lo primero que definifimos en el archivo y se aconseja utilizar la última versión admitida en Referencia de archivos de Compose 

service: Contiene los contenedores que se crearán para desplegar nuestra aplicación.

En  esta entrada podremos ver más detalles de un docker-compose.yml

 


 

 

lunes, 11 de enero de 2021

DockerFile

Vamos a ver como crear una nueva imagen a través del fichero Dockerfile.

Recordemos que Dockerfile es simplemente un fichero de texto que nos permite definir las instrucciones a seguir por Docker para construir una imagen.

Deben estar guardados dentro de un build context (directorio el cuál contiene todos los archivos necesarios para construir nuestra imagen). El nombre del fichero es Dockerfile sin extensión.

Una buena práctica es crear el archivo .dockerignore que nos ayudá a definir lo que realemente necesita el directorio de contexto . Con este archivo, puede especificar ignorar reglas y excepciones de estas reglas para archivos y carpetas, que no se incluirán en el contexto de compilación y, por lo tanto, no se empaquetarán en un archivo ni se cargarán en el servidor Docker.

Ejemplo sencillo de un archivo Dockerfile:


FROM ubuntu

ADD . /app

RUN apt-get update RUN apt-get upgrade -y

RUN apt-get install -y nodejs ssh mysql

RUN cd /app && npm install

# esto debería iniciar tres procesos, mysql y ssh

# en segundo plano y node app en primer plano

CMD mysql & sshd & npm start

Instrucciones que podemos usar para crear un Dockerfile:

FROM — Especifica la base para la imagen.

ENV — Establece una variable de entorno persistente.

ARG — Permite definir una variable usable en el resto del Dockerfile con la sintaxis ${NOMBRE_DEL_ARG}

RUN — Ejecuta el comando especificado. Se usa para instalar paquetes en el contenedor.

COPY — Copia archivos y directorios al contenedor.

ADD — Lo mismo que COPY pero con la funcionalidad añadida de descomprimir archivos .tar y la capacidad de añadir archivos vía URL.

WORKDIR — Indica el directorio sobre el que se van a aplicar las instrucciones siguientes.

ENTRYPOINT — Docker tiene un Entrypoint por defecto, /bin/sh -c, que se ejecuta cuando el contenedor está listo. Este comando permite sobreescribirlo.

CMD — Especifica el comando y argumentos que se van a pasar al contenedor. Se ejecutarán junto con lo indicado en el Entrypoint.

EXPOSE — Indica que puerto del contenedor se debe exponer al ejecutarlo. No lo expone directamente.

LABEL — Nos permite aportar meta-datos a la imagen.

VOLUME — Crea un directorio sobre el que se va a montar un volumen para persistir datos más allá de la vida del contenedor.

USER — Establece el usuario que se va a usar cuando se ejecute cualquier operación posterior con RUN, CMD y ENTRYPOINT.

SHELL — Permite especificar el uso de otra terminal, como zsh, csh, tcsh, powershell, u otras..

STOPSIGNAL — Indica una señal que va a finalizar el contenedor.

HEALTHCHECK — Indica a Docker una manera de testear el contenedor para verificar que sigue funcionando correctamente.

ONBUILD — Cuando la imagen donde se encuentra se use como base de otra imagen, va a actuar de trigger y va a ejecutar el comando que le indiquemos.