Open to new opportunities

Hi, I'm Juan David Zea

Software developerSystems Engineer

Systems Engineer with 6 years building interfaces. Today I build a payment gateway's checkout and the company's design system, and I build with AI agents.

Copacabana, Antioquia, Colombia Printable version

Juan David Zea

In the background, 80 of the 1,017 icons in Iconsax Vue, one of my libraries.

By the numbers

years of experience
6
commits in Spartan Vue, 774 of them mine
1,204
Spartan Vue versions published to npm
296
downloads of my libraries in the last year
92,892

Data from npm and GitHub, refreshed on every deploy.

01

Experience

  1. present 5 years

    Senior Frontend Engineer Placetopay — Evertec Inc.

    I build and maintain the checkout page of Placetopay's payment gateway, which processes transactions across Latin America.

    • I created Spartan Vue, the company's design system, and I'm its top contributor.
    • I created the open-source icon, flag and lightbox libraries its products use in production.
    • I've taught internal programming courses to the team.
    • Vue
    • TypeScript
    • TailwindCSS
    • Nuxt
    • PHP
    • Laravel
  2. Freelance

    Freelance developer

    Custom software for a furniture store: sales, inventory, invoicing and reports.

    • JavaScript
    • Node
    • SQL

Education

Systems Engineer · University of Antioquia

02

Open source

Libraries I created and maintain, in production and on npm. The ones you can touch are live right here.

Design system

Spartan Vue

Placetopay's design system: Vue components on TailwindCSS v4, documented and versioned, used in production.

64% of the commits are mine
versions
296
version
3.1.1
downloads/yr
17,739

Icons

Iconsax Vue

Over a thousand Iconsax icons as Vue components, in six styles, that only weigh what you import.

downloads/yr
62,535
version
1.0.0

Flags

Flagicons Vue

Countries' flags as Vue components, in three sizes.

  • Colombia
  • Ecuador
  • Peru
  • Chile
  • Mexico
  • Argentina
  • Brazil
  • Uruguay
  • Paraguay
  • Bolivia
  • Venezuela
  • Panama
  • Costa Rica
  • Guatemala
  • Honduras
  • El Salvador
  • Nicaragua
  • Dominican Republic
  • Puerto Rico
  • Cuba
  • United States of America
  • Canada
  • Spain
  • Portugal
  • France
  • Germany
  • Italy
  • United Kingdom
  • Netherlands
  • Switzerland
  • Sweden
  • Norway
  • Japan
  • Korea (the Republic of)
  • India
  • Australia
  • New Zealand
  • South Africa
  • Nigeria
  • Egypt
Colombia 40 of 255 flags
downloads/yr
6,811
version
0.1.0

SDK

Lightbox SDK

Opens websites in a modal iframe and talks to them, with configurable styles and behavior.

  • TypeScript
downloads/yr
3,492
version
2.6.0

MCP server for AI agents

PTP Studio MCP

Gives an AI agent (Claude Code, OpenCode…) access to PTP Studio, my payments testing tool: it creates, queries and cancels payment sessions and drives the app live, without the credentials ever reaching the model.

How it works ↓

  • Node
  • MCP
  • WebSocket
downloads/yr
2,315
version
0.7.1

API

SimpleMoneyConverter

Currency conversion API with historical rates and batches of up to 100 requests.

  • TypeScript
  • Node
  • Jest

03

With AI agents

I work with Claude Code and build tools so agents can do real work. I believe in SOLID, TDD and using AI with judgment.

My own tool

PTP Studio

A web client I built to test Placetopay's payment APIs: over 36 Webcheckout, Gateway and Core endpoints from a single interface, with environments, sites, history and request chains that pass data between steps.

  • A Chrome extension answers the checkout’s requests with mocked responses, to reproduce any frontend behavior without touching the backend.
  • Its MCP server lets an AI agent drive it live.
  • Data lives in the browser, with no server; in Spanish and English.
  • Nuxt 4
  • Vue 3
  • Nuxt UI 4
  • TailwindCSS 4
  • Cloudflare Workers

MCP server for AI agents

An MCP server for payments

Gives an AI agent (Claude Code, OpenCode…) access to PTP Studio, my payments testing tool: it creates, queries and cancels payment sessions and drives the app live, without the credentials ever reaching the model.

The credentials never reach the model: signing happens outside it.

Install it in Claude Code

claude mcp add ptp-studio -- npx -y @juanzea/ptp-studio-mcp

@juanzea/ptp-studio-mcp · v0.7.1 · 2,315 downloads/yr

  1. AI agent Claude Code · OpenCode
  2. ptp-studio-mcp my server · HTTP → checkout that signs
  3. PTP Studio the app, in your browser

Tools it gives the agent

Checkout
  • create_session_for_site
  • query_session_for_site
  • cancel_session_for_site
  • check_auth_for_site
State
  • list_sessions
  • list_sites
  • list_environments
App
  • navigate
  • prefill_endpoint
  • describe_endpoint
  • create_mock

04

What I work with

Frontend
  • Vue
  • Nuxt
  • Svelte
  • React
  • Astro
  • TypeScript
  • JavaScript
  • TailwindCSS
  • CSS
  • HTML
Backend & data
  • Node
  • Laravel
  • PHP
  • SQL
  • Drizzle
  • NeonDB
  • Supabase
AI
  • Claude Code
  • Claude
  • MCP
  • Gemini
  • OpenAI
Infrastructure
  • Cloudflare
  • Vercel
  • Git
  • pnpm
Practice
  • SOLID
  • TDD
  • Vitest
  • OOP
  • SCRUM
  • Design patterns

05

Let's talk

I’m looking for a team to build products with real craft. Reach me by email or on LinkedIn.

(+57) 321 887 6733 WhatsApp

© 2026 Juan David Zea

Built by me with SvelteKit, on Cloudflare.