Crea una API con datos abiertos y píntala en un mapa de LeafletJS (I)

Creamos un backend basándonos en una capa de datos abiertos. Son monumentos de Castilla y León, pero podría ser cualquier otra cosa que tuviera coordenadas.

Lo que haremos será pintarlo en un mapa usando LeafletJS.

En esta primera parte nos centramos en el proceso de importación de los datos y como los exponemos hacia el exterior mediante una API Rest.

Marcas de tiempo

00:00 Extra: Presentación del LiveChallenge

04:22 Arquitectura de la aplicación

08:16 Usando datos abiertos

13:09 Convertir JSON en CSV (¡Perla!)

20:07 API con Laravel

24:50 Crear modelo de datos

28:20 Migración de base de datos

32:00 Leer el error (¡Perla!)

37:00 Importar CSV a la base de datos

40:10 Shell de PHP y Laravel con Tinker

46:44 Eloquent ORM

52:50 Ruta para mostrar resultados de la API

58:00 Mapas con Leaflet

1:01:00 Plantilla base en Laravel

1:04:17 Preparando lo necesario para el mapa

1:08:25 Javascript en Laravel

1:13:40 Inicializando Leaflet

1:19:21 Primer marker en el mapa

1:21:10 Cargar datos de la API en el mapa con fetch

1:26:48 Formato GeoJSON

¿Qué necesitas saber?

Trabajaremos con el framework Laravel de PHP y la base de datos MySQL a nivel básico.

Para el front usaremos JavaScript.

Nivel de dificultad

Intermedio

Tecnologías utilizadas

• JavaScript
• LeafletJS
• PHP
• Laravel
• MySQL
• CSV

Código

• Github

Recursos

• Datos abiertos

• Catálogo de monumentos

• Conversor de JSON a CSV

• LeafletJS

• Laravel.com

Contenidos relacionados en danielprimo.io

• Curso de LeafletJS
• Introducción a Laravel: Webapp de control de gastos
• WR 35: Leaflet, una alternativa a Google Maps
• WRP 82. Por qué elijo Laravel para crear proyectos web

Suscríbete o identíficate para ver el vídeo al completo.