Want to create interactive content? It’s easy in Genially!

Get started free

Presentación vaporwave

familiaaguilarcasanova

Created on March 21, 2024

Start designing with a free template

Discover more than 1500 professional designs like these:

Transcript

Código limpio

START

Buenas prácticas a la hora de limpiar el código

ESTRUCTURA TU CONTENIDO

[Subtítulo 0X]

Xampp

- BBDD: ejercicio1- Tabla: meteo- Datos

Xampp

ConexionPDO.php

Original

ConexionPDO.php

Código mejorado

Mejoras del código:- Cambiamos el usuario a root.-Introducimos el nombre de la base de datos.

meteodata.php

Original

meteodata.php

Código mejorado

Mejoras del código. - Manejo de los errores PDO a través de bloques try-catch. - Clasificamos el tipo de petición en función de si es de mapa o de ciudad. -Uso de un JSON encode para la salida de los datos. -Manejo de una API externa y manejo de errores de cURL.

- script: para coger el mapa de Google Maps.- script: libreria jquery, para editar HMTL. -body: dimensiones mapa.

maps.html

original

index.html

Mejoras del codigo

Mejoras del código:-Cambio de google maps a leaflet.-Inclusión de la hoja de estilo de leaflet.

funciones.js

Original

funciones.js

Original

Mejoras del código. - DOMContentLoaded: Espera a que la página cargue y ejecuta dos funciones. - obtenerUbicacionYEnviar(): Obtiene y envía la ubicación del usuario al servidor. - enviarUbicacionYMostrarEnMapa(): Centra el mapa, envía datos al servidor y maneja la respuesta y errores.

funciones.js

Código mejorado

Mejoras del código. - mostrarEnMapa(latitud, longitud): Crea un mapa centrado en las coordenadas proporcionadas. Agrega un marcador en la ubicación actual del usuario en el mapa. - cargarMarcadoresCiudades(): Obtiene datos de ciudades desde el servidor. Muestra los marcadores de las ciudades en el mapa.

Resumen

Código mejorado

Mejoras del código. - mostrarMarcadores - case - tamaño

funciones.js

Código mejorado

Resultado - Original

Resultado-Mejorado