Ejercicios AJAX - API Rest

¿Qué son las API Rest?

Las APIs que funcionan como la PokéAPI se llaman APIs REST (o RESTful).

Hoy en día casi todas las APIs REST utilizan JSON como su formato favorito para enviar y recibir datos porque es súper ligero y se lee de forma nativa en JavaScript (de ahí su nombre: JavaScript Object Notation).

REST es un estilo de arquitectura de APIS que significa Representational State Transfer (Transferencia de Estado Representacional) y se basa en unas reglas muy sencillas:

  1. Utiliza métodos HTTP estándar.

    Para consumir datos en la API se usa fetch(url), que por defecto, hace una petición GET al servidor lo cual sirve para leer datos.

    Sin embargo, si somos nosotros quienes queremos crear una API nueva en un servidor, usaríamos POST para crear datos, PUT o PATCH para editar datos y DELETE para borrarlos

  2. Se basa en Recursos (URLs claras):

    En las API REST, cada cosa es un "recurso" y tiene su propia dirección web única (Endpoint).

    .../api/v2/pokemon -> El recurso es la lista de Pokémon.

    .../api/v2/pokemon/25 -> El recurso es un Pokémon específico (Pikachu).

    .../api/v2/type/fire -> El recurso son los Pokémon de tipo fuego.

  3. Es Stateless (Sin estado):

    A la PokéAPI no le importa quién eres, ni qué Pokémon miraste hace cinco minutos. Cada petición que hace tu botón "Siguiente" o "Anterior" es totalmente independiente.

    Una API Rest recibe una URL, devuelve un JSON y se olvida de ti.

No confundir: REST vs. JSON

Dado que usualmente las API Rest sirven los datos en JSON, es muy común confundirlos:

REST es como la carretera y las normas de tráfico (cómo se viaja, las URLs, los métodos GET/POST).

JSON es como el paquete del transportista que va dentro de un camión (el formato del texto que contiene los datos).

Ejercicios

Crear una lista de "Pokemones Favoritos" en el LocalStorage (Guardar al hacer clic)

Modifica el programa que consume la PokéAPI de manera que al ver el detalle de un Pokémon, haya un botón de "Añadir a Favoritos". Este botón deberá llamar a una función que guarde el Pokemon deseado en el localStorage

Crea la función para guardar en localStorage

Crea un programa que te permita auditar lo que está guardado en tu localStorage. Aprovechando que el localStorage se comporta como un objeto iterable, puedes utilizar un bucle for tradicional junto con los métodos .key() y .getItem().

Haz un programa similar al PókeAPI

Revisa los directorios de APIS públicas y gratuitas de la sección de referencia y haz un programa similar al de PókeAPI con la API de tu preferencia.

Crea una Galería de Fotos con una API de tu preferencia.

Revisa los directorios de APIS públicas y gratuitas de la sección de referencia y haz una galería de fotos 100% responsiva con la API de tu preferencia.

Referencias:

Cuando entres a estos directorios, fíjate siempre en una columna que suele decir "Auth: No". Esto significa que la API es pública y libre