executing node…
Website
Personal Portfolio Website
My portfolio site, built as an interactive n8n workflow. The homepage is a full-screen canvas where each node maps to a section of the site. On load, the workflow executes: nodes light up in sequence, edges animate with flowing particles. An n8n-style execution log links each live product, the site ships in dark and light themes, and a dual analytics stack runs behind GDPR-compliant consent management.
Key features
- Full-screen interactive workflow canvas with timed execution animation on page load
- Five custom node types (trigger, regular, AI, sub-tool, output) with animated SVG edges
- Draggable nodes with click-to-navigate and drag-guard to prevent accidental clicks
- n8n-style execution log on the homepage — live products listed as runs with status badges, each linking to its project, revealed line by line on scroll and shown in full for reduced-motion visitors
- Dark and light themes with theme-aware cover images throughout
- Responsive layouts with separate mobile workflow configurations per breakpoint
- Dual analytics: Vercel Analytics (cookieless, always-on) plus Google Analytics (consent-gated via GTM)
- Real-time consent management with instant script removal and cookie cleanup on revocation
- Contact form through Resend email API, protected by Cloudflare Turnstile and honeypot spam detection
- Markdown-based blog section with RSS feed for content distribution
- Person JSON-LD, sitemap, robots rules and per-project Open Graph images for search and social sharing
- Server-rendered via Next.js App Router with image optimization and font preloading
Technologies
Next.js 16React 19TypeScriptTailwind CSSFramer MotionVercel AnalyticsGoogle Tag ManagerResendCloudflare Turnstile
About the project
I didn't want a grid-of-cards portfolio. I build AI automations for a living, so the site itself is one. The homepage is a React Flow canvas: drag nodes around, click them to navigate, watch the workflow execute with timed animations on load. Right below it, an execution log styled after n8n's run history lists the products I have live — each line a real run with a status badge and a link to the project, so the page claims nothing a visitor can't click through. Inner pages, from Services to Experience to Portfolio, have mini-workflow heroes showing where you are in the flow, and the whole site ships in dark and light themes.
Analytics runs two layers. Vercel Analytics stays on (cookieless, no consent needed), while Google Analytics loads only after explicit cookie consent via Google Tag Manager. Revoke consent and the script gets pulled, cookies cleared, right then. If you work in PR or communications and you're evaluating this, the setup means I know which pages hold attention, where people leave, and whether the interactive workflow actually makes visitors stick around. The contact form routes through Resend's API with Cloudflare Turnstile and a honeypot for spam. GDPR and PDPA compliant, with a privacy page where visitors manage their own preferences.
Want something like this for your team?
Tell me what you're trying to build. I'll tell you if I can help and how.
Let's Talk