HTML5

html5
=======
Elementos en linea:

- button, input, label, select, textarea, b, small, code, strong, cite
- img, span, a

Elementos en bloque:

- h1,h2,h3,h4,h5,h6, p
- article, main, aside, footer, header, section, div, table, nav
- ul, li, ol, fieldset, audio, video, form, figure, hr

Ilustraciones Vectoriales

--------------------------------

https://www.manypixels.co/

https://undraw.co/illustrations

Icons

--------------------------------

https://boxicons.com/

ATAJOS DE TECLADO ILLUSTRATOR

ATAJOS DE TECLADO ILLUSTRATOR
================================
PEGAR                         -->     CTRL + F
Bloquear                       -->     CTRL + 2
Previsualizar contornos -->  CTRL + Y
Deshacer                        -->    CTRL + Z
Rehacer                          -->   CTRL + SHIFT + Z

Convertir Vector            -->   CTRL + SHIFT + O

Instalar Browsersync y Sass

Instalar Browsersync
======================
Descargar e instalar Node https://nodejs.org/es/
$> npm install -g browser-sync
$> browser-sync start --server --files *.html

Instalar Sass
======================
Descargar e instalar Sass https://sass-lang.com/

$> npm install -g sass

$> sass --version

Enlazar los archivos Sass con los archivos Bootstrap css

$> sass --watch libs/scss/bootstrap.scss libs/dist/css/bootstrap.css

Compilar archivo SAS a CSS

$> sass --watch scss/styles.scss:css/styles.css

Instalar Apache y PHP en Windows 10

Instalar Apache y PHP en Windows 10

==============================

Instalar Apache y Visual C++ Redistributable for Visual Studio 2015-2019 en windows 10

https://www.apachelounge.com/download/

https://aka.ms/vs/16/release/VC_redist.x64.exe

Descomprimir el archivo en
C:\Program Files

Configurar las variables de entorno
En Path ->Editar -> Nuevo
C:\Program Files\Apache24\bin

C:\Program Files\php

Seleccionar el directorio del Apache:
ingresar a la carpeta conf -> httpd.conf
:37 Define SRVROOT "c:/Program Files/Apache24"

Instalar e iniciar Apache
Ingresar al cmd como Administrador:

$> cd C:\Program Files\Apache24\bin
$> httpd.exe -k install

Ejecutar:services.msc -> iniciar Apache

ó

cmd: httpd -k start

Ingresar al navegador

http://localhost

-----------------------------------------------------------------------------------------------
                                         Instalar PHP en Windows 10

-----------------------------------------------------------------------------------------------
https://www.php.net/downloads

Descomprimir el archivo en
C:\Program Files

Cargar modulo de PHP en Apache
ingresar a la carpeta conf  de Apache

En el archivo httpd.conf al final agregar:
-------------------------------------------------------------------

ServerName localhost

LoadModule php_module "C:/Program Files/php/php8apache2_4.dll"

AddHandler application/x-httpd-php .php

PHPIniDir "C:/Program Files/php"

-------------------------------------------------------------------
Cambiar de ubicacion el DocumentRoot en Apache

ingresar a la carpeta conf -> httpd.conf
:251 DocumentRoot "d:/PHP"

:252 <Directory "d:/PHP">

Crear archivo info.php en D:\php

<?php

phpinfo();

?>

Renombrar archivo php.ini-development por php.ini 

Ingresar a la carpeta C:\Program Files\php\

php.ini

Reiniciamos servicio de Apache
Ejecutar:services.msc -> Reiniciar Apache

Ingresar al navegador web y verificar
http://localhost/info.php

============================================================

                              Instalar XDEBUG en Visual Studio Code

============================================================

Ingresar a VSCode y Descargar Extension

Instalar -> PHP Debug V.3.X

Ir a https://xdebug.org/wizard   -> Descargar versión para php8

Copiar todo el contenido de info.php y pegar https://xdebug.org/wizard

Analizar configuración y ejecutar las siguientes instrucciones:

1. Descargar php_xdebug-3.1.3-8.1-vs16-x86_64.dll

2. Copiar el archivo descargado en C:\Program Files\php\ext

3. Editar C:\Program Files\php\php.ini y añadir al final

 [xdebug]

  zend_extension = "C:\Program Files\php\ext\php_xdebug-3.1.3-8.1-vs16-x86_64.dll"

4. Reiniciar Apache

Abrir VSCode ir al menu lateral 

Click en Run and Debug 

  -> Click en Crear un archivo launch.json ->PHP

*****************************************************

{

  "configurations": [

    {

      "name": "Listen for Xdebug",

      "type": "php",

      "request": "launch",

      "port": 9003

    },

    {

      "name": "Launch currently open script",

      "type": "php",

      "request": "launch",

      "program": "${file}",

      "cwd": "${fileDirname}",

      "port": 9003

    }

  ]

}

*****************************************************

-----------------------------------------------------------------------

Configurar var_dump en PHP con colores y ordenado

-----------------------------------------------------------------------

Ingresar a php.ini y agregar las siguientes líneas

C:\Program Files\php\php.ini

-------------------------------------------------------------------------------------------------------

[xdebug]

xdebug.mode = develop,debug

xdebug.start_with_request=yes

xdebug.idekey=VSCODE

zend_extension="c:\Program Files\php\ext\php_xdebug-3.1.3-8.1-vs16-x86_64.dll"

-------------------------------------------------------------------------------------------------------

Reiniciar Apache

Ingresar al navegador web y verificar
http://localhost/prueba.php

Arquitectura en N-Capas

1.Capa presentacion: Encargada de interactuar con el usuario.

Representa a los formularios que se implementaran en el proyecto. La cantidad de formularios lo determina el desarrollador.

2.Capa de Negocio: Es la encargada de negociar los procesos entre la capa de presentacion y la capa de datos. Es la capa que recibe las peticiones del usuario y una vez tenga la respuesta lo envía a la capa de presentacion.

EntidadCN:Contiene la llamada a todos los metodos implementados en la clase EntidadDAO(Capa de datos).

3.Capa de Datos: Es la encargada de conectarse al servidor de datos e implementar metodos que permiten obtener toda la informacion solicitada por el usuario.

Conexion:  Contiene un metodo para conectarse a la base de datos.

EntidadDAO:Contiene la implementacion de todos los metodos que permiten realizar el listado y mantenimiento de registros de una determinada entidad.

4.Capa Entidad: Se encarga de contener todos aquellos objetos (clases) que representan al negocio, y esta es la única que puede ser instanciada en las 3 capas anteriores.

Contiene los atributos y los metodos get y set de la clase, a la cual se realizara el mantenimiento o consulta.

Patrón Value Object o VO (Anteriormente conocidas como DTO Data Transfer Object)

Consiste en tener clases con sus atributos y metodos get y set y que representan a cada una de las tablas de la BD. De esta manera podremos transportar un objeto con todos estos valores por medio de los métodos set y get de cada atributo.

Este patrón nos facilita para el transporte de la información, evitando que se envíen gran cantidad de parámetros a un método cuando queremos hacer un registro o actualización.

Data Access Object o DAO

Permite separar la lógica de negocio de la lógica para acceder a los datos, de tal forma que el DAO encapsula toda la lógica de acceso de datos al resto de la aplicación. Si cambiamos nuestra base de datos simplemente modificamos nuestra capa DAO

el DAO nos va a permitir obtener información de la base de datos, proporcionará los métodos necesarios para insertar, actualizar, borrar y consultar la información.

Patron Diseño MVC

Patrón de Diseño MVC
-------------------------------
La arquitectura MVC se encarga de dividir nuestro proyecto en tres partes:
Modelo: Se encarga de trabajar con la base de datos, permite manejar la lógica del negocio y la gestión de la BD CRUD
Vista: Se encarga de interactuar con el usuario, recolecta información del usuario a través de una interfaz, diseñada para recolectar datos.
Controlador: Se encarga de controlar todos los procesos para obtener los resultados, y entregándolos a la vista para que pueda mostrarlos.

Funcionamiento:
1. El usuario interactúa con la vista de alguna forma, realizando una acción.
2. La Vista envía una notificación al controlador.
4. El Controlador recibe la notificación de la acción realizada por el usuario y solicita los datos al modelo.
5. El Modelo toma los datos que vienen desde la Vista lo procesa y envía los datos al controlador
6. El Controlador envía los datos a la vista.
7. La Vista entrega y muestra los datos al usuario.

Programacion Orientado a Objetos

Programación Orientado a Objetos
===================================
Objeto: Un objeto es una unidad dentro de un programa informático que tiene atributos y métodos. Los objetos se crean a partir de clases.
Clase: Es una plantilla o molde que contiene métodos y atributos del objeto, y que a partir de esa plantilla se pueden crear varios objetos.
Abstracción: La abstracción es un proceso en el cual se va a definir las características específicas de un objeto, la descripción de los métodos y atributos que va a tener el objeto y representarlo dentro de una clase.
Encapsulamiento: Se encarga de proteger la información de manipulaciones no autorizadas.
Polimorfismo: Es la capacidad de definir varios métodos o funciones utilizando el mismo nombre pero definiendo diferentes procedimientos. 

El polimorfismo es cuando cada objeto pueda realizar la misma orden pero que cada uno responda de diferentes formas.

El polimorfismo se refiere en sobreescribir un metodo de la clase "padre" y que pueda tener un comportamiento de diferentes formas.

Se refiere a que Un objeto de la clase padre me guarde un objeto de la clase hija.

Se refiere a que un objeto de la clase padre pueda ser referenciado con cualquier instancia, no solo de su misma clase sino también la de sus clases hijas, de esta manera tenemos las muchas formas que puede tomar un objeto
Herencia: Es cuando se hereda los atributos y métodos de una clase padre a una clase hija para ahorrar código. Sirve para reutilizar códigos de programación.

Clase Static: Si una clase lo definimos como static todos los miembros de esa clase deben tener el modificador static, No se puede crear ninguna instancia de una clase static.

Para acceder a los miembros de una clase static se utiliza la misma clase seguido del metodo o atributo a utilizar. ejem: ClaseEstatica.atributo="hola mundo";

Atributo Static: El atributo estatico es compartido por todos los objetos de la misma clase.

Todos los objetos que se creen de una clase se va compartir el mismo valor de un campo static para todos los objetos

Metodo Static: Si el metodo es static los atributos y metodos deben ser staticos para ser usados, y no se puede crear objetos, para acceder a los metodos se debe utilizar unicamente el nombre de la clase y el operador punto seguido del metodo.

Se pueden utilizar o llamar desde cualquier parte del programa sin necesidad de crearle un objeto. 

Sobreescritura de metodos: Permite cambiar el comportamiento de un metodo. Se hace sobre la herencia/polimorfismo.

Atributos: Representan las características de la clase.

Constructor: Se encarga de inicializar los atributos del objeto.

Getter: Obtener el valor de un atributo.

Setter: Asignar un valor a un atributo.

Metodo ToString: Permite mostrar el estado de un objeto, este metodo se utiliza para mostrar los datos de mis atributos.

@Override: Es una anotación para indicar que se esta sobrescribiendo el método de la clase padre.

instanceof: Este operador nos va a permitir verificar si un objeto es de una determinada instancia.

Clase Abstracta: Es aquella de la que no se puede instanciar objetos.

Las clases abstractas pueden poseer atributos, métodos, constructores, etc.

Una clase abstracta puede contener métodos no-abstractos pero al menos uno de los métodos debe ser declarado abstracto.

Se utiliza cuando no tienes comportamiento a definir y quieres que las clases hijas sean las encargadas de agregar la funcionalidad a los métodos abstractos.

Interface: Una interfaz en Java es una colección de métodos abstractos y propiedades constantes. 

No se pueden instanciar. No podemos crear objetos a partir de una Interface.

No contiene constructores.

Si contiene atributos todos deben ser public static final

Una interface puede heredar de varias interfaces. Con las interfaces se permite la herencia múltiple.

Una clase puede implementar varias interfaces.

Clase Final: Cuando la clase esta definida como Final no se puede heredar de dicha clase.

Servidor Linux Comandos

Consultar la versión de centOS instalada: 
$> rpm --query centos-release
$> cat /etc/redhat-release


Ver datos de la CPU en linux
$> cat /proc/cpuinfo
$> lscpu
$> lshw -c processor

Ver espacio en el disco
$> df -h

Verificar el tamaño del directorio
$> du -hs *



IPTABLES
---------------
$> iptables -t filter -L INPUT --line-numbers -n

Dar permisos a archivos de windows

Dar permisos a archivos de windows

Ir a la pestaña Seguridad y al boton Opciones Avanzadas

Ir a la pestaña Propietario

Ir al botón Editar

Luego Ir al botón Otros usuarios o grupos, agregamos el usuario(Todos) y aceptamos

   

Habilitamos Reemplazar propietario en subcontenedores y objetos y aceptamos todo y salimos.

Ingresamos nuevamente a la pestaña de Seguridad y al boton Opciones Avanzadas.

Ir al boton Cambiar permisos

Hacemos Click en el boton Agregar y Seleccionamos el usuario

  

Permitir control Total al usuario seleccionado(Todos) y aceptamos

Finalmente seleccionamos el usuario, dejamos marcado las 2 opciones y aplicamos lo cambios.

CREACION DE BASE DE DATOS SQL SERVER

CREACION DE BASE DE DATOS DE UNA BIBLIOTECA
===============================================

USE MASTER
GO

CREATE DATABASE bdPrueba
ON PRIMARY
(NAME =  'bdPrueba', FILENAME = 'E:\BD\bdPrueba.mdf', SIZE = 10MB, MAXSIZE = Unlimited, FILEGROWTH = 2MB)
LOG ON
(NAME = 'bdPrueba_log', FILENAME ='E:\BD\bdPrueba_log.ldf', SIZE = 10MB, MAXSIZE = 30MB, FILEGROWTH = 10%)
 GO

 USE bdPrueba
 GO

CREATE TABLE Lector(
IdLector int identity(1,1) not null,
ApellidoLector varchar(80) not null,
NombreLector varchar(80) not null,
TelefonoLector varchar(30) not null,
CONSTRAINT PK_IdLector Primary key (IdLector)
 )
GO

CREATE TABLE Prestamo(
NroPrestamo int identity(1,1) not null,
CantLibrosPrestados int not null,
FechaPrestamo datetime not null,
IdLector int not null,
CONSTRAINT PK_Prestamo PRIMARY KEY(NroPrestamo),
CONSTRAINT FK_IdLector FOREIGN KEY (IdLector) REFERENCES Lector(IdLector)
)

CREATE TABLE Autor(
IdAutor int identity(1,1) not null,
ApellidoAutor varchar(60) not null,
NombresAutor varchar (60) not null,
PaisAutor varchar(30) not null
CONSTRAINT PK_IdAutor PRIMARY KEY (IdAutor)
)

CREATE TABLE Editorial(
IdEditorial int identity not null,
NombreEditorial varchar(80) not null
CONSTRAINT PK_IdEditorial PRIMARY KEY (IdEditorial)
)

CREATE TABLE Libro(
IdLibro int identity not null,
PrecioRef money null,
Titulo varchar(80) not null,
IdEditorial int not null,
CONSTRAINT PK_Idlibro PRIMARY KEY (IdLibro),
CONSTRAINT FK_IdEditorial FOREIGN KEY (IdEditorial) REFERENCES Editorial(IdEditorial)
)

CREATE TABLE Libro_Autor(
IdLibro int not null,
IdAutor int not null,
Capitulos int not null,
CONSTRAINT PK_Libro_Autor PRIMARY KEY (IdLibro,IdAutor),
CONSTRAINT FK_IdLibro FOREIGN KEY (IdLibro) REFERENCES Libro(IdLibro),
CONSTRAINT FK_IdAutor FOREIGN KEY (IdAutor) references Autor(IdAutor)
)
go

sp_helpconstraint Libro_Autor

CREATE TABLE Detalle_Prestamo(
IdLibro int not null,
NroPrestamo int not null,
NroCopia int not null,
CONSTRAINT PK_IdLibro_NroPrestamo PRIMARY KEY (IdLibro,NroPrestamo),
CONSTRAINT FK_IdLibro_DetallePrestamo FOREIGN KEY (IdLibro) REFERENCES Libro(IdLibro),
CONSTRAINT FK_NroPrestamo FOREIGN KEY (NroPrestamo) REFERENCES Prestamo(NroPrestamo)
)
GO

-- Añadir Campo a tabla lector
ALter table Lector
ADD DNI char(8) not null,
Direccion varchar(80) not null
GO

-- Añadir Constraint UNIQUE a tabla Lector
ALTER TABLE Lector
ADD CONSTRAINT UNQ_DNI
UNIQUE (DNI)
GO

SP_HELPCONSTRAINT Lector
GO

Descargar Google Chrome Y Firefox Offline

Descargar FIREFOX Offline
========================
Para 64 bit  --> https://download.mozilla.org/?product=firefox-72.0.2-SSL&os=win64&lang=es-ES
Para 32 bit --> https://download.mozilla.org/?product=firefox-72.0.2-SSL&os=win&lang=es-ES
Elegir Idioma y S.O --> https://www.mozilla.org/es-ES/firefox/all/?q=Spanish%20(Spain),%20Espa%C3%B1ol%20(de%20Espa%C3%B1a)#product-desktop-release

Descargar GOOGLE CHROME offline
=================================
Para 64 Bit --> http://www.google.com/chrome/eula.html?standalone=1 
Para 32 bit --> https://dl.google.com/tag/s/appguid%3D%7B8A69D345-D564-463C-AFF1-A69D9E530F96%7D%26iid%3D%7B126B12CB-92A4-59CC-C453-BB8C2CD640F9%7D%26lang%3Des%26browser%3D4%26usagestats%3D0%26appname%3DGoogle%2520Chrome%26needsadmin%3Dprefers%26ap%3Dstable-arch_x86-statsdef_1%26installdataindex%3Ddefaultbrowser/chrome/install/ChromeStandaloneSetup.exe

Instalar Wine en Ubuntu 14.04 LTS

Instalar Wine en Ubuntu 14.04 LTS
=============================

Abrir la terminal con cntrl + alt+ T y agregar el ppa:
$> sudo add-apt-repository ppa:ubuntu-wine/ppa

Ejecutar:
$> sudo apt-get update

Instalar Wine:
$> sudo apt-get install wine1.6

Instalar BeeBEEP en Ubuntu 16.04
=============================

$> sudo sh -c 'echo "deb http://archive.getdeb.net/ubuntu $(lsb_release -sc)-getdeb apps" >> /etc/apt/sources.list.d/getdeb.list'
$> sudo wget -q -O - http://archive.getdeb.net/getdeb-archive.key | sudo apt-key add -
$> sudo apt update && sudo apt install beebeep

Atajos de teclado en Visual Studio Enterprise

Atajos de teclado en Visual Studio
============================================
       F5                   ->   Ejecutar Aplicación
   CTRL + F5         ->   Ejecutar Aplicación Sin depuración
Shift + Suprimir   ->   Eliminar la línea actual 
Ctrl+D      ------------>   Duplica la línea actual en la línea inferior
Ctrl+K + Ctrl+C    ->   Comentar con /
Ctrl+K + Ctrl+U    ->   Descomentar con / 
Alt+↑      ------------->    Intercambiar línea actual con la superior
Ctrl+Alt+↓   --------->   Multicursor 
Ctrl+Shift+U        ->    Poner Mayúsculas
Ctrl + U    ----------->    Poner Minúsculas 
Ctrl+Shift + N       ->   Crear Proyecto
Ctrl+K + Ctrl+D    ->   Formatear Código



Ajuste Automático de Linea
-----------------------------------------
Ir a Herramientas o tools -> Opciones
                                              Text Editor -> All Languages
                                               General
                                               Activar Word wrap 

Configuración Personal de Intellij idea

Configuración de Intellij idea
============================
Font: Consolas
Size: 17
Line Spacing: 1.0

Font: JetBrains Mono
Size: 16.5
Line Spacing: 1.1
Main weight: Medium

Font: JetBrains Mono
Size: 16.7
Line Spacing: 1.0
Main weight: Medium

Ir a Editor --> Color Scheme
                         -> General
                               -> Code  -> Line number on Caret row --> #fff  

                                                   Matched brace ->   Foreground:#FFEF28  

                                                                                   Background:#373E4A ó #3B514D

                              -> Editor  -> Breadcrumbs 

                                                  -> Caret -> Foreground: #548AF7 -->Cursor
  -> Caret row ----> Background:  #2B2B2B
                                               -> Guides -> Gutter background ----> Background: #1E1E1E
  Selection background ----> Background: #3C3F41 ó #214283
                              -> Text -> Default Text -> Background:  #1E1E1E ó #282C34

Desactivar spell checking en IntelliJ IDEA

Elegir Perfil: Default

File >> Settings >> Editor >> Inspections -> Proofreading -> Desactivar Typo

File >> Settings >> Editor >> Natural Languages -> Add Español

Desactivar sugerencias

Editor > Inlay Hints > Code Vision > Desactivar Usages

Configurar Apariencia

Appearance & Behavior -> System Settings

Desactivar Reopen projects on startup

Project -> Activar New Window

Cambiar ancho del cursor

Ctrl + Shift + A -> Actions

Buscar ir a Registry -> Seleccionar editor.caret.width -> Cambiar el valor a 3

Keymap

Comment with line   -> Crtl +7

Comment with block ->Ctrl + Shift + 7

Path Gitbash

C:\Program Files\Git\bin\bash.exe

Plugins

------------

One Dark Theme

Atom material Icons

Save Actions

Rainbow Brackets

GitHub Copilot