Story
Building This Portfolio: Why I Ditched Templates
After 20 years of building websites, I finally made something that represents how I actually work. No WordPress themes, no page builders—just code...
\n
Self-taught builder of web applications. I orchestrate AI systems as my development team, combining human architecture with machine speed. No CS degree. Just 6 years of shipping products that work.
Current Stack
Get an instant, detailed estimate for your next web app, business site, or custom software project.
Real projects for real clients. From WordPress sites to custom applications.
Industrial ERP
Branding Studio
A streamlined process amplified by AI. I design the architecture, orchestrate the development, and curate the final result. Faster delivery without sacrificing quality.
Understanding your business goals, users, and technical requirements. AI-assisted research and competitor analysis.
I design the system structure, database schema, and component hierarchy. Human decisions, AI-enhanced planning.
Orchestrating AI agents for rapid development while I audit, refine, and optimize every line of code.
Production deployment, performance optimization, and monitoring setup. You get a product that works from day one.
Technologies I use to build products. Always learning, always evolving.
Complex functionalities built from scratch with detailed technical explanations. No libraries, no dependencies. Just raw code demonstrating problem-solving capabilities and deep understanding of web fundamentals.
From a production Tarot card system • 22 cards • True randomness
Deck ready (22 cards)
Time Complexity
O(n)
Space Complexity
O(1)
Cards Shuffled
0
The Fisher-Yates shuffle produces a uniformly random permutation. Each element has exactly 1/n probability of ending up in any position. This is crucial for a fair card draw.
function fisherYatesShuffle(array) { // Create a copy to avoid mutating original const arr = [...array]; // Iterate from last to first element for (let i = arr.length - 1; i > 0; i--) { // Pick random index from 0 to i const j = Math.floor(Math.random() * (i + 1)); // Swap elements at i and j [arr[i], arr[j]] = [arr[j], arr[i]]; } return arr; } // Usage with 22 Tarot cards const deck = ['The Fool', 'The Magician', ...]; const shuffled = fisherYatesShuffle(deck); const selection = [shuffled[0], shuffled[1]];
Try dragging the card between columns
// HTML5 Drag & Drop API function drag(e) { e.dataTransfer.setData("text/plain", e.target.id); } function allowDrop(e) { e.preventDefault(); // Required! } function drop(e) { e.preventDefault(); const id = e.dataTransfer.getData("text"); e.currentTarget.appendChild(document.getElementById(id)); }
Rendering only visible items • 0 DOM nodes
// Virtual scroll: render only visible const ITEM_HEIGHT = 40; const VISIBLE_COUNT = 10; function onScroll(e) { const scrollTop = e.target.scrollTop; const startIdx = Math.floor(scrollTop / ITEM_HEIGHT); const endIdx = startIdx + VISIBLE_COUNT; // Render only visible slice renderItems(data.slice(startIdx, endIdx)); }
function checkStrength(pass) { let score = 0; const tests = [ { regex: /.{8,}/, name: 'length' }, { regex: /[A-Z]/, name: 'uppercase' }, { regex: /[0-9]/, name: 'number' }, { regex: /[^A-Za-z0-9]/, name: 'special' } ]; tests.forEach(test => { if (test.regex.test(pass)) score++; }); return score; // 0-4 scale }
class Particle { constructor(x, y) { this.x = x; this.y = y; this.vx = (Math.random() - 0.5) * 2; this.vy = (Math.random() - 0.5) * 2; } update() { this.x += this.vx; this.y += this.vy; } }
|
async function typewriter(text, element) {
for (let i = 0; i <= text.length; i++) {
element.textContent = text.slice(0, i);
await sleep(100);
}
}
Click to flip
.perspective-1000 { perspective: 1000px; }
.preserve-3d { transform-style: preserve-3d; }
.backface-hidden { backface-visibility: hidden; }
.rotate-y-180 { transform: rotateY(180deg); }
Lessons learned, technical deep dives, and the stories behind the projects.
Story
After 20 years of building websites, I finally made something that represents how I actually work. No WordPress themes, no page builders—just code...
Case Study
Bordados Pando needed to process 200+ orders daily. Here's how I built a system that reduced their management time by 40%...
Reusable snippets I use across projects.
const debounce = (fn, delay) => {
let timer;
return (...args) => {
clearTimeout(timer);
timer = setTimeout(() => fn.apply(this, args), delay);
};
};
async function api(endpoint, options = {}) {
const res = await fetch(`/wp-json/custom/v1${endpoint}`, {
headers: { 'Content-Type': 'application/json' },
...options
});
if (!res.ok) throw new Error('API Error');
return res.json();
}
20 years of building for the web. From table layouts to AI-powered applications.
{
"web_design": "20 years",
"wordpress": "Since 2016",
"modern_stack": "React, Node, Firebase",
"current_focus": "AI-accelerated development"
}
Started 20 years ago with table-based layouts and Flash animations. Built my first WordPress site in 2016—it was ugly, but it worked. Since then, I've shipped solutions for restaurants, shops, and industrial clients. No CS degree, just continuous learning.
I architect systems and orchestrate AI agents to accelerate development. I review every line of code, optimize performance, and ensure the final product meets professional standards. Faster delivery, same quality.
Build complete web applications—from interface to deployment. Handle frontend, backend, databases, and server configuration. Self-taught means I had to learn every layer, which turns out to be useful.
Tell me about your project. No technical knowledge required.