AR Logo

Projects

A collection of my work and side projects

Shopify Remix Headless Frontend

Built on Remix with the Shopify graphql API. Ecommerce for Grupo Loureiro(scraped for reasons not due to myself). Open sourced the code.

TypeScriptTailwindCSSReact
Muselyo Music Player - Desktop Application
Muselyo Music Player - Desktop Application

A modern, high-performance desktop music player built with cutting-edge technologies. This application combines the power of Rust with the flexibility of React to deliver a native desktop experience for managing and enjoying your local music library. Key Features: Comprehensive library management organized by artists, albums, genres, and custom playlists Seamless local audio playback supporting multiple formats Statistics dashboard tracking listening habits and most played tracks Last.fm integration for scrobbling and metadata enrichment Embedded lyrics support with external API integration Native media session controls for system integration Modern, responsive UI with light/dark theme support Folder-based music exploration Technical Highlights: Built with Tauri v2 for native performance and small binary size Frontend powered by React 19 with TanStack Router for routing Styled using TailwindCSS v4 and shadcn/ui component library Rust-based backend handling audio decoding (Symphonia), playback (CPAL), and metadata extraction SQLite database for efficient library management State management with Zustand Type-safe development with TypeScrip

TauriTypeScriptTailwindCSSBunReact
Grupo Loureiro Site
Grupo Loureiro Site

A landing page with blog integration for a MYPIME based in Cuba, with operations in Panama and Spain focused in agriculture imports and technology, .

TailwindCSSReactNext.jsTypeScript
Unaganga
Unaganga

A modern, full-stack product catalog platform built with Next.js 16 that enables businesses to manage multiple online stores from a single admin dashboard. Features include a comprehensive product management system with variants, dynamic category filtering, shopping cart and wishlist functionality, and customizable store themes. The platform uses tRPC for type-safe APIs, Prisma ORM for database management, and MinIO for scalable media storage. Built with TypeScript, React 19, and Tailwind CSS, it offers both an intuitive admin interface for store management and a responsive customer-facing storefront with real-time search capabilities and WhatsApp integration for customer communications. Key Technologies: Next.js 16, TypeScript, React 19, tRPC, Prisma, PostgreSQL, Better Auth, MinIO, Tailwind CSS, Radix UI, React Query, Zod

Next.jsTypeScriptPostgreSQLTailwindCSS
Template Creator

A Next.js application to create documents from pre-defined templates stored in PocketBase. Users can fill dynamic forms generated from a JSON schema, preview the resulting HTML (compiled with Handlebars), and generate or view cached PDFs. Images are uploaded and stored as assets in PocketBase. Robust client- and server-side validations are in place. Table of Contents Overview Key Features Tech Stack Project Structure Core Architecture Data Model (PocketBase) API Routes Frontend Flows Template Schema Specification Validations PDF Generation and Caching Image Upload Flow Authentication and Routing Local Development How to Add a New Template Known Limitations and Future Improvements File Index Overview This project evolved from an initial GrapeJS + Appwrite editor concept into a streamlined system focused on: Using pre-defined templates stored in PocketBase Generating dynamic forms from a JSON schema Compiling templates with Handlebars (#if, #each) so optional sections render only when data exists Generating and caching PDFs on-demand using Puppeteer Strong validations for input types, email format, numerical ranges, and images The current codebase is centered around PocketBase as backend and no longer uses Appwrite in runtime paths. The original README references Appwrite and GrapeJS; use this updated document going forward. Key Features Template hub for each template ID with: List of generated documents Creation of new documents via a form Edit and Delete actions per document Click on a document card to open/view its PDF (generate if not cached) Dynamic form rendering from schema with: Support for a "fields" array schema format and a legacy flat-object schema Field types: text, textarea, number, date, select, image, array (repeating group) Client-side validations (required, type checking, pattern, min/max, minLength/maxLength, email, select options, array size) Real-time error messages and disabled submit button until valid Image uploads: Client validation of MIME and file size (configurable) Server validation to enforce image types and size limits Uploaded images stored in PocketBase assets PDF generation: A4 PDFs via Puppeteer with printBackground Caching in PocketBase assets per-document; re-use on subsequent view Conditional rendering (Handlebars): Optional fields wrapped in {{#if}} blocks Arrays rendered with {{#each}}; omitted when empty Tech Stack Framework: Next.js 15 (App Router) + React 19 Language: TypeScript Styling/UI: Tailwind CSS + shadcn/ui components Backend: PocketBase (self-hosted) PDF: Puppeteer Templates: Handlebars runtime on the client for preview

Next.jsTypeScriptPocketBasePuppeteerHandlebars