DEV Community: Fernando Peralta

Cómo crear un plugin de WordPress: PHP, WooCommerce y Elementor

Fernando Peralta — Tue, 13 Oct 2026 22:21:00 +0000

Publicado originalmente en mi blog: Cómo crear un plugin de WordPress con PHP, WooCommerce y Elementor. Esta es la versión adaptada para DEV Community.

Mucha personalización de WordPress termina en functions.php. Funciona hasta que cambia el tema y la funcionalidad desaparece con él. Todo lo que debe sobrevivir al tema, como una regla de envío, una regla de precios o un widget propio, pertenece a un plugin.

Esta guía construye un plugin pequeño como estructuro el trabajo de clientes: un archivo de entrada limpio, hooks en lugar de ediciones, seguridad por defecto, una regla de WooCommerce y un widget de Elementor. La parte de WooCommerce refleja el tipo de trabajo que hice en Industria Social para GroovePro, donde las reglas de envío y los precios de bundles se mantuvieron en dos plugins PHP separados.

Los ejemplos usan un plugin inventado llamado Acme Shipping Rules. Cambia el prefijo (acme_sr_) por el tuyo.

Crea wp-content/plugins/acme-shipping-rules/acme-shipping-rules.php como archivo principal y añade ahí los hooks y funciones de los pasos 2 a 5. El widget va en widgets/class-acme-savings-widget.php; la limpieza va en uninstall.php. Los bloques que continúan el archivo principal no necesitan otra apertura <?php. La consulta SQL del paso 3 es un ejemplo independiente, no parte del plugin de envíos.

Paso 1: el archivo del plugin y su encabezado

Un plugin es una carpeta en wp-content/plugins/ con un archivo PHP principal. Solo Plugin Name es obligatorio en el encabezado, pero un plugin real debería declarar más, según los requisitos del encabezado de plugins de WordPress:

<?php
/**
 * Plugin Name:       Acme Shipping Rules
 * Description:       Ajusta las tarifas de envío de WooCommerce según la cantidad por paquete.
 * Version:           1.0.0
 * Requires at least: 6.5
 * Requires PHP:      8.3
 * Author:            Fernando Peralta
 * License:           GPL v2 or later
 * Text Domain:       acme-shipping-rules
 * Requires Plugins:  woocommerce
 */

// Bloquea el acceso directo al archivo.
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

Requires Plugins permite que WordPress se niegue a activar tu plugin si falta WooCommerce (WordPress 6.5 y posteriores). La guarda ABSPATH evita que alguien cargue el archivo fuera de WordPress.

Este ejemplo declara WordPress 6.5 como mínimo para usar Requires Plugins y PHP 8.3 como base. La versión de WooCommerce instalada puede exigir una versión de WordPress superior; comprueba sus requisitos de entorno. Elementor es opcional: sin él, el plugin mantiene la regla de envío y no registra el widget.

Dos hábitos que previenen la mayoría de las colisiones entre plugins:

Prefija todo: funciones, opciones, hooks y nombres de clases (acme_sr_).
Usa un text domain y envuelve los textos en __() o esc_html__() desde el primer día, para que traducir después no sea una refactorización.

Paso 2: hooks, no ediciones

WordPress es dirigido por eventos. Nunca editas el núcleo ni otro plugin: te enganchas a actions (hacer algo en un momento) y filters (cambiar un valor mientras pasa).

// Ejecuta algo cuando se activa el plugin.
register_activation_hook( __FILE__, 'acme_sr_activate' );

function acme_sr_activate() {
    add_option( 'acme_sr_threshold', 3 );
}

register_activation_hook() solo se dispara al activar, por lo que es el lugar correcto para crear opciones por defecto. Deja ahí cualquier preparación más pesada, como crear tablas, en lugar de hacerla en cada petición.

Paso 3: la seguridad no es opcional

El manejador comprueba permisos, verifica el nonce y valida un entero mayor o igual a 1 en el servidor. min="1" ayuda en el navegador, pero no sustituye esta validación. Los arrays, campos ausentes, texto, decimales y valores menores que 1 se rechazan sin cambiar la opción:

add_action( 'admin_post_acme_sr_save', 'acme_sr_save_settings' );

function acme_sr_save_settings() {
    if ( ! current_user_can( 'manage_woocommerce' ) ) {
        wp_die( esc_html__( 'No tienes permiso.', 'acme-shipping-rules' ), 403 );
    }

    // Verifica el token contra CSRF; no sustituye los permisos.
    check_admin_referer( 'acme_sr_save' );

    // Valida el tipo y el rango antes de guardar.
    $raw = isset( $_POST['threshold'] ) && is_string( $_POST['threshold'] )
        ? wp_unslash( $_POST['threshold'] )
        : '';

    $threshold = filter_var( $raw, FILTER_VALIDATE_INT, [
        'options' => [ 'min_range' => 1 ],
    ] );

    if ( false === $threshold ) {
        wp_die( esc_html__( 'La cantidad mínima debe ser un entero mayor o igual a 1.', 'acme-shipping-rules' ), 400 );
    }

    update_option( 'acme_sr_threshold', $threshold );
    wp_safe_redirect( admin_url( 'admin.php?page=acme-shipping-rules' ) );
    exit;
}

Registra una página en WooCommerce → Reglas de envío mediante admin_menu y add_submenu_page(). Este bloque pertenece al archivo principal e incluye la función que muestra el formulario:

add_action( 'admin_menu', 'acme_sr_register_settings_page' );

function acme_sr_register_settings_page() {
    add_submenu_page(
        'woocommerce',
        esc_html__( 'Reglas de envío', 'acme-shipping-rules' ),
        esc_html__( 'Reglas de envío', 'acme-shipping-rules' ),
        'manage_woocommerce',
        'acme-shipping-rules',
        'acme_sr_render_settings_page'
    );
}

function acme_sr_render_settings_page() {
    if ( ! current_user_can( 'manage_woocommerce' ) ) {
        wp_die( esc_html__( 'No tienes permiso.', 'acme-shipping-rules' ), 403 );
    }
    ?>
    <div class="wrap">
        <h1><?php esc_html_e( 'Reglas de envío', 'acme-shipping-rules' ); ?></h1>
        <form method="post" action="<?php echo esc_url( admin_url( 'admin-post.php' ) ); ?>">
            <input type="hidden" name="action" value="acme_sr_save">
            <?php wp_nonce_field( 'acme_sr_save' ); ?>
            <label for="threshold"><?php esc_html_e( 'Cantidad mínima por paquete', 'acme-shipping-rules' ); ?></label>
            <input id="threshold" name="threshold" type="number" min="1" step="1" required
                value="<?php echo esc_attr( get_option( 'acme_sr_threshold', 3 ) ); ?>">
            <button type="submit"><?php esc_html_e( 'Guardar', 'acme-shipping-rules' ); ?></button>
        </form>
    </div>
    <?php
}

Notas que vale la pena recordar:

Un nonce ayuda a proteger contra CSRF; no demuestra por sí solo el origen de una petición ni concede permisos. Usa también current_user_can(), como explica la documentación de nonces de WordPress.
Escapa en el momento de la salida: esc_html(), esc_attr(), esc_url(). Sanear al entrar no vuelve segura la salida.
Cualquier SQL propio pasa por $wpdb->prepare():

global $wpdb;

$table = $wpdb->prefix . 'acme_sr_log';

$rows = $wpdb->get_results(
    $wpdb->prepare( "SELECT * FROM {$table} WHERE order_id = %d", $order_id )
);

Paso 4: una regla de envío en WooCommerce

El filtro woocommerce_package_rates recibe las tarifas y un paquete de envío. Este ejemplo descuenta 20 % del costo y sus impuestos cuando ese paquete contiene la cantidad mínima. Si el carrito se divide en varios paquetes, cada uno se evalúa por separado; no se suman todos los productos del carrito.

// Incluye la regla en el hash del paquete para evitar tarifas antiguas.
add_filter( 'woocommerce_cart_shipping_packages', 'acme_sr_shipping_rule_cache_key' );

function acme_sr_shipping_rule_cache_key( $packages ) {
    $threshold = max( 1, (int) get_option( 'acme_sr_threshold', 3 ) );

    foreach ( $packages as $key => $package ) {
        $packages[ $key ]['acme_sr_threshold'] = $threshold;
    }

    return $packages;
}

add_filter( 'woocommerce_package_rates', 'acme_sr_adjust_rates', 10, 2 );

function acme_sr_adjust_rates( $rates, $package ) {
    $quantity = 0;

    foreach ( $package['contents'] as $item ) {
        $quantity += (int) $item['quantity'];
    }

    if ( $quantity < max( 1, (int) get_option( 'acme_sr_threshold', 3 ) ) ) {
        return $rates;
    }

    foreach ( $rates as $rate ) {
        // 20% de descuento si este paquete alcanza la cantidad mínima.
        $rate->set_cost( (float) $rate->get_cost() * 0.8 );

        // Ajusta los impuestos proporcionalmente al costo descontado.
        $taxes = array_map(
            fn( $tax ) => $tax * 0.8,
            $rate->get_taxes()
        );
        $rate->set_taxes( $taxes );
    }

    return $rates;
}

$rate es un WC_Shipping_Rate, que expone get_cost() y set_cost(), además de get_taxes() y set_taxes(). Dos advertencias prácticas:

La caché debe reflejar la regla. acme_sr_shipping_rule_cache_key() añade la cantidad mínima a cada paquete antes de calcular las tarifas. Al guardar otra cantidad, cambia el hash y WooCommerce recalcula en la siguiente solicitud del cliente. El valor es estable: no invalida la caché en cada visita. El código de envíos de WooCommerce muestra cómo el paquete participa en el hash.
Prueba con impuestos activados y desactivados, con varias zonas de envío y con cupones que otorgan envío gratis.

Declara compatibilidad con HPOS

El High-Performance Order Storage de WooCommerce cambia dónde viven los pedidos. Un plugin que no declara compatibilidad no aparece como compatible en los ajustes de funciones de WooCommerce, por lo que debes revisar su código antes de declarar compatibilidad desde el archivo principal:

add_action( 'before_woocommerce_init', function () {
    if ( class_exists( \Automattic\WooCommerce\Utilities\FeaturesUtil::class ) ) {
        \Automattic\WooCommerce\Utilities\FeaturesUtil::declare_compatibility(
            'custom_order_tables',
            __FILE__,
            true
        );
    }
} );

Declararlo es una promesa: lee y escribe pedidos con los métodos CRUD de WooCommerce (wc_get_order(), $order->get_meta()), no con consultas directas a wp_postmeta.

Paso 5: un widget de Elementor

En sitios construidos con Elementor, el cliente suele querer un bloque que pueda soltar en cualquier página. Un widget es una clase PHP que extiende \Elementor\Widget_Base, siguiendo la estructura de widgets de Elementor:

<?php
// widgets/class-acme-savings-widget.php

if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

class Acme_Savings_Widget extends \Elementor\Widget_Base {

    public function get_name(): string {
        return 'acme_savings';
    }

    public function get_title(): string {
        return esc_html__( 'Ahorro en envío', 'acme-shipping-rules' );
    }

    public function get_icon(): string {
        return 'eicon-code';
    }

    public function get_categories(): array {
        return [ 'general' ];
    }

    protected function register_controls(): void {
        $this->start_controls_section( 'content_section', [
            'label' => esc_html__( 'Contenido', 'acme-shipping-rules' ),
            'tab'   => \Elementor\Controls_Manager::TAB_CONTENT,
        ] );

        $this->add_control( 'message', [
            'label'   => esc_html__( 'Mensaje', 'acme-shipping-rules' ),
            'type'    => \Elementor\Controls_Manager::TEXT,
            'default' => esc_html__( 'El descuento de envío se calcula por paquete.', 'acme-shipping-rules' ),
        ] );

        $this->end_controls_section();
    }

    protected function render(): void {
        $settings = $this->get_settings_for_display();
        echo '<p class="acme-savings">' . esc_html( $settings['message'] ) . '</p>';
    }
}

Regístralo desde el archivo principal del plugin. El archivo de la clase se incluye dentro del hook, porque las clases de Elementor no existen hasta que Elementor se cargó:

add_action( 'elementor/widgets/register', function ( $widgets_manager ) {
    require_once __DIR__ . '/widgets/class-acme-savings-widget.php';
    $widgets_manager->register( new \Acme_Savings_Widget() );
} );

El widget ya aparece en el panel de Elementor, su control message es editable por el cliente y la salida está escapada.

El widget es informativo: su mensaje se edita en Elementor y no determina la elegibilidad para el descuento. La regla se aplica al calcular el envío para cada paquete.

Paso 6: rendimiento y mantenimiento

Un plugin se ejecuta en cada petición, así que cuida lo que cargas:

Carga assets solo donde se necesitan. Encola scripts y estilos dentro de wp_enqueue_scripts y protégelos con condicionales como is_cart() o is_checkout().
No consultes en cada página. Guarda en caché los resultados costosos con transients e invalídalos cuando los datos cambien.
Limpia al desinstalar. Elimina solo datos propiedad del plugin; no borres pedidos ni datos de otros plugins.
Versiona tus assets con la versión del plugin para que los navegadores no sirvan archivos viejos después de un lanzamiento.

Para este ejemplo, uninstall.php elimina únicamente la opción del plugin al desinstalarlo. Usa WP_UNINSTALL_PLUGIN como guarda en ese archivo; la desactivación no debe borrar la configuración:

<?php
// uninstall.php

if ( ! defined( 'WP_UNINSTALL_PLUGIN' ) ) {
    exit;
}

delete_option( 'acme_sr_threshold' );

Antes de entregar, pasa el código por los WordPress Coding Standards con PHP_CodeSniffer y por el plugin oficial Plugin Check, que señala problemas de seguridad y compatibilidad.

Lista previa al lanzamiento

Encabezado completo, guarda ABSPATH en el principal y el widget, y WP_UNINSTALL_PLUGIN en uninstall.php.
Todas las funciones, opciones y clases con prefijo.
Permisos, nonce y validación del entero mínimo en el servidor; salida escapada en el formulario y el widget.
$wpdb->prepare() en cualquier SQL con variables.
HPOS declarado y pedidos leídos con las APIs de WooCommerce.
Assets encolados solo donde se necesitan.
Pruebas con cantidades bajo/en/sobre el mínimo, varios paquetes, impuestos, zonas, envío gratis y cambio de mínimo en una sesión con tarifas en caché.
uninstall.php y changelog listos.

Cuándo construir en lugar de comprar

Un plugin ya hecho es la decisión correcta cuando hace exactamente lo que necesitas y tiene mantenimiento activo. Un plugin a medida se justifica cuando la regla es específica de tu negocio, como una fórmula de envío o un precio por bundle, o cuando de otro modo apilarías tres plugins para aproximarla.

Este es el trabajo que hago como desarrollador WordPress en CDMX. Puedes ver proyectos relacionados en los casos de estudio, como el sitio bilingüe en WordPress y Elementor para Mezcal Viviente. Si necesitas un plugin a medida, escríbeme con la regla que quieres automatizar.

Recurso adicional: desplegar WordPress en Azure

Si además de desarrollar plugins quieres explorar opciones de despliegue, Microsoft ofrece documentación para alojar WordPress mediante Azure App Service y Azure Database for MySQL.

Puedes consultar la guía oficial para implementar WordPress en Azure, que explica cómo configurar y administrar una instalación de WordPress en la nube.

Sobre mí

Soy Fernando Peralta, desarrollador web especializado en proyectos WordPress, WooCommerce y desarrollo a medida. Comparto artículos técnicos y proyectos en mi sitio web.

También trabajo en Devstoremx, mi agencia de desarrollo web en México, donde desarrollamos sitios web, tiendas en línea, aplicaciones e integraciones a medida.

Puedes consultar la guía original en mi blog y explorar otros casos reales de desarrollo WordPress.

How I freed more than 12GB in my Hotmail account with Jev (and skipped yet another subscription)

Fernando Peralta — Tue, 13 Oct 2026 21:23:00 +0000

This article was originally published on my personal development blog: How I freed more than 12GB in my Hotmail account with Jev. This is the adapted version for DEV Community.

In an era of endless subscriptions — streaming, cloud storage, productivity tools — hitting a storage limit often means yet another monthly fee. I had that problem with my Hotmail account: it was out of storage and held about 70,000 emails. Some were promotions, newsletters, automated notices, and messages that no longer mattered. Others were receipts, login details, and conversations I still needed. Deleting everything by sender or by age was too risky. Reading every message by hand would never end. Instead of paying for more storage, I decided to reclaim space.

That is why I built Mail Organizer: a local app for deciding which emails I could delete, reviewing the uncertain cases, and running the deletion from Outlook. What turned a blind cleanup into a useful review was Jev, the System One model from TypeSafe.

View the original results illustration: 62,025 emails deleted and 8,058 messages remaining.

The goal was not for an AI to empty my inbox. It was to turn thousands of repetitive decisions into a list I could understand and approve.

The stack I chose

I wanted the app to run on my computer and for secrets never to reach the browser. I chose a single Next.js 15 project with React 19, TypeScript, and Tailwind CSS for the interface; its API routes run the server logic. That let me build the review panel and the cleanup jobs in the same application, without deploying a separate service.

Piece	Technology	Its job in the project
Interface and server	Next.js App Router, React, TypeScript, and Tailwind	Show the guided flow and run the API routes in Node.js.
Mail access	Microsoft Graph and `@azure/msal-node`	Sign in, query messages, and request deletion in Outlook.
AI judgments	Jev through `@typesafe-ai/sdk`	Evaluate each email and return structured probabilities.
Persistence	SQLite with `better-sqlite3`	Store metadata, judgments, in-progress jobs, and the deletion history.

The important split is inside that one process: the browser displays data and collects my decisions; the API routes hold the Microsoft session and the TypeSafe key, call external services, and write to SQLite. Secrets live in .env.local and are read only on the server.

I also orchestrated agents in Cursor and OpenCode with the models GPT-6 Astra, GPT-6 Sol, Opus 5.5, Grok 4.7, and Muse Spark 1.3.

From a full inbox to a list I could review

I split the work into date ranges. The app connects to Outlook through Microsoft Graph and stores in a local SQLite database only what it needs to classify a message: sender, subject, a short preview, date, folder, and a few signals such as whether the email has attachments. It does not download or store the full body or the attachments. When I want to read a message, the app asks Outlook for the body at that moment.

React panel: sends actions to the Next.js API routes.
API routes: use MSAL and the local session to talk to Microsoft Graph.
Microsoft Graph: returns date-range metadata; the API stores it in SQLite.
SQLite → Jev: each query sends one email; Jev returns typed judgments that go back into the database.
Protection policy: filters the lists I see in the panel. On confirmation, the API asks Graph for a permanent delete.

Saving those judgments in SQLite mattered. I could stop and resume without classifying the same messages twice. I could also change the decision thresholds and rebuild the lists without asking Jev again.

Authentication and sync

For a personal Hotmail account I used OAuth with MSAL, a public client, and the Authorization Code + PKCE flow. The app requests delegated mail permissions, checks that the connected account is the one I configured, and keeps the session on the server. It never asks for my password and never uses a client secret in the browser. That logic lives in auth.ts.

Every sync requires dates. Internally I convert the inclusive dates from the UI into a [from, to) interval and query Microsoft Graph page by page. I store a cursor and progress in SQLite so I can continue if a session stops. When I sync again, I update the metadata without erasing the fact that Jev already classified a message. That sits in sync.ts and messages.ts.

SQLite has another job: Outlook does not know my junk_probability field, so I could not filter or group emails by that value directly in Graph. In the local database I separated messages (metadata), judgments (Jev answers), scores (policy result), jobs (progress), and deletion_log (audit). If I change a threshold, I recompute scores from judgments without paying for another classification.

Long-running jobs and a UI that explains progress

Syncing, classifying, and deleting thousands of emails takes longer than a normal web request. The API routes start background jobs inside the local process and return control to the panel. jobs stores the range, cursor, and counters; each classified email is persisted as soon as it finishes. If the server restarts, the app recognizes the interrupted job and I can continue without starting over.

I organized the interface into five steps — connect, choose dates, sync, classify, and review — and added an activity log for pages received, errors, and retries. That solved a design problem as important as the classification itself: during a long operation I needed to know whether the system was advancing, waiting on a quota, or waiting for me.

What I asked Jev

A rule like “if it says newsletter, delete it” cannot tell useless advertising from an email I still need. Jev therefore scores each message on its own, with ten structured questions. The main one is, in essence: “Could I permanently delete this email without losing anything I still need?” The answer is a Noul, TypeSafe’s yes-or-no question, which returns a probability between 0 and 1. That probability feeds the list of disposable messages.

This fragment from the classifier (classify.ts) shows the core idea: I send one email’s context together with the ten questions and read a typed response, instead of parsing free text.

const response = await typeSafe().systemOne({
  state: stateFor(message, folders, evaluatedAt),
  model: "jev-latest",
  questions: MAIL_QUESTIONS,
});

const probability = response.answers.is_disposable.noul;

The other questions add context and protection: whether it looks like marketing or an automated notice, whether a person is waiting for a reply, whether it contains credentials, whether it is a financial or legal record, and whether its usefulness has already expired. For time-sensitive cases, Jev receives both the email date and the evaluation date. A temporary code from years ago and an invoice from the same day should not be treated the same way.

The app makes one Jev request per email, but includes all ten questions in that same request. Nine are Noul questions and the tenth scores how painful it would be to lose the message on a five-level scale. I capped classification at 15 concurrent requests and 900 starts per minute; transient errors retry, and messages that keep failing stay marked so I can process them again. Patterns like no-reply only move a message earlier in the queue: they never declare it junk on their own.

Judgment	What I did with it
75% or higher chance it was disposable	It showed up as deletable, ready for my review.
40% up to, but not including, 75%	It went to review: the decision needed more context.
Under 40%	It stayed in keep.

That percentage is the model’s judgment, not a guarantee that deletion is safe. I added separate brakes: an email with strong signs of credentials, financial or legal documents, or a personal conversation moves to keep even if Jev calls it disposable. I can also protect senders with an allowlist. Before deleting a large batch, the app can label a sample of up to one hundred emails and compare my decisions with Jev’s, so I can catch false positives.

In code, the policy (policy.ts) looks roughly like this (shortened):

const probability = judgment.is_disposable;
const protectedMail =
  judgment.contains_access_credentials > 0.60 ||
  judgment.contains_financial_or_legal > 0.60 ||
  judgment.is_addressed_personally > 0.70 ||
  senderRule === "always_keep";

const bucket = protectedMail ? "keep"
  : probability >= 0.75 ? "deletable"
  : probability >= 0.40 ? "review"
  : "keep";

That split was deliberate: Jev provides the judgments; a deterministic function applies my thresholds and protections. I can change the policy without changing the model answers, and I can explain why each email landed in each list.

The step that actually freed space

Classification does not recover storage by itself. I inspected the lists first, grouped emails by sender, and reviewed the uncertain messages. To delete, the app shows the protection blocks and requires me to type the exact number of selected emails. Only then does it send Microsoft Graph a permanent delete. Moving messages to Deleted Items was not enough for the quota problem.

If you want to build something similar, the key operation is permanentDelete: Microsoft Graph exposes it through POST /me/messages/{id}/permanentDelete and, for a personal account, requires the delegated Mail.ReadWrite permission. The documentation explains that the message moves to the Purges folder under Recoverable Items. That does not mean it is physically erased immediately: retention policies may still apply.

Official Microsoft Graph documentation: check the permissions, endpoint, and what happens in the Purges folder in the Microsoft Learn permanentDelete guide.

Before calling Graph I write a pending row for each message in deletion_log. Then I send permanentDelete in batches of up to 20 operations, using immutable identifiers so a folder move does not change the reference to the email. Only a successful response marks the record as deleted; a 404 or an uncertain response keeps the case for review or retry. That flow lives in deletion.ts.

Another limit showed up during the bulk cleanup: Microsoft throttles requests. Deletion slowed down once I hit that quota. I added a preventive budget of 9,000 operations per ten minutes and a shared wait when Microsoft responds with Retry-After. The process retries only the items that failed, without repeating deletions already confirmed. The panel shows when it is waiting on the quota, and the log keeps each email’s result; a network error is not reported as a successful delete.

Recorded result: on September 22, 2026, the local history marked 62,025 distinct emails as deleted and zero pending or failed. The local database still held 8,058 messages. Jev used 100,737,845 tokens, at a cost of $3.6393.

What started as an inbox I could not sort became a manageable flow: limit the dates, ask Jev for clear judgments, protect what matters, review, and confirm the deletion. Jev saved me the repetitive classification. The rules and the human review kept the final decision in my hands.

About me

I'm Fernando Peralta, a web developer working on software development, web applications, and technology projects.

I'm also involved in Devstoremx, my web development agency in Mexico, where we work on websites, custom applications, e-commerce solutions, integrations, and automation.

I share personal projects, technical experiences, and development articles on my personal website and software development blog.

If you'd like to explore this project with its original design and illustrations, you can read the complete article on my blog.

Cómo liberé más de 12GB de espacio en mi cuenta de Hotmail con Jev (Ahorrándome una suscripción más)

Fernando Peralta — Tue, 13 Oct 2026 20:56:00 +0000

Este artículo se publicó originalmente en mi blog de desarrollo web: cómo liberé más de 12 GB de Hotmail con Jev. Esta es su versión adaptada para DEV Community.

En una época en la que acumulamos miles de suscripciones —streaming, almacenamiento en la nube, herramientas de productividad— casi cualquier límite de espacio termina convirtiéndose en otra cuota mensual. Yo tuve este problema con mi cuenta de Hotmail: estaba al límite de almacenamiento y acumulaba alrededor de 70 mil correos. Entre ellos había promociones, boletines, avisos automáticos y mensajes que ya habían perdido su utilidad. También había recibos, accesos y conversaciones que sí necesitaba conservar. Borrar todo por remitente o por antigüedad era demasiado arriesgado; revisar cada mensaje a mano, interminable. En lugar de pagar más almacenamiento, decidí recuperar espacio.

Así nació Mail Organizer: una aplicación local para decidir qué correos podía eliminar, revisar los casos dudosos y ejecutar el borrado desde Outlook. La pieza que me permitió pasar de una limpieza a ciegas a una revisión útil fue Jev, el modelo System One de TypeSafe.

Ver la ilustración original del resultado: 62 025 correos borrados y 8 058 mensajes restantes.

El objetivo no era que una IA vaciara mi buzón. Era reducir miles de decisiones repetitivas a una lista que yo pudiera entender y aprobar.

Las tecnologías que elegí

Quería que la aplicación corriera en mi computadora y que las claves nunca llegaran al navegador. Elegí un solo proyecto Next.js 15 con React 19, TypeScript y Tailwind CSS para la interfaz; sus rutas API ejecutan la lógica del servidor. Así podía construir el panel de revisión y los procesos de limpieza en la misma aplicación, sin desplegar un servicio adicional.

Pieza	Tecnología	Su trabajo en el proyecto
Interfaz y servidor	Next.js App Router, React, TypeScript y Tailwind	Mostrar el flujo guiado y ejecutar las rutas API en Node.js.
Acceso al correo	Microsoft Graph y `@azure/msal-node`	Iniciar sesión, consultar mensajes y solicitar el borrado en Outlook.
Juicios de IA	Jev mediante `@typesafe-ai/sdk`	Evaluar cada correo y devolver probabilidades estructuradas.
Persistencia	SQLite con `better-sqlite3`	Guardar metadatos, juicios, trabajos en curso y el historial de borrados.

La separación importante está dentro de ese único proceso: el navegador muestra datos y recoge mis decisiones; las rutas API guardan la sesión de Microsoft y la clave de TypeSafe, consultan los servicios externos y escriben en SQLite. Los secretos viven en .env.local y solo se leen del lado del servidor.

También orquesté agentes en Cursor y OpenCode con los modelos GPT-6 Astra, GPT-6 Sol, Opus 5.5, Grok 4.7 y Muse Spark 1.3.

Del buzón saturado a una lista revisable

Dividí el trabajo por rangos de fechas. La aplicación se conecta a Outlook mediante Microsoft Graph y trae a una base SQLite local solo los datos necesarios para clasificar: remitente, asunto, una vista previa breve, fecha, carpeta y algunas señales como si el correo tiene adjuntos. No descarga ni guarda el cuerpo completo o los adjuntos. Si quiero leer un mensaje, la aplicación pide su cuerpo a Outlook en ese momento.

Panel React: envía acciones a las rutas API de Next.js.
Rutas API: usan MSAL y la sesión local para hablar con Microsoft Graph.
Microsoft Graph: devuelve metadatos por rango; la API los guarda en SQLite.
SQLite → Jev: cada consulta envía un correo; Jev responde con juicios tipados que vuelven a la base.
Política de protección: filtra las listas que veo en el panel. Al confirmar, la API pide el borrado permanente a Graph.

Guardar los juicios en SQLite fue importante. Pude detener y retomar el proceso sin clasificar dos veces los mismos mensajes. También pude ajustar los umbrales de decisión y recalcular las listas sin volver a consultar a Jev.

Autenticación y sincronización

Para una cuenta personal de Hotmail usé OAuth con MSAL, un cliente público y el flujo Authorization Code + PKCE. La aplicación solicita permisos delegados de correo, comprueba que la cuenta conectada sea la que configuré y mantiene la sesión del lado del servidor. No pide mi contraseña ni usa un client secret en el navegador. Esa lógica vive en auth.ts.

Cada sincronización tiene fechas obligatorias. Internamente convierto las fechas inclusivas de la interfaz en un intervalo [desde, hasta) y consulto Microsoft Graph página por página. Guardo un cursor y el progreso en SQLite para continuar si una sesión se interrumpe. Al volver a sincronizar, actualizo los metadatos sin borrar el hecho de que Jev ya clasificó un mensaje. Eso está en sync.ts y messages.ts.

SQLite cumple otra función: Outlook no conoce mi campo junk_probability, así que no podría filtrar o agrupar los correos por ese valor directamente en Graph. En la base local separé messages (metadatos), judgments (respuestas de Jev), scores (resultado de la política), jobs (progreso) y deletion_log (auditoría). Si cambio un umbral, recalculo scores a partir de judgments sin pagar otra clasificación.

Trabajos largos y una interfaz que explica el progreso

Sincronizar, clasificar y borrar miles de correos tarda más que una petición web normal. Las rutas API inician trabajos en segundo plano dentro del proceso local y devuelven el control al panel. jobs guarda el rango, el cursor y los contadores; cada correo clasificado se persiste en cuanto termina. Si el servidor se reinicia, la aplicación reconoce el trabajo interrumpido y puedo continuarlo sin empezar de cero.

Organicé la interfaz en cinco pasos —conectar, elegir fechas, sincronizar, clasificar y revisar— y añadí un registro de actividad para páginas recibidas, errores y reintentos. Esto resolvió un problema de diseño igual de importante que la clasificación: durante una operación larga necesitaba saber si el sistema avanzaba, esperaba por una cuota o requería que interviniera.

Qué le pregunté a Jev

Una regla como «si dice newsletter, bórralo» no distingue entre publicidad inútil y un correo que todavía necesito. Por eso Jev evalúa cada mensaje por separado con diez preguntas de respuesta estructurada. La principal es, en esencia: «¿Podría eliminar este correo definitivamente sin perder nada que aún necesite?» Su respuesta es un Noul, la pregunta de sí o no de TypeSafe que devuelve una probabilidad entre 0 y 1. Esa probabilidad alimenta la lista de mensajes prescindibles.

Este fragmento del clasificador (classify.ts) muestra la idea central: envío el contexto de un correo junto con las diez preguntas y leo una respuesta tipada, sin interpretar texto libre.

const response = await typeSafe().systemOne({
  state: stateFor(message, folders, evaluatedAt),
  model: "jev-latest",
  questions: MAIL_QUESTIONS,
});

const probability = response.answers.is_disposable.noul;

Las otras preguntas aportan contexto y protección: si parece marketing o un aviso automático, si una persona espera respuesta, si contiene credenciales, si es un comprobante financiero o legal, y si su utilidad ya caducó. Para los casos que dependen del tiempo, Jev recibe tanto la fecha del correo como la fecha de evaluación. Un código temporal de hace años y una factura del mismo día no deberían tratarse igual.

La aplicación hace una consulta a Jev por correo, pero incluye las diez preguntas en esa misma consulta. Nueve son Noul y la décima puntúa cuánto dolería perder el mensaje en una escala de cinco niveles. Limité la clasificación a 15 consultas simultáneas y 900 inicios por minuto; los errores transitorios se reintentan y los mensajes que siguen fallando quedan identificados para volver a procesarlos. Los patrones como no-reply solo adelantan un correo en la cola: nunca lo declaran basura por sí mismos.

Resultado del juicio	Qué hacía yo con él
75 % o más de probabilidad de ser prescindible	Aparecía como eliminable, listo para mi revisión.
40 % a menos de 75 %	Iba a revisar: la decisión necesitaba más contexto.
Menos de 40 %	Quedaba en conservar.

Ese porcentaje es un juicio del modelo, no una garantía de que borrar sea seguro. Por eso añadí frenos independientes: un correo con señales fuertes de credenciales, documentos financieros o legales, o una conversación personal pasa a conservar aunque Jev lo considere prescindible. También puedo proteger remitentes con una lista blanca. Antes de borrar muchos mensajes, la aplicación permite etiquetar una muestra de hasta cien correos y comparar mis decisiones con las de Jev para detectar falsos positivos.

En términos de código, la política (policy.ts) se parece a esto (versión abreviada):

const probability = judgment.is_disposable;
const protectedMail =
  judgment.contains_access_credentials > 0.60 ||
  judgment.contains_financial_or_legal > 0.60 ||
  judgment.is_addressed_personally > 0.70 ||
  senderRule === "always_keep";

const bucket = protectedMail ? "keep"
  : probability >= 0.75 ? "deletable"
  : probability >= 0.40 ? "review"
  : "keep";

Esta división fue deliberada: Jev aporta los juicios; una función determinista aplica mis umbrales y protecciones. Así puedo cambiar la política sin cambiar las respuestas del modelo, y puedo explicar por qué un correo quedó en cada lista.

El paso que realmente liberó espacio

Clasificar no recupera almacenamiento por sí solo. Primero inspeccioné las listas, agrupé correos por remitente y revisé los mensajes dudosos. Para borrar, la aplicación muestra los bloqueos de protección y me exige escribir la cantidad exacta de correos seleccionados. Solo entonces envía a Microsoft Graph la operación de borrado permanente. Mover mensajes a Elementos eliminados no bastaba para el problema de cuota.

Si quieres replicar algo parecido, la operación clave es permanentDelete: Microsoft Graph la expone mediante POST /me/messages/{id}/permanentDelete y, para una cuenta personal, requiere el permiso delegado Mail.ReadWrite. La documentación explica que el mensaje pasa a la carpeta Purges dentro de Elementos recuperables. Esto no significa que desaparezca físicamente al instante: pueden aplicarse políticas de retención.

Documentación oficial de Microsoft Graph: consulta los permisos, el endpoint y qué ocurre con la carpeta de purgas en la guía de permanentDelete de Microsoft Learn.

Antes de llamar a Graph escribo una fila pending por cada mensaje en deletion_log. Después envío permanentDelete en lotes de hasta 20 operaciones, usando identificadores inmutables para que un movimiento entre carpetas no cambie la referencia al correo. Solo una respuesta exitosa marca el registro como deleted; un 404 o una respuesta incierta conserva el caso para revisión o reintento. Ese flujo está en deletion.ts.

Durante la limpieza masiva apareció otro obstáculo: Microsoft limita la velocidad de las peticiones. El borrado se volvió lento cuando alcancé esa cuota. Incorporé un presupuesto preventivo de 9 000 operaciones por diez minutos y una espera compartida cuando Microsoft responde con Retry-After. El proceso reenvía únicamente los elementos que fallaron, sin repetir los borrados ya confirmados. El panel muestra si está esperando por la cuota y el registro conserva el resultado de cada correo; un error de red no se presenta como un borrado exitoso.

Resultado registrado: al 22 de septiembre de 2026, el historial local marcaba 62 025 correos distintos como borrados y cero pendientes o fallidos. La base local conservaba 8 058 mensajes. Jev usó 100 737 845 tokens, con un costo de 3.6393 dólares.

Lo que empezó como un buzón imposible de ordenar terminó en un flujo manejable: acotar fechas, pedir a Jev juicios claros, proteger lo valioso, revisar y confirmar el borrado. Jev me ahorró la clasificación repetitiva; las reglas y la revisión humana me ayudaron a conservar el control de la decisión final.

Para profundizar

Qué es Jev y cómo funciona, en la documentación oficial de TypeSafe.
Noul, Score y Choice, las respuestas estructuradas con las que construí la clasificación.
Referencia de la API System One, para ver el contrato de las consultas.
Borrado permanente de mensajes (Microsoft Graph), guía oficial con los permisos y la carpeta de purgas.

Sobre mí

Soy Fernando Peralta, desarrollador web y Technical Lead en Devstoremx, una agencia de desarrollo web en México donde trabajamos en sitios web, aplicaciones a medida, ecommerce, integraciones y automatizaciones.

También comparto proyectos personales, experiencias y artículos técnicos en mi sitio web y blog de desarrollo.

Si prefieres leer este caso con el diseño y las ilustraciones originales, visita el artículo completo en mi blog.

DEV Community: Fernando Peralta

Cómo crear un plugin de WordPress: PHP, WooCommerce y Elementor

Paso 1: el archivo del plugin y su encabezado

Paso 2: hooks, no ediciones

Paso 3: la seguridad no es opcional

Paso 4: una regla de envío en WooCommerce

Declara compatibilidad con HPOS

Paso 5: un widget de Elementor

Paso 6: rendimiento y mantenimiento

Lista previa al lanzamiento

Cuándo construir en lugar de comprar

Recurso adicional: desplegar WordPress en Azure

Sobre mí

How I freed more than 12GB in my Hotmail account with Jev (and skipped yet another subscription)

The stack I chose

From a full inbox to a list I could review

Authentication and sync

Long-running jobs and a UI that explains progress

What I asked Jev

The step that actually freed space

Further reading

About me

Cómo liberé más de 12GB de espacio en mi cuenta de Hotmail con Jev (Ahorrándome una suscripción más)

Las tecnologías que elegí

Del buzón saturado a una lista revisable

Autenticación y sincronización

Trabajos largos y una interfaz que explica el progreso

Qué le pregunté a Jev

El paso que realmente liberó espacio

Para profundizar

Sobre mí