viernes, 26 de febrero de 2021

Bases de Datos (26/02/2021)

Clase de Prácticas

En la clase de hoy hemos continuado con el ejercicio iniciado en la anterior clase, usado como repaso para el examen o nuestro proyectos de Bases de Datos. Utilizando HeidiSQL conectada al servidor de MariaDB.

En esta parte del ejercicio práctico se ha creado una tabla 'yy' con tres columnas. Después se ha usado la sentencia INSERT INTO, para introducir datos:

"INSERT INTO YY (col1, col2, col3) VALUES 

(1, 'AA', 'primera'),

(2, 'AA', 'segunda'),

(2, 'BB', 'tercera'),

(1, 'AA', 'cuarta')(saldrá error porque se está repitiendo valores),

(NULL, NULL, 'quinta') (aquí saldrá error porque no puede haber nulos en las claves primarias),

(NULL, 'CC', 'sexta')(también saldrá error porque no admite nulos la clave primaria),

(3,NULL, 'séptima')(también saldrá error porque da igual la posición del nulo, las claves primarias no tienen nulos),

(0, ' ', 'octava')(este funcionaría porque aunque hay una cadena de caracteres vacía, no es lo mismo que los "NULL"),

(3, 'AA', NULL)(esta vez dejará debido a que col3 permite nulos)"

Recordatorio: (si queremos cambiar un valor dentro de una columna, se usa la sentencia "UPDATE")(si queremos borrar registros de tablas usamos el DELETE o DELETE con WHERE, para elegir que borrar, y así no borrar todo el contenido de la tabla).

En la siguiente parte del ejercicio se ha realizado dos nuevas tablas:

"CREATE TABLE T1 (a INT, b INT, c INT, PRIMARY KEY(a));"

"CREATE TABLE T2(a INT, d INT, e INT, PRIMARY KEY(d), FOREIGN KEY(a));"

Después se realiza un "INSERT INTO" comprobando diferentes secuencias de datos (cambiando los valores entre paréntesis), algunos son por ejemplo:       

"INSERT INTO T1 (a,b,c) VALUES (2, 20, NULL)(en este caso funcionaría porque admite nulos la tercera columna);"

"(2, NULL, NULL)(fallaría por introducir valores duplicados (el 2));"

"(2, 20, NULL) (fallaría por seguir teniendo el primer campo duplicado (el 2));"

"(1, 20, 200)(seguiría fallando porque sigue duplicado);"

"INSERT INTO T2 (a, d, e) VALUES (4, 10, 100)(funcionaría por ser valores enteros sin nulos);"

"(2, NULL, NULL)(no funcionaría por haber un nulo en la columna con clave primaria);"

"(2, 20, NULL)(ahora si funcionaría porque no afecta el nulo debido a que lo permite la tercera columna);"

"En la T1(1, 20, 200)(no funcionaría por error de clave duplicada (la primera columna);"

"En la T2 de nuevo(4, 10, 100)(daría error debido a que la clave 4 no está definida en la clave primaria de la T1 (debido a que la primera columna es clave ajena));"

"(2, 30, 230)(no daría problemas);"

Usando el mismo escenario, seguiremos con la sentencia UPDATE:

"UPDATE T1 SET a=2 WHERE a=1;" (UPDATE "nombre de la tabla" SET "nuevo dato" WHERE(para filtrar por el que queramos cambiar, si no cambiaría todo, filtramos por la clave primaria)"dato antiguo"). (en este caso no funcionaría porque el valor 2 esta duplicado)(hay que tener en cuenta las restricciones tanto en INSERT como en UPDATE).

"UPDATE T1 SET a=5 WHERE a=1;"(en este caso funcionará).

"UPDATE T2 SET e=220 WHERE d=20;"(funcionaría).

"UPDATE T2 SET a=5 WHERE d=20;"(funcionaría).

"UPDATE T2 SET a=2,d=10, e=100 WHERE d=20;"(funcionaría).

"UPDATE T1 SET a=6, b=60, c=600 WHERE a=2;"(daría un error de integridad referencial, debido a que habría que cambiar los datos de la clave ajena también, a no ser que se cambie la restricción por "CASCADE" por ejemplo, entonces sí funcionaría, porque los valores se cambiarían en todos).

Por último hemos practicado con la sentencia "DELETE".

Se han tenido que cambiar los datos antes de T2 por (7, 30, 230).

"DELETE FROM T2 WHERE d=30;"(funcionaría).

Ahora se cambian los datos de T1 por (7, 70, 700).

"DELETE FROM T1 WHERE a=7;"(no funcionaría, debido a que la clave ajena tiene un RESTRICT, a no ser que se cambie por, por ejemplo, CASCADE, entonces funcionaría y se borrarían los datos).

Lenguaje de Marcas (15/12/2020)

 Continuación Unidad 2-CSS pseudoelementos

En la clase de hoy se ha hecho un breve repaso al principio sobre lo visto anteriormente sobre los selectores.

Después se ha continuado, dentro de los selectores, con la parte de pseudo-clases. Se usa para seleccionar elementos en función del comportamiento posterior del usuario. Algunas pseudo-clases practicadas en clase:

:link, en enlaces nunca visitados.

:visited, para enlaces visitados.

:hover, para cuando se pasa el cursor sobre el enlace.

A continuación hemos visto algunos de los pseudo-elementos, mediante una practica en clase utilizando:

:first-line, aplica estilos a la primera línea de un elemento de bloque.

:first-letter, aplica estilos a la primera letra de la primera línea de un elemento de bloque.

:before, crea un pseudoelemento que es el primer hijo de un elemento seleccionado, se usa para añadir contenido estético a un elemento que contenga la propiedad "content".

:after, crea un pseudoelemento que es el último hijo de un elemento seleccionado. Se usa también para añadir contenido estético a un elemento que tenga la propiedad "content".

Lenguaje de Marcas(14/01/2021)

Cajas HTML5, etiqueta "span", atributos CSS para cajas

En la clase de hoy, lo primero ha sido poner la fecha de entrega para los que tengan que recuperar el proyecto de Lenguaje de Marcas. A continuación se ha continuado con la parte del temario sobre las Cajas. Se ha hecho un breve repaso de las cajas y el último ejercicio hecho en la clase anterior, después se ha continuado con la etiqueta <span>, que se utiliza de forma similar a un <div>, solo que para aspectos más concretos, como elementos dentro de las cajas, palabras, letras, etc. 

Hay una serie de atributos para aplicar a las cajas para maquetar. Entre ellos se encuentran: Margin (separar entre cajas o elementos), border (establece una delimitación para remarcar el espacio de la caja), padding (separación entre el borde y el contenido), position (posiciona las cajas), overflow(comportamiento de la caja en caso de desborde), etc. Cada uno tiene diferentes tipos, por ejemplo margin-top, magin-bottom, padding-left, border-color, border-top, etc.

Por último se ha visto los elementos flotantes o también llamados "float".

Bases de Datos (01/02/2021)

Introducción a "SELECT FROM" y prácticas

En la clase de hoy hemos empezado haciendo un repaso de lo visto anteriormente con las sentencias "update, insert y delete". También veremos la sentencia "select", usada por ejemplo para los casos de consultas, es decir, cuando queremos filtrar por cierto contenido cuando estamos comprando online.

Siempre habrá que poner la parte del "select" y la parte "from", en la parte del "select" irían las columnas de la tabla y en la parte from se pondrán las tablas vistas previamente. En código, por ejemplo de HeidiSQL, viene como "select * from" y después el resto de código e información. Se ha cargado en el servidor Debian la base de datos "ejemplo" y se han cargado las tablas.

Con select se escribe el nombre de las columnas y en from se escribe el nombre de la tabla.

usando "limit", y un número, solo se ven los que se especifiquen en la ventana de comandos.

 Repaso: para acceder a mariadb por ejemplo, o cualquier otra, se escribe mysql -uadmin -padmin".

Insertar datos, actualizar y borrar datos. Si queremos ver algo de la tabla en los comandos, escribimos "desc" y el nombre de la tabla y aparecerá, si queremos ver algo de dentro de la tabla escribimos el "select", nombre de lo que queremos ver y si queremos filtrar escribimos después el "limit" y un número.

"use ejemplo;" para entrar en la base de datos de "ejemplo", con "show databases" podemos ver las bases de datos que tenemos disponibles. Luego con "show tables" podemos ver el contenido de la base de datos que hayamos elegido. con "desc" y el nombre de la tabla podemos ver los campos que dispone. Con "select * from" y el nombre de la tabla podemos seleccionar más especifico algo.

En el programa cliente de HeidiSQL también podemos escribir las sentencias y ejecutarlas al igual que en el servidor.

Hemos hecho un ejercicio en "ejemplo" de práctica. para modificar el contenido de algo mediante el comando "alter". En código para añadir un nuevo campo sería "alter table 'profesores' add column 'nota' int (2) null after 'ingreso';". En este ejercicio en el que se añade un nuevo campo 'nota' para los profesores. Se empieza con el "select * from profesores" para que aparezca el contenido de dentro de la tabla, luego un "update profesores set nota 5 where nombre( el where es para que no afecte a todas las filas del contenido de la tabla)". Los numeros enteros no hace falta usar comillas, también solo se pueden usar enteros en este caso puesto que la nueva columna es de tipo "int". 


Base de Datos (18/01/2021)

Prácticas en cada entorno de trabajo de BBDD

En la clase de hoy hemos empezado practicando la creación de tablas, a través de los comandos desde VirtualBox con el servidor Debian de BBDD. Nos hemos conectado al servidor, utilizando el comando MySQL -u"usuario" a continuación y -p"contraseña". A continuación se introduce el "show databases" para ver el cuadro de información. Después se introduce, por ejemplo el "create database ejemplo2", aparece algo más de información y se vuelve a introducir "show databases". Se introduce "create tabla1" para crear una tabla, apareceria un error de no seleccionada una database, hay que utilizar el comando "use" para crear la "database", por ejemplo "use ejemplo2", se carga la "database" y después se introduce el comando "create table tabla1(", aparecerá los datos que hay que introducir, un "nombre varchar(un número que corresponde a la cantidad de letras del nombre)", no escribir con acentos, mayúsculas, símbolos o espacios entre los nombres que introducimos para la tabla. Después se escribe por ejemplo el "fechanacimiento date" y la primary key (con el campo entre paréntesis "nombre"), con el comando "desc tabla1" podemos ver la información de la tabla después de incluir las columnas y campos que hemos introducido. 

Se puede crear una nueva tabla introduciendo los comandos seguidos, por ejemplo: "create table tabla2( dni char(9), apellidos varchar(20), salario decimal(6,3), primary key(dni));". Después se introduce el "desc tabla2;" para visualizar como ha quedado la tabla.

Para borrar una tabla era usando el comando drop y el elemento que se quiere borrar, "drop table tabla2;", se borrará la tabla2, hay que tener cuidado porque haciéndolo así se borrará la tabla y el contenido que tengamos dentro. En el ejercicio ejemplo se borra también la "tabla1" con el drop. Se crea una tabla jefes: "create table jefes( nombre varchar(15), fechanacimiento etc;" como en el anterior. Se introduce el "show tables;" para ver las tablas que hay creadas, que serán empleados y jefes, se introduce el "desc empleados;" y "desc jefes;" para ver la tabla que se ha creado de empleados y jefes, se introduce el comando "alter table jefes add apellidos varchar (20) not null;" para alterar la tabla e introducir un nuevo campo o columna. Se comprueba con el "desc jefes;", se usa otro "alter table jefes drop apellidos" para borrarlo. A continuación se ha introducido un "alter table jefes add primary key (nombre);" saldrá que hay multiples primary key definidos, se utiliza el "create table personal (telefono int);" se hace la comprobación con "desc personal;", se crea otro "alter table personal add primary key (telefono);" y se comprueba siempre con "desc personal;". Se incluye otro comando "alter table personal change telefono tlf int;". Se comprueba con "desc personal;". Se introduce un "alter table personal modify tlf varchar(11);" para cambiar el tipo de dato de un entero a un varchar, y se comprueba con el "desc personal;".

Tras realizar este ejercicio de práctica hemos entrado en el MySQL Workbench, previamente instalado en nuestro equipo, es el cliente donde vemos también las tablas, columnas, etc, en general las bases de datos que vamos creando. Es más o menos similar a al SGBD HeidiSQL. En él hemos visto las diferentes funciones que dispone el programa a la hora de crear una base de datos o unas tablas con sus columnas correspondientes. Este programa dispone de mayores opciones de personalización que HeidiSQL. Hemos aplicado ingeniería inversa en el programa. Dentro de MySQL Workbench se pueden realizar diagramas de entidad/relación parecidos a los que se creaban con la herramienta case DIA. Mediante el programa cliente de MySQL Workbench se puede realizar de forma mas asistida lo que hemos trabajado mediante los comandos a través del servidor Debian de BBDD con VirtualBox.

Por último se ha hecho una introducción de phpMyAdmin, otro cliente como por ejemplo MySQL Workbench, pero a nivel web, sin tener que descargarlo e instalarlo. se utiliza la ip de cada uno y justo después se escribe phpMyAdmin (ip/phpMyAdmin/), aparecerá una página donde hay que introducir un usuario y una contraseña. Se ha trabajado con esta herramienta creando también una base de datos, con tablas , columnas, etc.

Bases de Datos (15/01/2021)

En la clase de hoy se ha seguido practicando sobre la creación de una base de datos, mediante un ejercicio de ejemplo sobre crear una base de datos. Utilizando los comandos de creación de tablas dentro de nuestro servidor debian y virtualbox, podemos crearlas luego en nuestro sistema gestor de bases de datos de HeidiSQL. Al hacer esto se crea un script con el contenido de lo que hemos creado, que debemos revisar para evitar errores o warnings

jueves, 25 de febrero de 2021

Lenguaje de Marcas (25/02/2021)

Audio y Video en HTML5 y Práctica de ayuda para Proyecto

En la clase de hoy hemos empezado viendo un tutorial sobre un programa que nos permite grabar la pantalla, de cara al proyecto de Lenguaje de Marcas, donde tenemos que grabar la pantalla mientras explicamos el proceso de creación de nuestro proyecto web. Además hemos continuado viendo una parte del temario sobre audios y videos, que nos ayudarán también en la parte de nuestro proyecto de Lenguaje de Marcas sobre hacer un video, poniendo nuestra voz para explicar el desarrollo de nuestro proyecto.

Las etiquetas para audio y video en HTML5 son: <video> y <audio>. Existen diferentes tipos de formato en los que se puede o se suelen subir los videos y audios como (MP4, WEBM, OGV para vídeos y OPUS,OGG o MP3 para audios).  

Hemos seguido con un ejemplo de como introducir videos en el código html 5 mediante un ejercicio resuelto para ver en Visual Studio Code. Ejercicio en el que se ha añadido mediante algunas etiquetas como, por ejemplo:

<audio controls>

<source src="contenido multimedia" type="audio/mp3"> y <track> para los audios, con sus respectivos atributos para añadir funcionalidades al contenido.

</audio>

<video width="320" height="240" controls>

<source src="contenido multimedia" type="video/webm">

</video>

En la etiqueta del video se pueden añadir atributos como por ejemplo: "autoplay" para que el video se auto reproduzca al mostrar la web en el navegador. "loop" para que el video se reproduzca una y otra vez cada vez que termina. "muted" para iniciar el video con el sonido muteado, etc. 

En la etiqueta de audio también se puede añadir estos atributos anteriores o los que la etiqueta audio soporte, haciendo el mismo efecto pero en un audio.

Aparte hemos seguido viendo otros puntos del temario que nos pueden ayudar a la hora de realizar nuestro proyecto de Lenguaje de Marcas:

La parte de temario relacionado con la optimización de los códigos, optimización de CSS y evitar errores de, por ejemplo, duplicar propiedades varias veces para la misma etiqueta html. Se proporcionan enlaces de sitios web donde nos pueden ayudar a optimizar el código css, eliminando código duplicado por ejemplo.

La parte relacionada con los formularios, la parte html de los formularios concretamente, por si nos faltase algo por hacer o corregir en esta sección del proyecto.



Bases de Datos (24/02/2021)

Información sobre Examen y Prácticas

En la clase de hoy se ha tratado el tema del examen de Bases de Datos, básicamente en que consistirá, la fecha de realización y horarios de cada grupo. Después hemos realizado un breve repaso de los temas vistos en la clase anterior y, por último, hemos estado realizando en clase una serie de ejercicios de repaso relacionados con los temas de los que constará el examen de BBDD.

Se empieza creando una Database mediante "CREATE DATABASE "nombre de la base de datos(ejerciciorepaso)";"

Después se usa el comando "use "nombre de la database";" 

Lo siguiente es "CREATE TABLE "nombre de la tabla(xx)"( 

coll INTEGER,

coll CHAR(3),

PRIMARY KEY (coll)

);"

ejecutamos y debería salir bien. Se ha tenido que crear la database, la tabla y las columnas (con la clave primaria en col1).

"insert into xx (col1, col2) values (1,'AA');"(en la práctica se ha comentado esta línea porque da fallo).

"insert into xx (col1, col2) values (2, 'BB');

"select*

from xx;" (para consultar la tabla).

"salimos y volvemos a entrar" (para comprobar que se han mantenido al irnos).

volvemos a consultar la tabla con "select".

Despues borramos la tabla "xx" con la sentencia "DROP" (DROP borra estructura + contenido de dentro, DELETE borra solo contenido).

"DROP TABLE xx;"

Creamos una tabla nueva "YY" con tres columnas.

"CREATE TABLE "nombre de la tabla(yy)"(

col1 INTEGER,

col2 CHAR(2),

col3 VARCHAR(10),

PRIMARY KEY (col1, col2) (recordatorio: las claves primarias no aceptan valores nulos).

);"

actualizamos y saldrá la nueva tabla con su contenido.


martes, 23 de febrero de 2021

Lenguaje de Marcas (23/02/2021)

Práctica sobre "Float", con elementos de bloque y columnas

En la clase de hoy hemos revisado la solución de un ejercicio práctico sobre los "float", que habíamos empezado a ver en la clase anterior, que inicialmente venía sin estilos y había que añadirlos. El ejercicio contenía partes como: navegadores ("nav") que había que cambiar de elementos de bloque a elementos en línea con "display: inline-block;" y otro en columna como navegador lateral, usando "float: left;" para posicionarlo a la izquierda, convirtiéndolo en elemento flotante, entre otras propiedades. La "section" que contiene las imágenes, estaría dividido en tres "div" posicionados en fila, mediante un "float: left;" al igual que el nav de al lado para posicionarse, se da unos márgenes para crear un espacio entre los navegadores y el "section" pero siempre sin superar el 100% del tamaño para que se mantengan en esas posiciones, si no se posicionaría debajo debido a la falta de espacio. El contenido dentro de la "section" esta centrado mediante un "text-align: center;", las imágenes se han reducido a un 50% con un "width" para que se coloquen correctamente. El otro "section", debajo del anterior, es algo más básico, dividido en tres columnas mediante un "column-count: 3;", con un párrafo cada uno. Por último dispone de un "footer" con un texto que contiene un enlace, usando la propiedad "clear: both;". 

Para el próximo día, para continuar con la práctica de páginas web, se ha propuesto realizar otro ejercicio para crear una página web algo más complejo, con una serie de instrucciones pero teniendo que realizar la creación desde cero.

martes, 16 de febrero de 2021

Lenguaje de Marcas (16/02/2021)

Columnas y Práctica

En la clase de Lenguaje de Marcas de hoy hemos revisado brevemente algunos aspectos sobre la entrega del proyecto de lenguaje de marcas. Además hemos hecho mención de los contenidos vistos en la clase anterior. Después hemos continuado con la parte CSS relacionada con las columnas. Nos encontramos con algunos ejemplos como, "column-gap", para dar espacio entre columnas. "column-span", si el elemento queremos que tenga las características o el formato de la columna. "column-fill" , para establecer el relleno de las columnas teniendo el contenedor una altura, entre otras propiedades más. Para ver como se comportan algunos de ellos, los hemos visualizado en un navegador, a través de un ejercicio práctico ya resuelto. Por ejemplo, en el código css, dispone de la propiedad "column-count: 3;", esto significa que el contenido se divide en tres columnas, se ha comprobado que al quitar esa propiedad, los elementos de esas tres columnas tienden a ocupar todo el ancho de la página y una debajo de otra, desapareciendo la forma de columna. En otro div del ejercicio, se incluyen el "column-gap: 40px;" (separación entre columnas) y "column-rule: 5 px solid red;" (para dar un borde entre las columnas)(parecido a la propiedad "border"). Aunque el ejercicio lo hemos estado viendo en Mozilla Firefox, el código css de la página contiene una propiedad que no funciona en este navegador, por lo tanto se ha tenido que visualizar también con otro navegador donde esa propiedad funcionase.

lunes, 15 de febrero de 2021

Bases de Datos (15/02/2021)

Seguridad en BBDD, Sentencias sobre la Seguridad

Al principio de la clase de hoy hemos estado revisando unos ejemplos que tienen relación como las entregas que debemos realizar de nuestro proyecto de Bases de Datos, sirviéndonos de posible guía a la hora de hacer nuestro proyecto. 

Después de esto hemos continuado con la parte relacionada con la seguridad dentro de las bases de datos, como por ejemplo, la parte de los usuarios, permisos, contraseñas, etc. Anteriormente se practicó usando el MySQL Workbench, pero esta vez se ha practicado con HeidiSQL. Hemos creado un nuevo servidor de usuario, con menos permisos, comprobando que disponemos de menos opciones de personalizar o modificar el contenido. Si nos conectamos como administrador al servidor, podemos gestionar los usuarios que pueden entrar, modificar sus contraseñas, otorgar o quitar permisos, indicar que solo pueda acceder desde el equipo local (LocalHost) o desde cualquiera, etc. 

Hemos practicado dando permisos para acceder a una base de datos a un usuario, al realizar cualquier cambio, se produce código con las sentencias que indican que hemos realizado cambios, como, por ejemplo, las sentencias "SHOW GRANTS FOR" para mostrar los privilegios que tiene un usuario o "GRANT USAGE ON" que indica que se está otorgando unos privilegios, "FLUSH PRIVILEGES" que indica que se han modificado sus privilegios. Se pueden crear dos usuarios con el mismo nombre y contraseña pero que uno pueda acceder solo desde el equipo local (LocalHost) y otro desde cualquiera. Podemos borrar un usuario también desde el administrador, saliendo la sentencia "DROP USER", que indica el usuario que hemos eliminado. Al eliminar un permiso a un usuario para acceder a, por ejemplo, una base de datos, saldría la sentencia "REVOKE" tras realizar el cambio en la ventana de código. Al cambiar la contraseña a un usuario, tras realizarlo, surgirá la sentencia "SET PASSWORD" en la ventana de código. Es importante conocer tanto la manera de modificar cosas a través de la interfaz, como a través de las sentencias en el código, ya que si se realizan correctamente, tendría que ocurrir lo mismo en ambos casos. Para acceder al mismo servidor a través de "phpMyAdmin", hay que escribir en la url del navegador la ip del servidor que utilicemos, seguido por "/phpmyadmin", tras esto, nos llevará a la página de phpMyAdmin para introducir el usuario y la contraseña, y poder acceder a las bases de datos.

viernes, 12 de febrero de 2021

Bases de Datos (12/02/2021)

Base de Datos mediante AWS (Amazon) y creación de usuarios en Workbench

En la clase online de hoy de Bases de Datos se ha visto como crear una base de datos mediante "AWS" (a través de Amazon), que para crearla tenemos que acceder desde nuestro correo y crear una "cuenta", aquí podremos subir nuestros "scripts" de nuestros proyectos o prácticas de bases de datos. Dentro de AWS tendremos las bases de datos en conjunto para poder visualizarlas otorgando los permisos correspondientes.

Como recordatorio de repaso, a nivel de seguridad, si no queremos que se nos vean las contraseñas en la pantalla de servidor de MariaDB por ejemplo, después de escribir el usuario con la instrucción "mysql -uadmin- " escribimos después "-p-pulsamos enter" y saldrá para escribir la contraseña en oculto debajo.

También hemos visto la parte de creación de usuarios, en MySQL Workbench en este caso. vamos a "users and privileges"-escribimos un nombre de usuario(login name)(hay usuarios normales, admin, root, etc)-en "limit to hosts matching" podemos indicar que solo pueda acceder de forma local desde ese servidor o equipo.

Por defecto, en los tipos de roles vienen algunas predeterminadas junto con privilegios globales (a la derecha) sin marcar. Pulsando el primer rol(DBA) se seleccionarían todos los demás a la vez que todos los privilegios globales. Dependiendo del usuario tendrá unos roles o privilegios concretos.

Podemos comprobar accediendo mediante un usuario admin o usuario normal para ver las diferencias, creando un usuario normal por ejemplo en MySQL Workbench. Al entrar con el usuario normal tendremos limitaciones a la hora de visualizar o modificar cosas. 

jueves, 11 de febrero de 2021

Lenguaje de Marcas (11/02/2021)

CSS, Desplazamiento "Float" y Práctica

En la clase de hoy de Lenguaje de Marcas hemos continuado con la parte de CSS dedicada a la maquetación, específicamente al Desplazamiento o denominado como "Float". Si queremos alinear por ejemplo dos párrafos, uno a la derecha y otro a la izquierda. Hemos aplicado el "display: inline-block", reduciendo el tamaño con "width" para poder posicionarlos uno al lado del otro. A continuación, usando los "float", se han posicionado a cada lado. El problema es que, los dos párrafos son elementos flotantes y, al añadir un tercer párrafo, este se posiciona en el medio. Se ha utilizado un "overflow-y: auto" para cuando el contenido de una caja es mayor que la altura de la caja, se sobresale de la caja, podamos ajustarlo. Utilizamos el "clear" para que se tenga en cuenta los flotantes para que el tercer párrafo se posicione en el lugar correspondiente con respecto a los otros dos, en este caso se posiciona debajo de los otros.

Hemos abierto otro ejercicio de ejemplo hecho para visualizar como quedarían aplicadas estas reglas de CSS con los elementos de HTML en una página web.

martes, 9 de febrero de 2021

Lenguaje de Marcas (09/02/2021)

Repaso proyecto y Prácticas

La clase de hoy la hemos dedicado a revisar el contenido de la siguiente parte del proyecto de Lenguaje de Marcas de la segunda evaluación, el contenido que se deberá de incluir en el proyecto, los pasos a seguir, etc. Por último, lo hemos dedicado a ver el ejercicio práctico realizado la semana anterior sobre Posicionamiento y Z-Index, donde se ha ido explicando el contenido HTML de la página web, su función, localización y como se ha formado. Después se ha visto la parte de CSS que contiene este ejercicio.

lunes, 8 de febrero de 2021

Bases de Datos (08/02/2021)

Normalización de Relaciones, introducción Formas Normales (1FN, 2FN y 3FN)

En la clase de hoy hemos hecho un repaso de lo visto en la anterior clase de BBDD sobre la Normalización, donde se acabó la clase anterior viendo las denominadas como "Formas Normales", o "1FN, 2FN y 3FN", también se denominan, de forma correspondiente, forma parcial, completa y transitiva. Hoy hemos continuado con las Formas Normales, comenzando por la Normalización de Relaciones. Esta normalización se basa en las dependencias funcionales, que consisten en que un conjunto de atributos o un atributo de, por ejemplo "B", dependen de un atributo o conjunto de atributos de "A". Se requiere establecer una clave primaria de la que dependan los demás atributos. Siempre en estas relaciones, al conocer el valor de "A" podemos conocer los valores de "B". Se basan además de la descomposición de tablas en función de las dependencias funcionales.

Transformación a 1FN ("Primera Forma Normal" o "Parcial"). Se divide una relación en dos, a continuación deben identificarse los atributos de la clave principal y se descompone la tabla en dos proyecciones, que contiene dos relaciones. La primera relación es la clave + los atributos únicos o que tienen valor único, al crearse la nueva tabla con las claves, tendrá el mismo nombre que la original. La segunda relación es la clave + los atributos múltiples, la nueva tabla tendrá la clave y los valores múltiples, formando filas por cada valor, teniendo un valor elemental para el atributo. La tabla nueva tendrá como nombre la abreviatura de cada atributo que la definen.

Transformación a 2FN ("Segunda Forma Normal" o "Completa"). Se comprueba que se cumple el 1FN, después se realizan dos proyecciones, obteniendo dos tablas, una con la clave inicial y los atributos que dependen de ella, y la otra con la parte de la clave que tiene dependencias funcionales, convirtiéndose en clave nueva + los atributos que dependen de ella.

Transformación a 3FN ("Tercera Forma Normal" o "Transitiva"). Se debe de cumplir la 2FN y que no existan atributos no primarios que son transitivamente dependientes de cada posible clave de la tabla. Un atributo secundario solo se debería poder conocer a través de la clave principal o secundarias de la tabla. En un grafo de dependencias solo se deben mostrar las transitivas y no las de claves secundarias, debido a que al ser claves se conocen ya sus atributos. en conclusión, una relación en 3FN se cumple si está en 2FN y sus atributos dependen solo de la clave.

viernes, 5 de febrero de 2021

Bases de Datos (05/02/2021)

Afianzando conocimientos e introducción al Diseño Físico y Normalización

En la clase de hoy hemos empezado repasando los contenidos vistos anteriormente, también hemos visto las fases de las que se compone el diseño de datos o de las bases de datos. La fase tres de un proyecto, el Diseño físico, tiene como objetivos el tiempo de respuesta, aprovechamiento del espacio, productividad de las transacciones. Este diseño tiene unas entradas: salida del diseño lógico, consultas, transacciones y aplicaciones a ejecutar y exigencias de rendimiento de los usuarios. El diseño físico tiene unas tareas como trasladar el modelo de datos lógico al SGBD, las estructuras de almacenamiento, los caminos de acceso (índices), la desnormalización y la monitorización y los ajustes. 

Hemos ido haciendo una práctica sobre Normalización, donde hemos aprovechado para repasar como se realizaría desde el principio el ejercicio, comenzando por el modelo de entidad/relación, el paso a tablas y luego creando la base de datos. Hemos creado una base de datos llamada normalización en MySQL Workbench y le introducimos los datos de las tablas, empleado, proyecto y trabaja.

Dentro de la Normalización hay varias formas básicas de generar las tablas: Primera Forma Normal (1FN): Todo dato que esté dentro de una columna debe ser único. Segunda Forma Normal (2FN)(próxima clase).

jueves, 4 de febrero de 2021

Lenguaje de Marcas(04/02/2021)

Introducción a la "API" sobre el Modelo de Objetos del Documento (DOM)

En la clase de hoy hemos empezado viendo una API (Application Programming Interface) denominada DOM (Modelo de Objetos del Documento). El DOM proporciona una representación de la página web en forma de árbol. Permite la modificación del contenido o la presentación visual. El modelo HTML DOM esta construido como un árbol de objetos. Un documento se modela mediante objetos, donde hay que comprender no solo la estructura de los objetos sino también su comportamiento. Después hemos visto un video (que nos podría servir también un poco de guía para nuestro proyecto de lenguaje de marcas sobre el currículum) sobre el DOM. 

Para nuestro proyecto de lenguaje de marcas debemos hacer una documentación donde incluyamos entre otras cosas un boceto o esquema de como tendría que quedar nuestro proyecto antes de empezarlo, para llevar un mejor orden y el paso a paso a la hora de diseñarlo.

Por último hemos dedicado el tiempo restante ha trabajar con un ejercicio práctico, de ejemplo, sobre "position" y demás elementos y propiedades aprendidas, al final hemos empezado entre todos un análisis del contenido para ir corrigiendo lo que hemos hecho.

miércoles, 3 de febrero de 2021

Bases de Datos (03/02/2021)

MySQL Workbench y prácticas con sentencias nuevas ("WHERE")

En la clase de hoy hemos iniciado las bases de datos usando esta vez el cliente MySQL Workbench. Para configurarlo se hace de una forma similar a cuando se hace en HeidiSQL, usando el servidor Debian y mediante la instrucción "ip a" se introduce la ip en MySQL Workbench y se crea la base de datos para poder acceder. Como en el servidor de Mariadb se guardan las bases de datos, tendrían que aparecer automáticamente en MySQL Workbench, mientras tengamos el servidor de Mariadb abierto. Si no, habría que añadirlo dentro del cliente, cargando la base de datos. 

Después hemos trabajado con el Workbench de una forma similar a cuando lo hacíamos con HeidiSQL, usando también los comandos e instrucciones para modificar tablas, visualizarlos, etc. Podremos seguir practicando mediante una serie de ejercicios para aprender.

Hemos visto la sentencia "where", que se escribe a continuación de la sentencia "from", el contenido de "where" tiene relación con los operadores como AND, OR, NOT, <, >, <=, etc. 

Hemos empezado a realizar una serie de ejercicios para practicar y asimilar conceptos, trabajándolo dentro del Workbench, mediante el uso de las sentencias que hemos ido aprendiendo. por ejemplo para hacer consultas, hay que usar, como ejemplo, el "select * from asignaturas". O "select categoría from profesores;"

Para realizar la práctica del examen habrá que crear lo siguiente: crear archivo script-consultas proyecto-extensión-.sql. Como recordatorio hay que poner comentarios en las practicas que hagamos para demostrar que sabemos lo que estamos haciendo.

martes, 2 de febrero de 2021

Lenguaje de Marcas (02/02/2021)

Etiqueta "position" y tipos de "position"

En la clase de hoy vamos a empezar a ver la etiqueta "position", con una serie de tipos de posiciones: "static, relative, absolute, fixed, sticky o inherit". Además está relacionado con las propiedades "top, bottom , left, right y z-index". El "z-index" se usa para establecer un orden a la hora de crear capas, para posicionar elementos uno delante de otro cuando se solapan, 

El "static" es el valor por defecto, sigue el flujo y no se aplica el uso de "top, bottom, z-index, etc".

El "relative" es similar al static,  pero este si que se ve afectado por "top, z-index, left, etc".

El "fixed" se le aplican las propiedades anteriores relativos al documento, pero no atiende a scroll, se queda fijo en el mismo sitio.

El "absolute" se comporta como el fixed pero relativo a la primera etiqueta que tenga "position: relative".

El "sticky" se comporta como "relative" hasta que llega a una posición de scroll, después pasa a comportarse como "fixed".

El "inherit" hace que "position" pueda propagarse en cascada, siempre que se añada el "inherit" a los elementos hijo que queramos que lo hereden.

A continuación hemos visualizado en un navegador un ejercicio de ejemplo sobre "position", mediante la herramienta inspectora hemos visto las propiedades y como se comportan los elementos en el navegador al desactivar o activar los tipos de "position" incluidos en el ejercicio práctico.


Entrada de Bienvenida al Blog