andrii.dev
Back to portfolio

01 · Stack

Full technology map

Everything I work with — grouped by role, with context on how deep I go and how the stack shifted toward realtime, AI, and fullstack integrations.

Frameworks & UI

Libraries for web, mobile, and interface work.

Core UI stack across SPAs, SSR apps, and mobile. Strongest in React and Vue ecosystems with a recent shift toward Next.js for production products.

React

Component architecture, hooks, performance tuning, and large app structure. Daily driver for dashboards, AI UIs, and admin tools.

TypeScript

Strict typing across frontend and shared API contracts. Used in all current production work.

Vue.js

Years of client and product work with Vue 2/3, composition API, and Nuxt on legacy and active codebases.

Next.js

App Router, SSR/SSG, API routes, and deployment on Vercel. Primary framework for new Kalyna products.

Nuxt.js

SSR Vue apps and marketplace-style products. Solid experience, less frequent in the current stack.

React Native

Cross-platform mobile apps sharing logic with web. Expo and native modules on client projects.

Tailwind CSS

Utility-first styling, design tokens, and rapid UI iteration. Default for new interfaces.

JavaScript

Deep ES fundamentals — async flows, modules, browser APIs, and legacy codebase maintenance.

SCSS

Architecture for large stylesheets — variables, mixins, BEM-style structure on older projects.

Framer Motion

Page transitions, scroll reveals, and micro-interactions without hurting performance.

Fullstack & Integrations

Backend services, deploy, auth, data, and third-party APIs.

Connecting UI to real backends — auth, databases, webhooks, and third-party services across multiple project layers.

Supabase

Postgres schema, RLS, auth, storage, Edge Functions, migrations, and cron in production apps.

Vercel

Deploy, preview environments, edge config, and hosting for Next.js products.

Expo

React Native build and release — EAS Build, OTA updates, dev clients, and store deployment workflows.

REST APIs

Designing and consuming REST endpoints — error handling, pagination, caching, and typed clients.

Webhooks

Inbound/outbound integrations, signature verification, and retry-safe handlers.

AI Integrations

Model APIs and SDKs wired into product features.

Shipping AI in apps — LLM routes, hosted models, and structured outputs. Separate from transport: these are the providers and SDKs, not how bytes move over the wire.

Vercel AI SDK

Streaming LLM responses, tool calling patterns, and edge-friendly AI routes in Next.js apps.

OpenAI API

Chat completions, embeddings, and structured outputs wired into product features and internal tooling.

Replicate

Running and integrating ML models via API — image, audio, and generative pipelines in production.

Anthropic API

Claude models in product flows — long-context tasks, tool use, and assistant-style UX.

AI Dev Tooling

AI-native editors, coding agents, and local model experiments.

The development instrument layer — separate from product AI. Daily drivers for writing code faster, plus light local LLM setup when exploring models offline.

Cursor

Primary AI-native IDE — context-aware edits, agent workflows, MCP integration, and day-to-day shipping.

Claude Code

Agentic terminal workflows — multi-file refactors, reviews, and faster delivery on complex tasks.

GitHub Copilot

Inline completions and chat as a provider — used alongside other AI tools depending on the task and editor.

Ollama / Local LLM

Minimal local setup with Llama-family models via Ollama — trying AI offline without cloud APIs.

Dev Tooling

Build pipelines, bundlers, and version control.

From Webpack-era setups to Vite-first workflows. Comfortable owning build config and CI-friendly output.

Git

Branching strategies, code review flow, and clean history on team projects.

Vite

Default dev server and build tool for React/Vue SPAs — fast HMR and lean config.

Webpack

Custom loaders, code splitting, and maintaining legacy build pipelines.

Analytics

Measuring what ships — setup, events, and sanity checks.

Surface-level analytics work: wire up tracking in apps, define a minimal event schema, and verify data actually lands. Not deep marketing analytics — enough to connect, configure, and debug the basics.

Google Analytics 4

GA4 property setup, web data streams, and gtag / Google tag integration in React and Next.js apps.

Google Tag Manager

Container install, data layer pushes, and tag triggers — keeping analytics config out of app code where it fits.

Event schema & custom events

Naming events and parameters consistently, mapping key user actions, and keeping a small readable tracking plan.

DebugView & verification

Realtime and DebugView checks after deploy — confirming events fire, parameters look right, and nothing obvious is missing.

Payments

Stripe checkout, callbacks, and Supabase-backed access on SSR apps.

Minimal but complete payment flows on Next.js — customized checkout UI, server-created sessions, webhook callbacks, and syncing subscription state into Supabase for gated features.

Stripe

Checkout Sessions and Payment Element on SSR apps — products, prices, test mode, and keeping secret keys server-side only.

Checkout UI & Elements

Customizing payment forms — Element appearance, layout, and branded checkout without fighting Stripe defaults.

Stripe webhooks & callbacks

Webhook endpoints for payment and subscription events — signature verification, idempotent handlers, and reliable post-checkout updates.

Supabase + Stripe on SSR

Map Stripe customers to Supabase users — persist subscription status in Postgres, gate features with RLS, update state from webhook callbacks.

Realtime

Live data, streaming transport, and persistent connections.

Classic realtime plumbing — long-lived connections and push updates. Used across chat, dashboards, insurance quotes, and AI UIs alike; not tied to a single vendor or to AI itself.

Socket.io

Bidirectional events over WebSockets — rooms, fallbacks, and live app state without polling.

WebSockets

Native WS channels — low-latency dashboards, collaborative UI, and custom protocols alongside REST.

SSE / Streaming

Server-sent events for token streams, progress updates, and one-way live feeds in the browser.

Supabase Realtime

Postgres changes, presence, and broadcast — live data pushed from Supabase to the client.

MCP (Model Context Protocol)

Minimal MCP server — tools/resources, client wiring, and basic auth. Transport layer for AI clients, not a model provider.

Proficiency
Expert
Strong
Familiar