Cómo consumir la PokéAPI con PHP y mostrar Pokémon en tu sitio web

Marzo 3, 2025 - Tiempo de lectura: 16 minutos

¿Eres fan de Pokémon y estás aprendiendo PHP? ¡Entonces este tutorial es para ti! Vamos a aprender cómo consumir la PokéAPI, una API gratuita y abierta que proporciona información detallada sobre todos los Pokémon, y mostrar algunos datos en tu sitio web utilizando PHP.

🎯 ¿Qué es la PokéAPI?

La PokéAPI es una API RESTful gratuita que ofrece acceso a una amplia base de datos con información sobre los juegos principales de Pokémon. Puedes obtener datos sobre especies, habilidades, tipos, movimientos y mucho más.

🧰 Requisitos previos

Antes de comenzar, asegúrate de tener lo siguiente:

Un servidor con PHP instalado (puede ser local con XAMPP, MAMP, WAMP, etc.).
Conexión a Internet para realizar las solicitudes a la API.
Un editor de texto o IDE para escribir tu código PHP.

🔌 Paso 1: Realizar una solicitud a la PokéAPI

Vamos a utilizar la función file_get_contents de PHP para realizar una solicitud HTTP GET a la PokéAPI y obtener información sobre un Pokémon específico.

<?php
// Nombre del Pokémon que queremos consultar
$pokemon = 'pikachu';

// URL de la API para obtener información del Pokémon
$url = "https://pokeapi.co/api/v2/pokemon/$pokemon";

// Realizar la solicitud GET y decodificar la respuesta JSON
$response = file_get_contents($url);
$data = json_decode($response, true);

// Mostrar algunos datos del Pokémon
echo "<h1>" . ucfirst($data['name']) . "</h1>";
echo "<img src='" . $data['sprites']['front_default'] . "' alt='" . $data['name'] . "' />";
echo "<p>Altura: " . $data['height'] . "</p>";
echo "<p>Peso: " . $data['weight'] . "</p>";

// Mostrar los tipos del Pokémon
echo "<p>Tipo(s): ";
foreach ($data['types'] as $type) {
    echo $type['type']['name'] . " ";
}
echo "</p>";
?>

Este código obtiene información sobre Pikachu y muestra su nombre, imagen, altura, peso y tipos.

🔄 Paso 2: Hacerlo dinámico con un formulario

Para permitir que los usuarios busquen cualquier Pokémon, podemos agregar un formulario HTML que envíe el nombre del Pokémon al script PHP.

Y modificar el código PHP para utilizar el valor ingresado por el usuario:

<?php
if (isset($_GET['pokemon'])) {
    $pokemon = strtolower($_GET['pokemon']);
    $url = "https://pokeapi.co/api/v2/pokemon/$pokemon";

    $response = @file_get_contents($url);

    if ($response === FALSE) {
        echo "<p>Pokémon no encontrado. Por favor, verifica el nombre e intenta nuevamente.</p>";
    } else {
        $data = json_decode($response, true);

        echo "<h1>" . ucfirst($data['name']) . "</h1>";
        echo "<img src='" . $data['sprites']['front_default'] . "' alt='" . $data['name'] . "' />";
        echo "<p>Altura: " . $data['height'] . "</p>";
        echo "<p>Peso: " . $data['weight'] . "</p>";

        echo "<p>Tipo(s): ";
        foreach ($data['types'] as $type) {
            echo $type['type']['name'] . " ";
        }
        echo "</p>";
    }
}
?>

Este código permite que los usuarios ingresen el nombre de un Pokémon y vean su información correspondiente.

🧪 Paso 3: Probar la aplicación

Guarda el código anterior en un archivo .php (por ejemplo, pokedex.php) y colócalo en el directorio raíz de tu servidor web. Luego, accede a http://localhost/pokedex.php en tu navegador, ingresa el nombre de un Pokémon y haz clic en "Buscar" para ver su información.

🧠 Consejos adicionales

La PokéAPI es gratuita y no requiere autenticación, pero es importante respetar su política de uso justo para evitar sobrecargar el servicio.
Puedes explorar más endpoints de la API para obtener información adicional, como habilidades, movimientos, evoluciones y más.
Considera implementar almacenamiento en caché para reducir la cantidad de solicitudes a la API y mejorar el rendimiento de tu aplicación.

¡Y eso es todo! Has creado una sencilla Pokédex utilizando PHP y la PokéAPI. Puedes expandir esta aplicación para mostrar más información, agregar estilos con CSS o incluso utilizar frameworks como Laravel para crear una aplicación más robusta.