<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom">
    <channel>
        <title>Cristopher Paniagua · Blog</title>
        <link>https://cristopherps.dev/blog</link>
        <description>Technical articles by Cristopher Paniagua about Vue 3, Nuxt, TypeScript and his open source projects.</description>
        <lastBuildDate>Sat, 17 Oct 2026 00:00:00 GMT</lastBuildDate>
        <docs>https://validator.w3.org/feed/docs/rss2.html</docs>
        <generator>https://github.com/jpmonette/feed</generator>
        <language>en</language>
        <image>
            <title>Cristopher Paniagua · Blog</title>
            <url>https://cristopherps.dev/images/logo.png</url>
            <link>https://cristopherps.dev/blog</link>
        </image>
        <copyright>© 2026 Cristopher Paniagua</copyright>
        <atom:link href="https://cristopherps.dev/rss.xml" rel="self" type="application/rss+xml"/>
        <item>
            <title><![CDATA[Pokémon shopping cart with Vue 3, Axios and the PokéAPI]]></title>
            <link>https://cristopherps.dev/blog/pokemon-shopping-cart-vue3</link>
            <guid isPermaLink="false">https://cristopherps.dev/blog/pokemon-shopping-cart-vue3</guid>
            <pubDate>Sat, 17 Oct 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[How a Vue 3 shopping cart demo consumes the PokéAPI REST API: batched lazy loading with Promise.all, client-side pagination, a reactive cart with computed totals, loading and error states, and a simulated checkout.]]></description>
            <content:encoded><![CDATA[This demo turns the PokéAPI into a product catalog. Built with Vue 3, the Composition API, Axios and Tailwind CSS, it loads Pokémon in batches of 10 (up to 100) using Promise.all, keeps a reactive cart with computed quantities and totals, handles loading and error states, and ends with a simulated checkout.]]></content:encoded>
            <author>Cristopher Paniagua</author>
            <category>Vue 3</category>
            <category>Composition API</category>
            <category>Axios</category>
            <category>REST API</category>
            <category>Tailwind CSS</category>
            <category>CodePen</category>
        </item>
        <item>
            <title><![CDATA[Vue 3 Autocounter: an animated number counter component for Vue 3]]></title>
            <link>https://cristopherps.dev/blog/vue3-autocounter</link>
            <guid isPermaLink="false">https://cristopherps.dev/blog/vue3-autocounter</guid>
            <pubDate>Sat, 17 Oct 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[How vue3-autocounter works, how to install it, and how to use it to animate statistics, metrics and prices in Vue 3 and Nuxt apps, with every prop, event and method documented.]]></description>
            <content:encoded><![CDATA[vue3-autocounter is a lightweight, open-source Vue 3 component written in TypeScript that animates a number from a start value to an end value over a set duration. It counts up or down and supports decimals, thousands separators, prefixes, suffixes, pause/resume and a finished event. Install it with npm install vue3-autocounter.]]></content:encoded>
            <author>Cristopher Paniagua</author>
            <category>Vue 3</category>
            <category>TypeScript</category>
            <category>npm</category>
            <category>Open source</category>
            <category>Components</category>
            <enclosure url="https://cristopherps.dev/images/projects/vue3-autocounter-demo.png" length="0" type="image/png"/>
        </item>
        <item>
            <title><![CDATA[Building a TODO app with the Vue 3 Composition API and localStorage]]></title>
            <link>https://cristopherps.dev/blog/vue3-todo-app-composition-api</link>
            <guid isPermaLink="false">https://cristopherps.dev/blog/vue3-todo-app-composition-api</guid>
            <pubDate>Sat, 17 Oct 2026 00:00:00 GMT</pubDate>
            <description><![CDATA[A walkthrough of a Vue 3 TODO app built with ref, computed and onMounted: reactive task state, To-Do and Done tabs, UUID task IDs, confirmation flows and localStorage persistence.]]></description>
            <content:encoded><![CDATA[This is a small task manager built with Vue 3 and the Composition API. Tasks live in a reactive ref, the To-Do and Done lists are computed from it, every task gets a UUID, and the list is saved to localStorage so it survives page reloads. Destructive and status-changing actions ask for confirmation first.]]></content:encoded>
            <author>Cristopher Paniagua</author>
            <category>Vue 3</category>
            <category>Composition API</category>
            <category>JavaScript</category>
            <category>localStorage</category>
            <category>CodePen</category>
            <enclosure url="https://cristopherps.dev/images/projects/vue3-todo-app-demo.png" length="0" type="image/png"/>
        </item>
    </channel>
</rss>