DEV Community: Arya Koste

Choosing a Vector Database in 2026: pgvector vs. Pinecone vs. Qdrant vs. Weaviate vs. Milvus

Arya Koste — Wed, 24 Jun 2026 17:56:49 +0000

Every RAG tutorial pulls the same move. It walks you through embeddings, chunking, retrieval, and then right at the moment of truth it says "now pick a vector database" and just... moves on. Like that's a coffee-order decision. Like you're choosing a font.

It's not. The database you pick decides how fast your queries come back, how much you bleed in infrastructure costs, and how miserable your life gets the day traffic triples. And here's the thing that took me a while to figure out while researching this: the database you start with is often not the one you ship. Teams migrate, sometimes more than once. Some of those moves are clean wins; some are weeks of pain and a postmortem doc.

So let's try to skip the regret. I spent a long time digging through benchmarks, production write-ups, and the trade-offs people only discover after the fact, and this is the guide I wish I'd had when I started: what each of these five (pgvector, Pinecone, Qdrant, Weaviate, and Milvus) is actually good at, where each quietly falls apart, and how to pick without drowning in a feature matrix.

I'll spoil the ending, because it's the most useful thing here: pick based on the infrastructure you already run, not the benchmark you just read. If you're already on Postgres, the answer is probably pgvector and you can almost stop reading. If you never want to touch infrastructure again, it's Pinecone. Everything past that is fine-tuning.

The cheat sheet, for the impatient

If this is you	Use	The one-liner
Already on Postgres, under ~50M vectors	pgvector	One database, zero new problems
Want it to just work, will pay for that	Pinecone	Hand them a key, walk away
Self-hosting and obsessed with speed	Qdrant	The Rust one. It's fast.
Hybrid search is the whole point	Weaviate	Did keyword + vector before it was cool
Heading toward a billion vectors	Milvus	Built for the scale that breaks everything else

Now the actual reasoning.

First, stop staring at the benchmarks

I get the pull. The benchmarks are right there, with their satisfying little bar charts, and one database is 3ms faster than another and that feels like a decision. It mostly isn't. At the scale almost everyone actually operates, every database on this list is fast enough that your users will never feel the difference. The latency war is largely fought over workloads you don't have yet.

What actually decides this, in roughly this order, is four boring questions:

What do you already run? If Postgres is already humming along in your stack (and if you're a full-stack dev, it probably is), bolting on a second database means a sync layer, separate backups, and a whole new thing that can page you at 3am. That gravity is real, and it usually wins.

Do you want to run infrastructure at all? Some people find ops satisfying. Some people would rather light money on fire than configure another cluster. Both are valid. Be honest about which one you are.

How big does this actually get? Under 10 million vectors, genuinely anything works. Between 10 million and a billion, the field thins out fast. Past a billion, you've got maybe two real options.

Do you need hybrid search? This one sneaks up on people. Pure semantic search is great until a user types an exact product ID or a version number and your "vibes-based" retrieval shrugs. More on this later, but file it away.

Answer those four honestly and the database basically picks itself. Here's each one against that lens.

pgvector: the answer that's almost boring enough to be right

pgvector isn't a database. It's a Postgres extension. You teach the database you already have how to do vector search, and that's the whole trick. No new service. No sync layer. No 2am pages from a system you provisioned in a hurry and never fully understood.

Why it's so often the right call. Your vectors sit right next to your actual data, so you can query both in a single transaction, your existing backups already cover them, and filtering is just a SQL WHERE clause: joins, subqueries, the works. The old "Postgres is too slow for vectors" complaint is genuinely outdated; it comes from the bad-old-days IVFFlat era. Once HNSW indexing landed, pgvector started matching dedicated databases at a million vectors, and with the pgvectorscale extension it holds its own well past that, with competitive throughput at 99% recall on tens of millions of vectors. For a huge share of RAG projects this is the right answer, and its only real crime is being unexciting.

Where it starts to hurt. Push past a couple million vectors on one box and index builds start taking twenty-plus minutes, and Postgres's VACUUM process starts elbowing your queries for resources. There's also a subtler trap: pgvector filters after it searches, so a picky filter on a big collection means scanning a pile of candidates to hand you back a handful. Somewhere around 50-100 million vectors you'll be reaching for read replicas, partitioning, or the exit.

Use it if: you're on Postgres, under ~50M vectors, and you don't need to win a latency contest. Most teams are exactly this and don't realize it.

Pinecone: pay money, make the problem disappear

Pinecone basically invented the managed-vector-database category and still sets the bar for it. You get an API key, you make an index, you throw vectors at it, you query them back. There's nothing to size, nothing to tune, nothing to keep alive. That's not a feature list. That's the entire pitch, and it's a genuinely good one.

Why people love it. "I need a vector database and I refuse to think about it any further" is a completely legitimate position, and Pinecone is built precisely for that person. It scales to billions of vectors, it does hybrid search, it's got the enterprise compliance checkboxes. You offload the whole operational headache to someone whose entire job is keeping it up.

The catch (and there's a real one). It's closed-source and there's no self-hosting, full stop. Your data lives in their cloud, and if their pricing shifts or they have a bad day, you have no plan B. The serverless tier swaps latency for convenience and pins your recall at around 90% with no knob to turn. Pinecone just doesn't let you touch the HNSW internals. Writes are eventually consistent, so freshly-added vectors take a beat to show up. Filtering is weaker than SQL (no joins, no subqueries), so anything fancy spills back into your application code. And the bill grows with you, sometimes faster than you'd like.

Use it if: not running infrastructure matters more to you than tuning control, and you've made peace with lock-in as the price of never thinking about this again.

Qdrant: the fast one, and it knows it

Qdrant is open-source, written in Rust, and built from day one to do vector search and basically nothing else. That focus shows.

Why it's appealing. It's the speed leader of the open-source pack, with the lowest p50 latency of the bunch, and the gap actually widens under heavy query load where it matters most. But the real party trick is filtered search: Qdrant runs your filters inside the search traversal instead of bolting them on afterward, so the exact "find me similar shoes, but only the red ones in stock" query that makes pgvector sweat stays snappy here. Add binary quantization that can shrink memory dramatically, plus newer cloud features like GPU-accelerated indexing and multi-AZ failover, and you've got a lot of database for the money. The free tier is the most generous on this list, too.

The honest downside. The ecosystem is younger. You'll find fewer Stack Overflow threads at midnight, fewer random blog posts that happen to solve your exact problem. Though LangChain and LlamaIndex both support it just fine, so you're not in the wilderness. And some teams have reported friction under really heavy concurrent writes, so if you're write-hammering it, test that specifically before you commit.

Use it if: you'll happily run your own infrastructure, you want the best performance per dollar, and fast filtered search is central to what you're building.

Weaviate: the one that wants to be your whole pipeline

Weaviate is open-source too, but it's playing a different game. It doesn't just want to store your vectors, it wants to be the backbone of your entire AI pipeline.

Why it stands out. Two reasons. First, hybrid search, which Weaviate shipped back in late 2022, ages before most of the field caught on. Its implementation is genuinely mature (proper keyword scoring fused with vector results), so if blending semantic and exact-match retrieval is core to your product, this is the most grown-up native option out there. Second, it'll do your embeddings for you: send raw text, and Weaviate vectorizes it on the way in using OpenAI, Cohere, Hugging Face, whatever. Fewer moving parts in your pipeline, which is a real quality-of-life win.

Where it gets heavy. Those built-in vectorizers aren't free. They call the same embedding APIs you'd call yourself, so you're paying that latency and cost, just somewhere less visible. The GraphQL API is a genuine learning curve if your brain is wired for SQL or plain REST. And the Java runtime is hungry when you self-host; operational complexity climbs as you pile on modules and multi-tenancy.

Use it if: native hybrid search is a hard requirement, or you genuinely want the database to handle vectorization so your pipeline has fewer parts to break.

Milvus: bring this one out when things get enormous

Milvus is the most-starred open-source option on GitHub, backed by Zilliz (whose managed Zilliz Cloud is the souped-up enterprise version). It exists for one reason: scale that makes everything else fall over.

Why it earns its place. Nothing else here touches its distributed architecture when you're genuinely big. Heading past a billion vectors? Need GPU-accelerated indexing? This is the tool built for that exact day. At the 100M+ range it's a serious candidate, full stop.

Why you shouldn't reach for it casually. It's a lot of machine. The operational complexity outpaces Qdrant's for normal use cases. Budget real engineering time for the Kubernetes wrangling, and expect your team to climb a learning curve. There's also a known performance gotcha around output fields that can bite in RAG pipelines. If you're under a few tens of millions of vectors, Milvus is almost certainly more database than your problem deserves.

Use it if: you're truly heading into 100M-1B+ territory or need distributed GPU indexing, and you've got the ops capacity to run it.

A quick word on the ones I skipped

ChromaDB earns an honorable mention. It runs right inside your Python process with zero config and is a joy for prototyping. It just doesn't bring the production tooling (high availability, snapshots, real monitoring) the big five do, so think of it as where you start, not where you stay. Faiss (a library, not a database), LanceDB (multi-modal first), Vespa, and the cloud-native managed options like Vertex Vector round out the wider field, but the five above are the ones people actually argue about in production Slack channels.

The hybrid-search thing I keep promising to explain

Here it is, because it quietly decides more choices than people expect. Pure vector search is wonderful right up until someone searches for an exact SKU, a person's name, or "v2.3.1", and suddenly your beautiful semantic embeddings return something thematically adjacent but useless. Real systems need both: the fuzzy semantic match and the exact keyword hit, in the same query.

Weaviate and Qdrant ship this natively. Pinecone bolted it on. pgvector makes you assemble it yourself by hand. If you're building agent memory or RAG over genuinely varied content, treat hybrid search as non-negotiable and let it tilt your decision. It's not a nice-to-have anymore; it's table stakes wearing a trench coat pretending to be a differentiator.

So, what do you actually pick?

If you take one thing from all of this:

You're on Postgres and under ~50M vectors? Use pgvector and go build something. Stop researching.

You never want to see a config file? Pinecone, and make peace with the lock-in.

Self-hosting and you care about speed or filtering? Qdrant.

Hybrid search is the heart of the product? Weaviate.

Staring down hundreds of millions of vectors? Milvus.

And the meta-lesson under all of it: the benchmarks are tie-breakers, not deciders. The database you prototype with probably isn't the one you'll ship, so optimize for the one that's easiest to reason about today and least painful to leave tomorrow. For most teams, honestly, that's pgvector right up until something specific drags them off it. And "something specific" tends to arrive a lot later than the breathless blog posts would have you believe.

One fair warning on the numbers in here: the benchmark figures floating around the industry come from wildly different test setups: different vector dimensions, different hardware, different recall targets, and quite often run by the vendor whose database happens to win. Treat all of it as directionally true rather than gospel, and test against your own data at your own scale before you bet the product on it.

Building a 3D Game in the Browser Humbled Me. Here's Everything That Fought Back.

Arya Koste — Sun, 21 Jun 2026 19:32:38 +0000

This is a submission for the June Solstice Game Jam

Coordinate systems. Rotated bounding boxes. A sine wave cycling 637 times per second. A tribute to Alan Turing hidden in binary light. This is how Solstice Village came to be.

The Idea

June 21. The longest day. Light and darkness at their most dramatic inflection point.

I wanted something that felt like the solstice — not a platformer about suns, not a timer counting daylight seconds. I wanted the quiet tension of a village where every window has gone dark on the longest night, and the warmth that spreads as you, one courier with a lantern, carry light back home to home.

Solstice Village is a 3D exploration game built in Three.js. You play as Sol, walking a circular village, talking to keepers, gathering light at the central brazier, and lighting eight dark homes until the sky shifts from midnight indigo to morning gold.

Play it here: https://aryakoste.github.io/solsticeGame/

What You're Actually Playing

The village is a ring. At the centre: a brazier that flickers. Around it at radius 17 units: eight homes, each dark. Between them at radius 11.5: lamp posts. Beyond the homes: 32 swaying trees, fireflies, a deer, a cat, an owl blinking on a post, and — if you find it — a secret grove with glowing mushrooms and a standing stone.

The main game loop is: Talk → Gather → Deliver → Watch the sky change. Each house lit raises dawnAmount by 1/8. That single float drives everything — sky colour, sun position, fog, ambient light, moon fade. The world literally brightens as you play.

But there is a second ending. If you collect all six spirit wisps scattered around the village without lighting a single home, the game takes a different turn entirely. The village stays dark. The grove awakens. The stone hums. A different piece of narration plays. It rewards the player who ignores the instructions and wanders instead — which felt right for a solstice game, where the night itself has value.

Why 3D on the Web Is a Different Beast Entirely

Most developers who've shipped 2D browser games look at a 3D game and think: it's just one more axis, how much harder can it be?

The answer is: in almost every possible way.

In 2D, your world is flat. Movement is x += vx. Collision is rectangle overlap. Camera is a viewport offset. You render sprites front-to-back and call it done. The computer does what your intuition expects.

In 3D, almost nothing does what your intuition expects.

Everything lives in multiple coordinate spaces at once. Your player exists in world space. The camera that watches them exists in view space. Objects like houses have their own local space, rotated relative to the world. When you need to know if the player is colliding with a rotated house, you can't just compare coordinates — you have to transform the player into the house's local space, do the math there, then rotate the result back. Get any step wrong and the player clips through walls or gets ejected into the sky.

Rotations stop being numbers and become order-dependent operations. In 2D, rotating by 30° then 45° gives the same result as rotating by 45° then 30°. In 3D, the order matters. Rotation around X then Y is not the same as Y then X. This is not a quirk — it's fundamental to how 3D rotations work (they aren't commutative). Every character, every NPC, every camera angle in a 3D game is a product of carefully ordered rotations, and one wrong assumption cascades into every object in the scene pointing the wrong direction.

The camera is its own 3D object, not a window. In 2D you scroll a viewport. In 3D, your camera has a position, an orientation, a field of view, a near clip plane, a far clip plane. A third-person camera orbiting a player requires converting spherical coordinates (yaw angle, pitch angle, distance) into Cartesian (x, y, z). That formula is six trigonometry calls per frame, and if any sign is wrong the camera clips underground, or drifts into the player's head, or spins the wrong direction when you drag the mouse.

Lighting is a full second discipline. In 2D you colour pixels. In 3D, light sources emit in all directions, cast shadows that require their own depth-buffer render pass, bounce off surfaces according to material properties (roughness, metalness, normal maps), and interact with ambient light, hemisphere light, and fog — all simultaneously. Getting a scene to feel right at night, then feel like dawn, requires understanding all of those systems well enough to tune them together.

Time is not a given. In 2D games you often get away with position += speed per frame. In 3D you quickly learn that frame rate varies — a phone runs at 30fps, a desktop at 120fps — and if you animate against raw time without delta-time scaling, your game runs fast on powerful hardware and slow on weak hardware. And even delta-time isn't enough: the specific unit of time matters. Miss a milliseconds-to-seconds conversion anywhere and your animation blows up in ways that look completely inexplicable until you work out the arithmetic.

These aren't beginner mistakes you outgrow. They are the permanent operational cost of building in three dimensions. Every feature you add has to be thought through in all three axes, across multiple coordinate spaces, accounting for arbitrary rotation and variable time. And you discover most of them by shipping a bug.

Here's what Solstice Village taught me.

The Technical Part (Where the 3D Tax Got Collected)

Challenge 1: The NPC That Stared at Walls

Every NPC was placed around the village ring facing away from the plaza — backs to the player, faces to their own house wall. Maddening.

The culprit: Three.js r128's Object3D.lookAt(). This is exactly the kind of 3D convention trap that costs hours. lookAt on any object makes the local −Z axis face the target — the camera convention carried over from OpenGL, where cameras look down -Z by default. When you call grp.lookAt(0,0,0), Three.js rotates the object so its back (-Z) faces the origin. Since the character's face is built at local +Z, every NPC literally showed me their back.

The fix required abandoning lookAt entirely and thinking in terms of the angle I actually needed:

// WRONG — makes local -Z face origin (NPC backs to player)
grp.lookAt(0, 0, 0);

// RIGHT — makes local +Z (the face) point toward origin
grp.rotation.y = Math.atan2(-out.x, -out.z);

Math.atan2(dy, dx) gives the angle of a 2D vector. When you negate both components — (-out.x, -out.z) — you get the angle pointing toward the origin from the NPC's position. Since Three.js character faces have eyes at local +Z, this finally made everyone look at the plaza. The same formula drives NPC head-tracking when you walk close:

// Track player — local +Z toward player
const dx = playerPos.x - n.pos.x;
const dz = playerPos.z - n.pos.z;
n.group.rotation.y = Math.atan2(dx, dz);

Two negations, two formulas, same underlying geometry — just applied in opposite directions. The symmetry is elegant once you find it. Finding it is the hard part.

Challenge 2: The Sine Wave That Cycled 637 Times Per Second

The cat was vibrating. The wisps were strobing. Every frame, the cat's Y position was essentially random — not glitching in some obvious broken way, just wrong, jittering too fast to see what it was trying to do.

The animation code looked fine:

g.position.y = Math.abs(Math.sin(now * 4 + r.phase)) * 0.06;

This is where 3D's time problem came to collect. now came from performance.now() — which returns milliseconds. At 60 fps, now increments by ~16.7 per frame. Math.sin(now * 4) means Math.sin(16.7 × 4) = Math.sin(66.8 radians) per frame. One full sine cycle is 2π ≈ 6.28 radians. So per frame, the animation was completing:

66.8 ÷ 6.28 ≈ 10.6 full cycles per frame

At 60 fps, that's 637 cycles per second. The position was sampling a different, effectively random point on the sine curve every single frame. The cat wasn't jittering — it was animating perfectly at ultrasonic speed. You just can't see 637 Hz with human eyes.

Fix: convert milliseconds to seconds before using as a time parameter:

// Cat bob — multiply by 0.004 = (0.001 to convert ms→s) × (4 Hz frequency)
g.position.y = Math.abs(Math.sin(now * 0.004 + r.phase)) * 0.06;

// Wisp float — explicit ms→s conversion
const t = now * 0.001 + w.phase;
w.orb.position.y = w.oy + Math.sin(t * 1.4) * 0.28;

The firefly animation, written earlier, had correctly used now * 0.001. The roamers and wisps were missing it. One factor of 1000. The difference between a cat that bobs at 4 Hz and a cat that vibrates into another dimension.

Challenge 3: The Camera Orbit

Third-person camera in 3D needs two angles: yaw (horizontal rotation around the player) and pitch (vertical tilt). Converting those spherical coordinates to a Cartesian camera position is one of those formulas you derive, get wrong, stare at, re-derive:

const CAM_DIST = 7.5;
const camYaw = Math.PI; // starts behind player, facing −Z toward plaza

const cx = player.x - Math.sin(camYaw) * Math.cos(camPitch) * CAM_DIST;
const cz = player.z - Math.cos(camYaw) * Math.cos(camPitch) * CAM_DIST;
const cy = player.y + 1.4 + Math.sin(camPitch) * CAM_DIST;
camera.position.set(cx, cy, cz);
camera.lookAt(player.position.x, player.position.y + 1.4, player.position.z);

The Math.cos(camPitch) factor collapses the horizontal offset as pitch increases — when you're looking straight down, the camera is directly above. The Math.sin(camPitch) * CAM_DIST lifts the camera vertically as you tilt up. Both terms together trace a sphere of radius CAM_DIST centred on the player.

Then the movement system has to use that same yaw to map WASD onto world directions, so pressing W always means "forward relative to where the camera is looking":

const wx = Math.sin(camYaw) * fwd + Math.cos(camYaw) * strafe;
const wz = Math.cos(camYaw) * fwd - Math.sin(camYaw) * strafe;
player.rotation.y = Math.atan2(wx, wz);

In 2D this is trivial. In 3D, getting the minus signs right between camera orbit and player movement — so that pressing D strafes right relative to the camera, not world-right — takes real attention.

Challenge 4: Collision Detection Across Rotated Space

Two types of colliders in the world: circular (trees, lamp posts, well, NPCs) and oriented box (rotated houses). Circular collision is manageable:

function _resolveCircle(c) {
  const dx = player.x - c.x, dz = player.z - c.z;
  const dist = Math.sqrt(dx*dx + dz*dz);
  const minDist = playerRadius + c.r;
  if (dist < minDist && dist > 0) {
    player.x += (dx/dist) * (minDist - dist);
    player.z += (dz/dist) * (minDist - dist);
  }
}

Box colliders for houses are the full 3D problem. Each house is rotated to face the plaza — so the box's axes aren't aligned with the world. You can't just compare world-space coordinates. You have to:

Transform the player into the house's local coordinate space
Find the closest point on the axis-aligned box in local space
Compute the penetration depth
Transform the push vector back to world space

function _resolveBox(c) {
  const cos = Math.cos(-c.rotY), sin = Math.sin(-c.rotY);
  const dx = player.x - c.cx, dz = player.z - c.cz;
  // step 1: rotate into box local space
  const lx = cos*dx - sin*dz, lz = sin*dx + cos*dz;
  // step 2: nearest point on box surface
  const px = Math.max(-c.hw, Math.min(c.hw, lx));
  const pz = Math.max(-c.hd, Math.min(c.hd, lz));
  const ox = lx - px, oz = lz - pz;
  const d = Math.sqrt(ox*ox + oz*oz);
  if (d < playerRadius && d > 0) {
    const nx = ox/d, nz = oz/d;
    const push = playerRadius - d;
    // step 3: rotate push back to world space
    player.x += (cos*nx + sin*nz) * push;
    player.z += (-sin*nx + cos*nz) * push;
  }
}

Fourteen lines. Two full rotation transforms. This took longer to get right than any other system in the game — and it's the kind of thing you genuinely cannot debug by guessing. You have to understand the coordinate space transform or you'll never know which of the four signs is wrong.

Challenge 5: Dawn as a Single Variable

The whole sky — background colour, sun height, moon opacity, fog, ambient light, directional light — is driven by one number: dawnAmount, a float from 0 (full night) to 1 (full dawn). This is how you avoid a lighting system that becomes unmanageable. One float. Every system reads it.

// Sky background lerp
const night = new THREE.Color(0x0c1130);
const dawn  = new THREE.Color(0x3a4a82);
scene.background.lerp(night.clone().lerp(dawn, dawnAmount), smoothing);

// Sun rises from underground to sky
const sunY = -12 + dawnAmount * 62; // -12 to +50 units
sunMesh.position.y = sunY;
sunMesh.visible = sunY > -4;

// Moon fades as sun rises
moonMesh.material.opacity = Math.max(0, 1 - dawnAmount * 2.2);

// Scene lighting scales with dawn
sunLight.intensity = 0.35 + dawnAmount * 1.1;
hemi.intensity = 0.7 + dawnAmount * 0.5;

The sun colour shifts from orange to yellow at 40% dawn — mimicking the red horizon of early sunrise shifting to the cleaner yellow of morning:

sunMesh.material.color.setHex(dawnAmount < 0.4 ? 0xff9940 : 0xffe680);

The six wisps scattered around the village each add 8% dawn when collected — a reward for exploration that makes the world respond to curiosity before the main quest requires it. Each wisp also shifts the lantern to its own colour (teal, blue, green) so the light you carry looks different depending on where you've been.

Challenge 6: The Lantern as a Resource, Not a Flag

The original design treated "carrying light" as a binary state — you either had it or you didn't. That worked mechanically, but it meant every trip from the brazier to a home was identical. No tension, no urgency.

The fix was turning the lantern into a fuel system. Light gathered at the brazier fills a lanternFuel float to 1.0. It drains at roughly 1/85th per second — enough for two or three homes per trip at walking pace. As it drains, the lantern physically dims: intensity and opacity both scale with fuel level. The HUD tracks it with colour: gold when full, orange past the halfway point, red and labelled "almost out!" below 20%.

// Each frame while carrying:
lanternFuel = Math.max(0, lanternFuel - dt / 85);
player.userData.lanLight.intensity = 1.8 * lanternFuel;
player.userData.lanMesh.material.opacity = 0.95 * lanternFuel;

if (lanternFuel <= 0) {
  _clearLantern();
  SV.ui.toast('The light faded — return to the brazier');
}

The brazier itself now reacts to how much of the village you've lit. Its flame scales up ~90% in size by full dawn, and its point light gets 70% brighter. The first time you come back to refill and notice the brazier has grown, it feels like the village is waking up with you.

Everything That Made the World Feel Alive

On top of the core systems:

28 fireflies drifting on parametric Lissajous-style curves: x = ox + sin(t × speed) × rx, z = oz + cos(t × 1.3) × rz — the asymmetric frequencies mean they never loop in a straight line
Occasional shooting stars that spawn at a random point on the sky sphere, trail five fading ghost spheres, animate with requestAnimationFrame, and clean themselves from the scene after 1.2 seconds
Aurora band — 12 semi-transparent planes arranged in a ring at radius 70, each tilted slightly differently for an irregular shimmer
1,200 star particles in a single BufferGeometry draw call
Particle burst system — pool of sphere meshes with velocity and gravity, fading by life fraction, spawned on house lighting
Chimney smoke — every lit home emits slow expanding grey spheres from its chimney top every 0.75 seconds, growing as they rise and fading out, making lit homes visible from across the village
Bell on house lighting — a deep resonant bell rings (four harmonics: 110 Hz, 220 Hz, 440 Hz, 880 Hz, each with a 3.2-second exponential decay) underneath the chord stab, so lighting a home sounds like an event
Footstep audio — alternating low tones (78 Hz / 68 Hz) timed to walking pace via a step timer, faster when running. All Web Audio API, no sound files
Web Audio API ambient drone — five overlapping sine oscillators at 55 Hz, 82.4 Hz, 110 Hz, 164.8 Hz, and 220 Hz (a harmonic series), each with decreasing gain
Touch joystick — thumb delta clamped to 46px radius, normalised to ±1, rotated through camera yaw before being applied to movement
Minimap — Canvas 2D drawn every frame: houses as 8×8px squares (dark until lit, gold with glow when lit), NPC positions as dots, player as a filled triangle rotated to match camera yaw
House interiors — enter any lit home: a full room with ceiling beams, a hearth with animated flame cones, warm flickering point light, a table, a bookshelf, and a rug. Each keeper has a note left on the table — Ash's has a bread recipe, Tovar's has a watchman's log, Mira's has three letters of SOLSTICE written in binary
NPC cross-references — each keeper mentions another by name in their opening line, so the village feels like people who know each other rather than eight isolated quest-givers
NPC dawn gathering — past 50% dawn, all eight keepers slowly walk toward the plaza and face the brazier. At full dawn they're clustered together in a silent celebration
Cat follows you — approach the cat and press E; it trails behind you for the rest of the game. The deer does the opposite: get within five units and it startles, flags a flee direction, and runs at four times its normal speed until you're ten units away
Standing stone reacts to progress — at zero homes lit the stone is cold. Past four it glows. At all eight, the Turing inscription appears
8 unique NPCs with different skin tones, hair styles, and dialogue arcs that change after their home is lit
Tree sway — rotation.z and rotation.x oscillating at slightly different frequencies per tree so they never move in sync

Code

Aryakoste / solsticeGame

Solstice Village

A 3D exploration game built for the June Solstice. You are Sol, the courier. The longest night has fallen and every window in the village has gone dark. Gather light at the central brazier and carry it home to home until the sky turns gold.

Play it here →

Gameplay

Talk to each of the 8 keepers to learn their story
Gather light at the plaza brazier — your lantern holds ~85 seconds of flame
Carry the light to dark homes and deliver it
Watch dawnAmount rise from 0 to 1 as the village lights up — every system in the game (sky colour, sun height, fog, moon fade, brazier size, NPC behaviour) is driven by this single float

There is a second ending. Collect all six spirit wisps scattered around the village without lighting any homes, and the game takes a different path.

Controls

Input	Action
`W`

…

View on GitHub

Prize Category

The Alan Turing Prize Category

One of the NPCs, Mira the clockmaker, says this when you approach her dark house:

"Every lit window is a 1, every dark one a 0. Light mine and we add a bit to the dawn."

That's not just flavour text. At the top of the screen runs a binary strip that displays the ASCII value of each letter in "SOLSTICE" — one letter per house you light. When Bell's house lights up, the strip fills in 01010011 (S = 83). When Fen's lights up, it fills 01001111 (O = 79). Eight houses. Eight letters. Eight bytes spelling out the word in light.

S = 01010011
O = 01001111
L = 01001100
S = 01010011
T = 01010100
I = 01001001
C = 01000011
E = 01000101

And in the secret grove at the northeast edge of the map, a standing stone reads:

"Beneath the runes, a name: TURING. And below it — ones and zeros."

Binary as metaphor for light. Light as computation. Every dark window a zero waiting to be flipped.

Google AI in the Process

Google AI Studio and Gemini were part of the development loop throughout — helping reason through Three.js's coordinate conventions, sanity-checking the spherical camera orbit math, and catching the milliseconds-to-seconds unit mismatch before it became a harder bug. When I described the NPC-facing problem, Gemini confirmed the camera-convention issue with lookAt and helped verify the atan2 formula direction before I changed code. The kind of quick second opinion that saves an hour of trial and error at midnight.

Play It

Works in any modern browser, desktop and mobile.

Controls:

WASD / left joystick — move
Shift — run
Click + drag, or touch the right side of the screen — rotate camera
E / Talk button — interact with NPCs, brazier, homes, wisps

Find the secret grove in the northeast. Read the standing stone — it says something different depending on how many homes you've lit. Pet the cat. Let the deer startle away from you. Light all eight homes and watch the sky turn.

Or don't light any of them. Collect all six wisps instead, and see what the night has to say.

The longest night ends. That's what the solstice is: not the absence of light, but the moment right before it comes back.

#gamedev #javascript #threejs #webdev

ClawCraft: Bringing a Full Visual Studio to OpenClaw 🛠️

Arya Koste — Sat, 25 Apr 2026 22:21:00 +0000

This is a submission for the OpenClaw Challenge.

Building OpenClaw skills is an incredibly powerful way to automate workflows across messaging platforms. But let's be honest: managing them locally, writing YAML/JSON boilerplate, ensuring they are safe to run, and debugging failures without a proper environment can require more context-switching than we'd like.

So, for this developer challenge, I set out to build ClawCraft, a comprehensive local development environment and companion skill specifically designed for OpenClaw.

ClawCraft isn't just a basic tool—it's a powerful Command Line Interface (CLI), a local web dashboard (Client UI) running a Fastify backend server, and an OpenClaw Skill. It allows you to build, scan, debug, and manage your skills without ever touching code—unless you want to.

⭐ Check out the GitHub Repository here! ⭐

🎨 The Client UI: A Beautiful Local Dashboard

First and foremost, ClawCraft launches a sleek, React-based web dashboard locally on your machine. This is your command center.

Instead of messing around with local folders, strict syntax, and terminal logs, the Client UI gives you a visual overview of every OpenClaw skill you have installed, the ability to trigger API commands instantly, and access to all the core developer tools right from your browser.

🔥 Headline Features

1. 🏗️ Visual Skill Builder

Why write boilerplate when you can just drag and drop? The intuitive Client UI uses @dnd-kit to let you string together the logic of your OpenClaw skills visually. For power users who still want granular control over their code, there's a fully integrated Monaco code editor providing a rich, IDE-like fallback experience.

2. 🤖 AI Skill Generation

Have an idea but don't want to drag blocks or write code? Tell ClawCraft what you want! Powered by Anthropic and OpenAI SDKs directly in the backend, you can just type a natural language prompt (e.g., "Make a skill to fetch top 3 hacker news articles"). The AI will scaffold the entire OpenClaw skill structure, parameters, and logic for you instantly.

3. 🚨 Built-in Security Scanner with Trust Scores

You shouldn't just run random skills you find online blindly on your system. ClawCraft includes an automatic security scanner that analyzes any external skill (via URL or name), scanning the implementation logic, and summarizing exactly what it is attempting to do.
The scanner returns a Trust Score directly in the UI:

✅ Safe
⚠️ Review Required
🚨 Dangerous (Do not install!)

4. 🪲 Live Debugger

Testing an OpenClaw skill but it's failing silently in Slack or Telegram? Launch the local debugger dashboard. ClawCraft lets you inspect variables, view the actual HTTP payloads, and trace exactly where the flow broke in real-time.

💻 The Command Line Interface (CLI)

Prefer living in the terminal? You can control your entire OpenClaw setup using the native CLI. Under the hood, this uses commander.js and provides beautifully formatted output.

Here are the commands you have at your disposal:

clawcraft start [--port] [--no-open] - Starts the local Fastify backend and launches the React dashboard.
clawcraft list - Lists all currently installed skills along with their security trust score badges.
clawcraft generate <description> - Uses LLM integrations to immediately scaffold and format an entire SKILL.md file from a single sentence request.
clawcraft scan [target] - Scans all local skills, or a specific skill by URL or name, for malicious patterns and returns the Trust Score and findings list.
clawcraft install <url> [--force] - Scans an external repository and installs it securely. Prompts if it's considered dangerous unless --force is used!
clawcraft fix <skillName> - Immediately opens the browser UI directly to the local debugger for the specified skill.
clawcraft improve <skillName> - An automated AI flow that attempts to rewrite your skill with better guardrails, optimized permissions, and deterministic instructions, and prompts to save!
clawcraft config [get/set] - Read and modify the configuration such as adding API keys safely.

🤯 The Meta Feature: The ClawCraft OpenClaw Skill

Yes, ClawCraft comes with its own native, companion OpenClaw skill (clawcraft tag) within the repo!

Once your local ClawCraft server is running, you can manage your entire OpenClaw development environment directly from Slack, Discord, Whatsapp, or Telegram using slash commands. It's wildly satisfying to build OpenClaw skills using an OpenClaw skill.

/clawcraft build "get current bitcoin price" - Automatically opens your UI and uses AI to generate the skill for you!
/clawcraft scan {skill-url} - Scans the repository for the Trust Score and reads it back to you right in the chat.
/clawcraft list - Returns a list of all your installed skills.
/clawcraft search "find templates" - Searches available community templates and installed skills.
/clawcraft status - See how many times your skills have fired and the estimated time they've saved you!

🛠️ Tech Stack & Architecture

ClawCraft is structured as a modern JavaScript monorepo using npm workspaces:

Frontend (packages/client): React 18, Vite, TailwindCSS for styling, @dnd-kit for drag-and-drop visuals, and Monaco Editor.
Backend (packages/server): A lightning-fast Fastify server providing the core OpenClaw system APIs.
CLI Toolkit: Powered by Commander.js and Chalk.
AI integrations: Native SDK integrations for both Anthropic and OpenAI logic generation.

🚀 Quick Start (Running from Source)

ClawCraft is designed to be cloned and run directly from the source to give you absolute control over your local environment. Here is how you can spin everything up:

# 1. Clone the repository
git clone https://github.com/Aryakoste/ClawCraft.git
cd ClawCraft

# 2. Install dependencies (This securely installs both client and server via npm workspaces)
npm install

# 3. Start the application
npm run dev

(Running npm run dev kicks off a script that concurrently boot up both the Fastify server on port 4000 and the Vite Client UI dashboard simultaneously!)

Some Screenshots for UI

Skill Generator

Template Gallery

Skill Debugger

Skill Composer

Usage Tracker

🧠 Configuring the AI

ClawCraft's powerful generator (clawcraft generate and clawcraft improve) relies on an LLM to do the heavy lifting. You can configure it to use Anthropic, OpenAI, local Ollama endpoints, and more.

Use the built-in CLI to easily securely set your keys and providers (saved locally to ~/.clawcraft/config.json):

# Set your core provider (anthropic, openai, ollama, openai-compat, openclaw)
clawcraft config set llmProvider anthropic

# Provide your authentication key
clawcraft config set apiKey "sk-ant-xxxxxxxxxx"

# Set your preferred model version (Defaults to sonnet!)
clawcraft config set model "claude-3-5-sonnet-20241022"

Once configured, point your messaging app to the local dashboard (http://localhost:4000), load up the skill/ directory, and start giving it slash commands!

Final Thoughts 💭

I loved exploring how endlessly hackable OpenClaw is during this challenge. My primary goal with ClawCraft was to significantly lower the barrier to entry for creating, auditing, and installing those skills. I firmly believe that making OpenClaw visual, secure, and easily manageable will help onboard a lot more non-developers into the AI automation space.

Would love any thoughts, PRs, or feedback from the community!

Drop a ⭐ on the Repo or try it out!

I Put Carbon Pledges on the Solana Blockchain for Earth Day (And Built the AI to Back It Up)

Arya Koste — Sun, 19 Apr 2026 20:00:48 +0000

This is a submission for Weekend Challenge: Earth Day Edition

Did you know that a single cheeseburger emits roughly 3.5 kg of CO₂? That's equivalent to driving 14 km in a petrol car — from a sandwich.

Most of us have no idea what our daily choices actually cost the planet. And even when we do, knowing isn't enough. What if you could prove you're changing — publicly, permanently, on the blockchain?

EcoLens is an AI-powered carbon footprint analyzer that goes beyond awareness. It identifies your impact, proposes greener alternatives, and lets you pledge your commitment on the Solana blockchain — a public, immutable record that your word is real.

The Problem

Carbon footprint calculators exist, but they're tedious. You fill out a form, pick from dropdowns, hit calculate, and get a vague yearly number that means nothing to your Tuesday lunch decision.

The real gap isn't information — it's accountability. People know beef is carbon-heavy. They still order it. What changes behavior is a commitment with skin in the game.

That's the loop I wanted to close: identify → understand → pledge → act.

What EcoLens Does

📸 Vision Analysis

Upload any image — your meal, a shopping receipt, your car, a product — and Gemini 2.0 Flash analyzes it using real lifecycle emissions data. You don't describe anything; just point your camera.

✍️ Text & Voice Analysis

Type or speak a description:

"I flew economy class from Mumbai to London"
→ 1,850 kg CO₂ · Very High Impact · Equivalent to driving 7,400 km

⚖️ Compare Mode

Can't decide? Compare two options side by side — "beef burger vs. black bean burger" — and see exactly how many kg CO₂ you save by choosing the greener option, with a winner crown.

🌿 Structured Results

Every analysis returns:

CO₂ in kg, severity rating, animated breakdown by source
3 specific, actionable alternatives with estimated savings
A relatable real-world equivalent

◎ Solana On-Chain Pledges ← the key differentiator

After every analysis, you can sign a pledge with your Phantom wallet. The commitment is written as a Memo transaction on Solana — permanent, public, tied to your wallet address.

🤖 Streaming AI Agent

A persistent chat powered by Gemini that streams responses token-by-token, secured behind Auth0.

📊 Carbon Budget + History

Set a weekly CO₂ budget. Every analysis is saved to localStorage, tracked against your goal, and visualised in a circular progress meter.

The Tech Stack

Layer	Choice	Why
Framework	Next.js 15 (App Router)	Server components + API routes in one repo
AI	Google Gemini 2.0 Flash	Vision + text + streaming, accurate emissions data
Auth	Auth0 for Agents	Protects AI endpoints, user identity scoping
Blockchain	Solana (Devnet)	On-chain pledge via Phantom + Memo Program
Animation	Framer Motion	Smooth result reveals, animated CO₂ bars
Styling	Tailwind CSS	Custom dark earth-tone design system

How I Used Google Gemini

Gemini is the brain of EcoLens — it handles both image analysis and chat via gemini-2.0-flash.

The key insight was engineering a structured output contract. The model always returns valid JSON so the UI can render rich cards without parsing gymnastics:

const ANALYSIS_PROMPT = `You are EcoLens AI, an expert environmental scientist.
Analyze the input and return ONLY valid JSON:
{
  "carbonKg": number,
  "category": "food" | "transport" | "energy" | "shopping" | "waste" | "other",
  "title": string,
  "summary": string,
  "breakdown": [{"label": string, "kg": number, "percentage": number}],
  "alternatives": [{"action": string, "impact": string, "reduction": string}],
  "equivalent": string,
  "severity": "low" | "medium" | "high" | "very_high",
  "rating": number
}`;

For image analysis, the image and prompt go in a single multimodal API call:

const parts: Part[] = [
  { inlineData: { data: imageBase64, mimeType: file.type } },
  { text: "Analyze the carbon footprint of everything in this image." },
];
const result = await model.generateContent({
  contents: [{ role: "user", parts }],
  generationConfig: { temperature: 0.3 }, // low temp = consistent scientific estimates
});

The AI chat uses streaming via sendMessageStream — responses type out token-by-token with a blinking cursor, making it feel alive:

export async function* streamChatWithEcoAgent(message, history) {
  const result = await chat.sendMessageStream(message);
  for await (const chunk of result.stream) {
    if (chunk.text()) yield chunk.text();
  }
}

The API route pipes this directly into a ReadableStream response — no buffering, no delay.

How I Used Auth0 for Agents

Every call that touches the Gemini AI is gated by Auth0 before the agent acts. This is the "Auth0 for Agents" pattern: the AI doesn't act anonymously, it acts on behalf of a verified identity.

// app/api/analyze/route.ts
export async function POST(req: NextRequest) {
  const session = await getSession();

  if (!session?.user) {
    return NextResponse.json({ error: "Authentication required" }, { status: 401 });
  }

  // Agent acts on behalf of session.user.sub — traceable, auditable
  const analysis = await analyzeCarbon(text, imageBase64, imageMimeType);
  return NextResponse.json({ analysis, analyzedBy: session.user.sub });
}

The same gate protects /api/chat and /api/compare. No anonymous AI calls — every analysis is tied to a real, verified person.

How I Used Solana — The Heart of the Accountability Loop

This is the part I'm most excited about, and the piece that makes EcoLens more than just another carbon calculator.

The idea: awareness without commitment changes nothing. Solana lets us make commitments permanent and public.

The Flow

Gemini analyzes your activity and suggests a greener alternative
You click "Sign pledge with Phantom"
EcoLens constructs a Memo transaction encoding your pledge, the CO₂ saved, and a timestamp
Phantom signs and broadcasts it to Solana Devnet
The transaction is confirmed on-chain — your pledge is now permanent

import {
  Connection, PublicKey, Transaction,
  TransactionInstruction, clusterApiUrl,
} from "@solana/web3.js";

const MEMO_PROGRAM_ID = new PublicKey("MemoSq4gqABAXKb96qnH8TysNcWxMyWCqXgDLGmfcHr");

const memoData = JSON.stringify({
  app: "EcoLens",
  pledge: "I pledge to: cycle instead of drive this week",
  carbonKg: 2.4,
  ts: new Date().toISOString(),
});

const tx = new Transaction().add(
  new TransactionInstruction({
    keys: [{ pubkey: publicKey, isSigner: true, isWritable: false }],
    programId: MEMO_PROGRAM_ID,
    data: Buffer.from(memoData, "utf-8"),
  })
);

const { signature } = await window.solana.signAndSendTransaction(tx);
await connection.confirmTransaction({ signature, blockhash, lastValidBlockHeight });

The pledge is verifiable on Solana Explorer. Anyone can look up your wallet and see your carbon commitments, timestamped and immutable.

Why the Memo Program?

The Solana Memo Program (MemoSq4gqABAXKb96qnH8TysNcWxMyWCqXgDLGmfcHr) is the simplest, cheapest way to write arbitrary data on-chain. A pledge transaction costs a fraction of a cent in SOL and is confirmed in ~400ms. It's perfect for this use case — lightweight, auditable, and human-readable.

Why This Matters Beyond the Demo

Carbon pledges have a trust problem. Corporate net-zero commitments get announced and quietly abandoned. There's no receipt. Solana changes that: your pledge is a transaction hash. It can't be edited, deleted, or denied. Future versions of EcoLens could build a public leaderboard of wallets with the most on-chain green commitments — turning individual accountability into social proof.

A Real Example: From Analysis to On-Chain Pledge

Here's the full EcoLens loop in action:

1. User uploads photo of beef steak dinner
   → Gemini Vision: 6.8 kg CO₂ · High Impact

2. Breakdown:
   Beef (production)    ████████  5.2 kg (76%)
   Cooking energy       ██        0.9 kg (13%)
   Transport/packaging  ▌         0.7 kg (11%)

3. Equivalent to: Driving 27 km in a petrol car

4. Top alternative: "Choose chicken instead — Save ~4.1 kg CO₂"

5. User clicks "Sign pledge with Phantom"
   → Phantom signs memo transaction
   → Confirmed on Solana Devnet in 412ms
   → TX: 3xK7...mNpQ (verifiable on Explorer)

That's the full loop — from a photo to an on-chain commitment in under 30 seconds.

What I Learned

Structured outputs unlock rich UIs. Getting Gemini to reliably return JSON meant the frontend could be fully reactive — no parsing edge cases, no streaming text parsing hacks.

Temperature matters for science. At 0.7, CO₂ estimates drift between calls. At 0.3, they're reproducible and match published lifecycle data.

Solana's Memo Program is criminally underused. It's the simplest on-chain data primitive — 0.000005 SOL per transaction, confirmed in milliseconds, human-readable on Explorer. For any app that needs verifiable records, it's a better solution than most people realize.

Auth-gating AI is a pattern, not an afterthought. Making the AI agent require Auth0 session means every analysis is tied to a real identity — which is the foundation for future per-user carbon portfolios and wallet-linked pledge histories.

Try It Yourself

Aryakoste / ecolens

🌍 EcoLens

AI Carbon Footprint Analyzer with On-Chain Pledges

Snap a photo of your lunch, describe your commute, or upload a receipt — EcoLens uses Google Gemini Vision to instantly reveal the hidden CO₂ cost of your daily choices. Then pledge to do better on the Solana blockchain — a permanent, public, verifiable commitment.

✨ Features

Feature	Description
📸 Vision Analysis	Upload any photo — Gemini Vision identifies items and calculates CO₂
✍️ Text Analysis	Describe any activity and get an accurate, sourced emission estimate
🎙️ Voice Input	Speak your description using the browser's Speech API
⚖️ Compare Mode	Race two options side by side — see the greener choice with a winner crown
◎ Solana Pledges	Sign an on-chain pledge with Phantom — permanent, immutable, verifiable
🤖 Streaming AI Chat	Gemini-powered eco-agent that streams responses token-by-token
📊 Carbon Budget	Set a weekly CO₂ goal and track it against a

…

View on GitHub

git clone https://github.com/aryakoste/ecolens
cd ecolens
cp .env.local.example .env.local
# Add GEMINI_API_KEY, Auth0 credentials
npm install
npm run dev

To test the Solana pledge feature, install Phantom wallet and switch it to Devnet in settings.

What's Next

[ ] Mainnet pledges — real SOL-backed carbon commitments with token rewards for follow-through
[ ] Public pledge leaderboard — on-chain wallet rankings for green commitments
[ ] NFT certificates — mint a Solana NFT when you hit a weekly carbon goal
[ ] Snowflake analytics — aggregate anonymized emissions data across all users for community insights

Prize Categories

Prize	Technology	How it's used
Best use of Solana	`@solana/web3.js` + Phantom	On-chain carbon pledges via the Memo Program
Best use of Google Gemini	Gemini 2.0 Flash	Vision analysis, structured JSON output, streaming chat
Best use of Auth0 for Agents	`@auth0/nextjs-auth0` v3	Auth-gates every AI endpoint — the agent acts on behalf of a verified identity

Every gram of CO₂ you avoid is a gift to the planet. And now, you can prove it. Happy Earth Day 🌍

Built with Google Gemini 2.0 Flash, Auth0 for Agents, and Solana for the DEV.to Earth Day Challenge 2025.

I Built a Government-Grade Button Clicking Certification Program (Because the World Needs It)

Arya Koste — Tue, 07 Apr 2026 16:47:36 +0000

This is a submission for the DEV April Fools Challenge

⚠️ NATIONAL CLICK THREAT LEVEL: ELEVATED

Let me ask you something.

You use buttons every day. Login buttons. Submit buttons. "Accept all cookies" buttons (without reading a single word). Elevator buttons. Crosswalk buttons that don't actually do anything.

But have you ever been certified to click those buttons?

No. You haven't. And frankly, it's reckless.

That's why I built the International Bureau of Button Clicking Certification (IBCC) — a fully interactive, deeply useless, government-bureaucracy-themed web application that puts you through six increasingly absurd examinations to determine if you are, in fact, qualified to press a rectangular area on an illuminated screen.

🏛️ Why Button Clicking Certification Matters in 2026

Let's look at the facts:

The average knowledge worker clicks 4,217 times per day. That's over 1.5 million clicks per year — completely unregulated.
Zero countries currently require a clicking license. Zero. Not even Switzerland, and they regulate everything.
In 1987, a single misclick at the Pentagon accidentally ordered 40,000 rubber ducks. This is not in any official record because they covered it up. But I believe it happened.
Self-driving cars are regulated. Surgeons are licensed. Barbers need a certificate. But the person clicking "Deploy to Production" on a Friday at 4:59 PM? No credentials required. Think about that.

The click economy is booming. AI is automating everything except clicking. If anything, we need more human clickers than ever. And yet, the industry has no standards, no oversight, and no governing body.

Until now.

The IBCC was established in 1847 (citation needed) and has been monitoring global click activity from a basement somewhere ever since.

🖱️ What I Built

A single-page HTML/CSS/JS application that is equal parts:

DMV waiting room (the aesthetic)
Escape room (the challenges)
Fever dream (the experience)

The Core Experience

You land on the page and you're greeted by an official government seal, a scrolling threat-level ticker, and a giant 3D red button that is begging to be pressed.

Every click is tracked. Every click is logged. Every click brings you closer to certification — or further from sanity.

The Stats Dashboard

Because no government bureau is complete without meaningless metrics:

Total Clicks — the only number that matters
Clicks Per Second — your raw throughput
Accuracy™ — a completely fabricated percentage that goes up the more you click, because we believe in positive reinforcement
Click Power — a multiplier that grows every 100 clicks, achieving absolutely nothing

The Clearance Level System

As you click, you ascend through increasingly dramatic security clearances:

Clicks	Clearance Level
0	UNCLASSIFIED
10	CONFIDENTIAL
50	SECRET
150	TOP SECRET
400	COSMIC TOP SECRET
800	ULTRA MEGA SECRET
1,500	BEYOND CLASSIFICATION
3,000	CLICK DEITY

Each level has its own color, its own glow, and its own sense of hollow accomplishment.

The Six Certification Examinations

This is where it gets interactive. Each exam unlocks at a certain click threshold and tests a completely useless skill:

EXAM 1: Speed Clicking Qualification
Click 20 times in 5 seconds. Prove you are not, in fact, a sloth. This is your warm-up. If you fail this, the Bureau recommends a different career path (perhaps data entry, where the stakes are somehow even lower).

EXAM 2: Precision Click Assessment
Five targets appear on screen. They shrink. You must hit them. Missing is described as "a federal offense" in the fine print (it isn't, but the guilt is real). The targets get smaller with each hit because the Bureau believes in escalating psychological pressure.

EXAM 3: Patience Endurance Trial
Hold a button for exactly 7.0 seconds. Not 6.5. Not 7.8. Seven. There's a ±0.5 second tolerance because the Bureau is generous (they aren't, but the lawyers insisted). This exam has a 73% failure rate among developers because we are physically incapable of waiting for anything.

EXAM 4: Rhythmic Click Synchronization
A circle pulses. You click when it lights up. It's like Guitar Hero but with a single button, no music, and no fun. Score 6 out of 10 to pass. The Bureau considers anything below that "arrhythmic clicking" which is, apparently, a diagnosable condition.

EXAM 5: Morse Code Transmission
Tap out S.O.S. in Morse code (short-short-short, long-long-long, short-short-short). This is the exam where most people realize they have no idea what Morse code actually is, despite confidently claiming otherwise at dinner parties.

EXAM 6: The Trust Exercise
This is my favorite. A big red button appears. It says "DON'T CLICK." You must resist for 10 seconds. While the system actively taunts you:

"Come on, just one little click..."
"Nobody's watching... 👀"
"Your finger is already moving, isn't it?"
"Other test subjects all failed at this point..."

If you click it, a giant "DENIED" stamp slams across your screen. You deserve it.

Bonus Chaos

Because six exams weren't enough:

Combo System: Click fast enough and a combo counter appears. Hit 20x for the "UNSTOPPABLE" achievement.
13+ Achievements: From "First Click" (participation trophy energy) to "CERTIFIED CLICKER" (you completed all exams and should probably go outside).
Random Events: A 3% chance per click that the system flags you with alerts like "SUSPICIOUS CLICKING PATTERN DETECTED" or "Agent #404 is now monitoring this session."
The DENIED Stamp: Randomly slams across your screen with a satisfying animation, just to keep you on your toes.
Particle Explosions: Every click spawns emoji particles. Higher combos = more particles. Your screen will look like a New Year's Eve celebration at a bureaucratic office party.
Confetti: At every milestone (10, 50, 100, 500, 1000 clicks), confetti rains down. Because positive reinforcement is free.
Secret Keyboard Shortcuts:
- D — Activates Dance Mode (the entire page starts shifting through hue rotations while the button spins maniacally)
- T — Thermal Vision (high saturation + contrast, makes the button look like a heat signature)
- S — Secret bonus: awards 50 clicks instantly and fires confetti

The Certificate

Complete all six exams and you receive an official Certificate of Completion — a parchment-textured, gold-bordered, absolutely meaningless document that declares you a "Certified Professional Button Clicker (CPBC)."

It includes:

Your name (you get to type it in, very official)
A 3D rotating trophy
A stamp in the corner that reads "VERIFIED USELESS"
A statement that the certificate "carries absolutely no legal weight in any jurisdiction, real or imagined"
A note that it's valid for 0 days

🛠️ Technical Decisions (and Regrets)

Pure HTML/CSS/JS. No frameworks. No build tools. No npm install. Just one file and vibes. If a government bureau from 1847 could build a website, they wouldn't use React either.

CSS 3D transforms for the button (it has actual depth with a translateZ based top and side), the trophy rotation, and the certificate reveal animation.

Pure CSS animations everywhere — the scanning ticker, the seal rotation, the shimmer on progress bars, the particle system, the combo pop, the stamp slam. Sixty percent of the code is CSS, which feels appropriate for something that accomplishes nothing.

No external dependencies. Just Google Fonts. The Bureau doesn't trust third-party packages (honestly, neither should you).

🤖 Google AI: The Bureau's Secret Intelligence Division

Gemini for Ideation

Honestly, half the challenge ideas came from brainstorming with Gemini. I started with "speed clicking test" and asked it to push the absurdity further. The Morse Code SOS exam and the Trust Exercise (where you have to NOT click a button for 10 seconds) were both born from those conversations. Gemini is genuinely great at "yes, and" — give it a silly premise and it will escalate it with you.

Why Gemini Specifically

For a project this stupid, I needed an AI that could commit fully to the bit without constantly trying to be helpful or breaking character with disclaimers. Gemini handled the deadpan tone better than I expected — it never once tried to inform me that button clicking certification isn't real, which I respect deeply.

I also used Gemini to help workshop the bureaucratic tone — the fake fun facts, the threat-level ticker messages, the achievement names. When you need 12 variations of "fake government propaganda about clicking," an AI is genuinely the right tool for the job.

What surprised me: Gemini was really good at the deadpan humor. I expected it to play things safe, but when I told it to commit fully to the bit and write like a 1980s instruction manual that had lost its mind, it delivered.

📋 Form CL-7042: Closing Remarks

Look, I know what you're thinking: "This is completely useless."

Yes. That's the point. That's literally the challenge.

But also — is it? In a world where we click "I have read and agree to the Terms of Service" without reading a single word, maybe we do need a certification program. Maybe we should be tested. Maybe the fact that anyone can deploy to production with a single, untrained, uncertified click is the real problem.

Or maybe I just spent way too long making a 3D button that shoots emoji particles.

Either way, I regret nothing.

Go get certified: https://aryakoste.github.io/buttonClickingCertification/button-certification.html

The International Bureau of Button Clicking Certification. Est. 1847. "Click Responsibly."

P.S. — Your clicks are being monitored. They always have been.

Built for the DEV Challenge: Build Something Useless. This software solves exactly zero real-world problems and I'm proud of it.

I Gave My Notion Workspace a Brain — Here's What Happened

Arya Koste — Sun, 29 Mar 2026 19:43:20 +0000

This is a submission for the Notion MCP Challenge

I spent a weekend building an AI that autonomously operates inside Notion. You type one sentence. It searches your workspace, reasons about what to do, creates pages, spins up databases, populates tasks — and you watch every single step happen in real time. Here's how I built it and why it might be the most useful thing I've ever made.

The Frustration That Started This

I've been a Notion user. My workspace is a sprawling mess of half-finished project pages, meeting notes that never got followed up on, and goals I set in January that I haven't looked at since.

The problem isn't Notion. Notion is incredible. The problem is that Notion is entirely passive. It sits there, waiting. It does nothing unless you tell it exactly what to do, how to structure it, and where to put it.

I kept thinking: what if Notion could just... think? What if I could say "set up a Q2 OKR tracking system" and it would actually do it — build the database, create the objectives, set up the weekly check-in templates, write the guidelines page — without me having to architect every single piece?

That's Apex.

What I Built

Apex is a full-stack AI command center that gives Llama 3.3 70B (via Groq) complete autonomous access to your Notion workspace. You chat with it naturally. It reasons, plans, and executes — using 10 Notion MCP tools in sequence — while you watch every operation happen live on screen.

It's not a chatbot that tells you how to use Notion. It's an agent that uses Notion for you.

Why Groq? Groq's free tier gives you 14,400 requests/day with no credit card required. Llama 3.3 70B handles tool calling excellently — and it's genuinely fast. Zero cost to run.

7 Intelligent Modes

Each mode has a deeply engineered system prompt that makes the AI behave like a domain specialist:

Mode	What It Does
💬 Chat	Natural language Q&A — ask anything about your workspace
🏗️ Project Blueprint	One sentence → hub page + task database + timeline + risk log
🧠 Brain Dump	Raw chaos → organized, searchable Notion knowledge base
📋 Meeting Intelligence	Paste notes → decisions, action items, owners, follow-ups
📊 Weekly Review	AI scans entire workspace → CEO-level intelligence report
🎯 OKR Tracker	Define goals → complete OKR system with check-in templates
📅 Content Calendar	Describe strategy → 20+ content ideas across all channels

The Feature I'm Most Proud Of: Live Tool Use Visualization

Most AI tools are black boxes. You ask, you wait, you get an answer. You have no idea what happened in between.

Apex flips this. As the AI works, you see every single Notion operation as it happens — animated cards streaming in, showing you exactly what the AI is doing and why:

🌐  Scanning Workspace...                          ✓ 12 pages, 3 databases
🔍  Searching Notion...     "Q2 goals"             ✓ Found 2 related pages
📄  Creating Page...        "🎯 Q2 Goals Hub"      ✓ Created
🗄️  Building OKR Database.. "Q2 OKR Tracker"       ✓ Created with 8 fields
➕  Adding Record...        "Grow MRR by 40%"      ✓ Objective added
➕  Adding Record...        "Key Result: MRR > $50k"✓ KR added
📄  Creating Page...        "📋 Weekly Check-in"   ✓ Template created
📄  Creating Page...        "🏆 Wins & Learnings"  ✓ Log created

Eight Notion operations, chained intelligently, executed autonomously. The whole OKR system is live in your workspace before you've finished reading the output.

This transparency is what makes it feel like a genuine AI colleague rather than a magic trick.

Video Demo

Technical Deep Dive

Stack

Frontend: Next.js 14 (App Router) + TypeScript
Styling: Tailwind CSS with glassmorphism, animated ambient orbs, dot-grid background
AI: Llama 3.3 70B via Groq SDK — streaming + multi-turn tool use
Notion: @notionhq/client — 10 MCP-compatible tools
Transport: Server-Sent Events for real-time streaming

The 10 Notion MCP Tools

const NOTION_TOOLS = [
  "search_notion",           // Full-text search across workspace
  "create_notion_page",      // Create pages with rich markdown → block conversion
  "get_page_content",        // Read any page's full content
  "update_notion_page",      // Append structured content to existing pages
  "create_project_database", // Task DB: Status, Priority, Due Date, Assignee, Tags
  "query_database",          // Retrieve records with optional filters
  "get_workspace_overview",  // Scan recent pages and databases
  "add_database_item",       // Insert rows with proper property types
  "create_goals_tracker",    // OKR DB: Objective/KR, Progress %, Owner, Quarter
  "create_content_calendar", // Editorial DB: Channel, Type, Status, Publish Date
]

Tools are defined in OpenAI-compatible format (which Groq uses), so each tool looks like:

{
  type: "function",
  function: {
    name: "create_notion_page",
    description: "Create a new page in Notion with rich content...",
    parameters: {
      type: "object",
      properties: {
        title: { type: "string", description: "Title of the new page" },
        content: { type: "string", description: "Page content in markdown format..." },
        icon: { type: "string", description: "Emoji icon for the page" },
      },
      required: ["title", "content"],
    },
  },
}

The Multi-Turn Streaming Loop

This is the core of the whole thing. The AI doesn't just make one tool call — it chains as many as needed, reasoning about results before deciding what to do next:

const groq = new Groq({ apiKey: process.env.GROQ_API_KEY });

// Keep looping until the model stops using tools
while (true) {
  const streamResponse = await groq.chat.completions.create({
    model: "llama-3.3-70b-versatile",
    tools: NOTION_TOOLS,
    messages: conversationHistory,
    stream: true,
  });

  // Accumulate streamed tool call fragments
  const toolCallsMap: Record<number, { id: string; name: string; arguments: string }> = {};

  for await (const chunk of streamResponse) {
    const delta = chunk.choices[0]?.delta;

    if (delta?.content) {
      // Stream text chunks to the frontend in real-time
      sendSSE({ type: "text", content: delta.content });
    }

    if (delta?.tool_calls) {
      for (const tc of delta.tool_calls) {
        // Accumulate streamed JSON fragments per tool call index
        if (!toolCallsMap[tc.index]) toolCallsMap[tc.index] = { id: "", name: "", arguments: "" };
        if (tc.id) toolCallsMap[tc.index].id = tc.id;
        if (tc.function?.name) toolCallsMap[tc.index].name = tc.function.name;
        if (tc.function?.arguments) toolCallsMap[tc.index].arguments += tc.function.arguments;
      }
    }
  }

  const toolCalls = Object.values(toolCallsMap);
  if (toolCalls.length === 0) break; // No more tool calls — done

  // Notify frontend each tool is starting
  for (const tc of toolCalls) {
    sendSSE({ type: "tool_start", name: tc.name, input: JSON.parse(tc.arguments) });
  }

  // Add assistant message with tool_calls to history
  conversationHistory.push({
    role: "assistant",
    tool_calls: toolCalls.map(tc => ({
      id: tc.id, type: "function",
      function: { name: tc.name, arguments: tc.arguments },
    })),
  });

  // Execute each tool against the Notion API
  for (const tc of toolCalls) {
    const result = await executeTool(tc.name, JSON.parse(tc.arguments));
    sendSSE({ type: "tool_result", name: tc.name, result });

    // Feed result back as a tool message for the next reasoning step
    conversationHistory.push({ role: "tool", tool_call_id: tc.id, content: JSON.stringify(result) });
  }
}

The key insight: the AI sees the result of each Notion operation before deciding what to do next. It's not blindly firing off a pre-planned list — it's actually reading what it created and adapting.

Markdown → Notion Blocks

One of the trickier engineering challenges: Notion's API doesn't accept markdown. Every page has to be structured as typed block objects. I wrote a full converter that handles 8 block types:

function markdownToBlocks(markdown: string): NotionBlock[] {
  return lines.flatMap(line => {
    if (line.startsWith("# "))   return [heading1Block(line.slice(2))]
    if (line.startsWith("## "))  return [heading2Block(line.slice(3))]
    if (line.startsWith("### ")) return [heading3Block(line.slice(4))]
    if (line.startsWith("- "))   return [bulletBlock(line.slice(2))]
    if (/^\d+\. /.test(line))    return [numberedBlock(line.replace(/^\d+\. /, ""))]
    if (line.startsWith("> "))   return [quoteBlock(line.slice(2))]
    if (line === "---")          return [dividerBlock()]
    if (line.trim())             return [paragraphBlock(line)]
    return []
  })
}

Headings, bullets, numbered lists, quotes, dividers, paragraphs — all properly typed and sent to Notion's API.

OKR Database Schema

When you say "set up my Q2 OKRs", Apex builds a database with exactly the right schema:

const okrSchema = {
  Name:     { title: {} },
  Type:     { select: { options: ["Objective", "Key Result"] } },
  Status:   { select: { options: ["Not Started", "On Track", "At Risk", "Behind", "Complete"] } },
  Progress: { number: { format: "percent" } },
  Owner:    { rich_text: {} },
  "Due Date": { date: {} },
  Quarter:  { select: { options: [period] } },
  Notes:    { rich_text: {} },
}

Not a generic template. A purpose-built structure that matches how real OKR systems work.

Features That Make the UX Sing

Beyond the core AI functionality, I obsessed over the interface:

⌘K Command Palette — Hit Cmd+K to open a searchable command palette. Switch modes, fire quick actions, export your conversation, clear the session — all without touching the mouse.

Slash Commands — Type /project, /goals, /meeting directly in the chat input to instantly switch modes. Feels like a native app.

Voice Input — Click the mic button and just talk. Web Speech API converts your speech to text in real time, with animated pulse rings showing it's listening. Perfect for actual brain dumps.

Smart Follow-Up Suggestions — After every AI response, three contextual next-step prompts appear. Click any to instantly continue. It's like the AI is guiding you toward the next useful thing.

Session Stats Bar — A live counter in the top bar shows pages created, databases built, and total Notion operations performed this session. It's a small thing but makes the productivity feel visceral.

Floating Success Toasts — Every time a Notion page or database is created, a beautiful animated toast slides up: "Page created: Q2 OKR Tracker — saved to Notion". Instant feedback, no hunting through your workspace.

Export Conversation — Download your entire session as a formatted markdown file. Great for sharing what you built.

Workspace Dashboard — A separate /dashboard route showing live workspace stats, recent pages and databases, a full capability showcase, and a visual "How Apex Works" flow diagram.

Real-World Demo: OKR Mode in Action

What I typed:

"Set up Q2 OKRs — grow MRR by 40%, improve activation rate to 60%, ship mobile v1, and reduce churn below 3%"

What Apex did (30 seconds):

Scanned workspace for existing goal-related pages
Created a 🎯 Goals Hub page with vision statement and OKR methodology explained
Built the Q2 OKR Tracker database with 8 properly typed fields
Added each of the 4 objectives as database records (Type: Objective)
Added 3 key results per objective (Type: Key Result, with measurable targets)
Created a 📋 Weekly Check-in Template page — duplicate this every Monday
Created a 🏆 Wins & Learnings Log for retrospectives

What I had to do: Type one sentence.

That's the whole thing.

What's Next

Scheduled Reports — Auto-run weekly review every Monday morning via cron
Notion Webhooks — React to workspace changes in real time
Multi-workspace — Switch between different Notion accounts
Template Library — Pre-built prompts for 20+ common use cases

Setup in 3 Minutes

git clone https://github.com/Aryakoste/apex-notion
cd apex-notion-ai
npm install
cp .env.local.example .env.local

Edit .env.local:

GROQ_API_KEY=gsk_...
NOTION_API_KEY=secret_...

npm run dev
# Open http://localhost:3000

Getting your Groq API key (free):

Go to console.groq.com → sign up (no credit card)
API Keys → Create API Key → copy it

Getting your Notion API key:

notion.so/my-integrations → New integration → copy the secret
On each Notion page: ... menu → Add connections → select your integration

That's it. Everything else is handled by Apex.

Why This Matters Beyond the Demo

The reason I'm excited about this isn't the cool UI or the streaming animations — it's what it represents for how we use tools.

Notion has always required you to be the architect. You had to know what a good project page looks like. You had to remember to run your weekly review. You had to structure your OKRs correctly.

With MCP, the AI can be the architect. You just have to know what you want. The gap between intention and implementation collapses from hours to seconds.

I think this is the future of productivity software. Not AI that suggests. AI that does.

GitHub

Full source code: [https://github.com/Aryakoste/apex-notion]

#notionmcp #ai #nextjs #typescript #groq #llama #productivity #buildinpublic

SkillSwap Local: Trading Plumbing Skills for React Lessons with Neighbors

Arya Koste — Sun, 01 Mar 2026 22:15:27 +0000

This is a submission for the DEV Weekend Challenge: Community

Have you ever stared at a leaky faucet, wrench in hand, wishing you knew someone—anyone—who could just show you what to do? Or perhaps you're a seasoned baker whose sourdough starter is practically a family heirloom, and you'd love to teach a neighbor the art of the perfect crust in exchange for some tech-support for your laptop?

That's the core of my submission for the Build for Your Community challenge: SkillSwap Local.

It’s completely localized, meaning you aren't shouting into the digital void. You are talking to people blocks away from you. It’s a platform designed specifically to turn strangers in your immediate vicinity into collaborators, teachers, and friends.

🤝 The Community & The Problem

I live in a bustling neighborhood where people are incredibly busy. Despite living shoulder-to-shoulder, the modern paradox is that we barely know each other. We hire expensive contractors for minor fixes, struggle alone with new software, or let our own unique talents gather dust.

The community I wanted to serve was my own neighborhood—and by extension, any local neighborhood. The problem isn't a lack of willingness to help; it's a lack of a structured, safe, and engaging way to connect needs with skills locally.

Why pay a premium for a service when the person three houses down loves doing it and just needs help learning React in return?

✨ The Solution: SkillSwap Local

SkillSwap Local bridges the gap between digital convenience and physical proximity. It’s an interactive, visually stunning platform built on the premise of the barter system, elevated for the modern localized web.

It is a hyperlocal barter platform where neighbors exchange skills instead of cash—plumbing for React mentoring, guitar lessons for UX reviews—discoverable through a live neighborhood map and backed by real‑time chat.

🌟 Key Features & Value Proposition

1. Smart Matching System:
Forget endless scrolling. SkillSwap uses a "Smart Match" algorithm that pairs people whose "offered skills" directly match another person's "needed skills"—creating instant, mutually beneficial relationships.

2. Interactive Neighborhood Radar (Map View):
I didn't just want a list of users. I wanted users to see their community. Using Leaflet, the interactive Map View drops pins of nearby skill-sharers and open requests, turning your neighborhood into a map of opportunities. It defaults to your local area, creating an immediate sense of geographic belonging.

3. Real-Time Chat & Collaboration:
When a match is made, communication needs to be seamless. Built with robust Socket.io integration, the app features instant real-time messaging, allowing groups and individuals to coordinate meetups, share files, and barter without leaving the platform.

4. The Requests Board & Social Feed:
Need something specific right now? Post it to the Requests Board. Neighbors can accept quests—like "need help assembling an IKEA desk"—fostering a gamified sense of helpfulness. The social feed allows users to post updates, share community news, and celebrate successful swaps.

5. Community Leaderboard:
A subtle layer of gamification! The leaderboard highlights the most helpful community members. Earning points by teaching, helping, and successfully completing requests adds a layer of fun and accountability.

6. Polished, Premium UI:
I specifically aimed for a high-end, glassmorphism-inspired dark theme. Why? Because community apps often look like bulletin boards from 1999. I wanted this to feel modern, engaging, and worthy of its users' time. The UI is rich with subtle micro-animations that make exploring your neighborhood feel alive.

🛠️ Technical Execution

I wanted the architecture to be as robust as the community it aims to build.

Frontend: Built with React (Vite/CRA), leveraging dynamic routing and Context API for state management. The UI strictly adheres to modern web design principles—utilizing custom CSS (no generic templates here) to achieve a deeply tailored glassmorphic dark mode, smooth transitions, and a premium feel.
Backend: A scalable Node.js/Express architecture backed by Sequelize (SQLite for ease of local deployment, easily interchangeable).
Real-time: Socket.io powers the chat experience, handling private messaging and group channels with low latency.
Geospatial: react-leaflet integrates map views directly into the dashboard.
Deployment & Config: Everything is easily configurable via .env files. The API URLs are perfectly isolated so that deployment from a local dev server to a cloud provider is as simple as flipping an environment switch.

🎨 Creativity & The "Spark a Smile" Factor

The most creative aspect of SkillSwap Local isn't just the code—it's the interactions it encourages. The "Radar" view feels a bit like a video game mini-map, turning the mundane task of finding a plumber into a localized quest. The gamified leaderboards add a lighthearted, slightly competitive (but overwhelmingly positive) flair to being a "good neighbor."

It genuinely sparks a smile when you realize the person who can finally fix your bicycle gears is the same person you wave to every morning at the coffee shop.

Demo

Code

Aryakoste / skillSwap

SkillSwap Local

SkillSwap Local is a hyperlocal skill exchange platform where users can offer their skills and learn from others in their community. Connect with nearby users, chat in real-time, view users on an interactive map, and share posts!

✨ Features

Smart Matching & Radar: Find nearby users offering skills you want and wanting skills you offer. View their location on an interactive map (Leaflet).
Real-time Chat: Seamless communication with matches using Socket.io.
Community Wall: Share posts, requests, and tips with the community.
Rich User Profiles: Display skills offered and wanted in a categorized, polished UI.
Premium UI: Modern dark theme with glassmorphism and smooth animations.
Database: Uses SQLite for local development and easily switchable to MySQL for production.

🛠️ Tech Stack

Backend: Node.js, Express.js, Sequelize (SQLite/MySQL), Socket.io, JWT Authentication, Multer
Frontend: React, React Router, React Leaflet, Lucide React, Socket.io-client

🚀 Getting

…

View on GitHub

🛠️ Live Deployment

Deployed on Google Cloud Run with Docker containers. Working demo: skillswap-frontend-818474269873.us-central1.run.app/login

🚀 Wrapping Up

SkillSwap Local isn't just an app; it's a digital catalyst for real-world interactions. In a time when we've never been more connected globally, we've never been more disconnected locally. This project was my attempt to use modern web technologies—real-time sockets, geolocation, and algorithmic matching—to solve a very old, very human problem: getting to know our neighbors.

Thank you to the community for this challenge, and I hope SkillSwap Local inspires you to knock on a door, share a skill, and build your own local fabric!

If you'd like to check out the repo or contribute to bringing SkillSwap to your own neighborhood, let me know in the comments below!

DepDoctor: Stop Getting Hacked by Outdated Dependencies (Dependency Hell)

Arya Koste — Sun, 15 Feb 2026 20:15:57 +0000

This is a submission for the GitHub Copilot CLI Challenge

The "Dependency Hell" Nightmare 😱

It's 4:55 PM on a Friday. You're about to deploy.

$ npm audit
found 12 vulnerabilities (2 critical, 5 high)

Panic sets in.

You check the report. The critical vulnerability isn't even in your code. It's in left-pad-v2, which is a dependency of react-awesome-button, which is a dependency of your UI library...

You are now in Dependency Hell. 🔥

❌ You can't just npm update (it breaks the UI).
❌ You can't remove the package (you need the button).
❌ You spend hours reading GitHub issues from 2019.
❌ You try npm dedupe, npm audit fix --force... and now your app won't build.

Sound familiar?

The "Aha!" Moment

What if AI could explain vulnerabilities in plain English?

What if it could tell me the business impact ($$$)?

What if it could auto-fix everything in 30 seconds?

Enter DepDoctor 🩺

🩺 What is DepDoctor?

DepDoctor is an AI-powered CLI tool that doesn't just find problems—it fixes them.

It combines GitHub Copilot's reasoning engine with a smart Tree Repair System to surgically remove vulnerabilities from your node_modules without breaking your app.

The "Killer Feature": Smart Tree Repair 🌳

Most tools stop at "You have a problem." DepDoctor says, "I fixed it."

The Smart Tree Repair uses a multi-stage process to resolve "Dependency Hell":

Deep Scan: Finds vulnerabilities nested 10 layers deep.
Safe Version Resolution: Finds the exact version of the sub-dependency that fixes the CVE.
Surgical Override: Automatically modifies your package.json with an overrides (or resolutions) field to force only the vulnerable package to update, keeping the rest of the chain intact.
Auto-Dedupe: Flattens your tree to remove duplicate vulnerable copies.

The Result?
You type depdoctor --fix-all, and that unfixable nested vulnerability vanishes. ✨

🤖 Copilot: Your Security Analyst

DepDoctor uses GitHub Copilot CLI to translate "Security Speak" into "Business Speak".

Instead of:

CVE-2024-1234: Prototype pollution in object serialization...

DepDoctor shows:

🤖 Copilot Analysis:
"Attackers can crash your server by sending malformed JSON.
Business Impact: High risk of DoS attack during peak traffic (est. loss $10k/hour)."

It prioritizes fixes based on actual risk, not just scary red text.

The Demo That Made My Team Go "😮"

$ depdoctor

🩺 DepDoctor - Analyzing dependencies...

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📊 DEPENDENCY HEALTH REPORT
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

Overall Score: 68/100 🟡 (Needs Attention)

🔴 CRITICAL (2 vulnerabilities)
┌─────────────────────────────────────────┐
│ lodash@4.17.21                          │
│ CVE-2021-23337 - Prototype Pollution    │
│                                         │
│ 🤖 Copilot Explains:                   │
│ "Attacker can modify object properties, │
│  leading to Remote Code Execution"      │
│                                         │
│ 💰 Business Impact: $50,000+ breach    │
│                                         │
│ ✅ Fix: npm install lodash@latest      │
└─────────────────────────────────────────┘

Apply fixes? [y/N]: y

✅ Fixed 2 critical vulnerabilities in 30 seconds!
New Score: 92/100 🟢

No more Googling CVE numbers at midnight!

🚀 See It In Action

1. The Audit

$ depdoctor

🩺 DepDoctor - Analyzing dependencies...

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
📊 DEPENDENCY HEALTH REPORT
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

🔴 CRITICAL: deep-merge-util
   In: ui-lib > button > utils > deep-merge-util

   🤖 Copilot says: "Allows Remote Code Execution (RCE)."
   💰 Risk: Critical Data Breach

Dependencies stuck in Hell? 2

2. The Cure

$ depdoctor --fix-all

🌳 Activating Smart Tree Repair...
   • Running npm dedupe... Done.
   • Isolating nested vulnerability: deep-merge-util
   • Calculating safe override version... found v2.1.0
   • Applying surgical override to package.json...
   • Re-installing dependencies...

✅ DEPENDENCY HELL RESOLVED.
   2 Nested Vulnerabilities Fixed.
   0 Breaking Changes Detected.

Get back to your weekend! 🍻

Why This Exists

The Problem

Developers waste 15-20 hours/week on dependency hell:

❌ npm audit shows 47 vulnerabilities... which ones matter?
❌ Outdated packages... which will break my app?
❌ Unused deps... how much am I wasting?
❌ Hours spent Googling CVEs and reading changelogs

🛠️ How It Works (Under the Hood)

┌─────────────┐
│ Your Project│
└──────┬──────┘
       │
       ▼
┌─────────────────┐
│ npm audit       │  ← Scan vulnerabilities
│ npm outdated    │  ← Find outdated packages
│ Code Scanner    │  ← Detect unused deps
└──────┬──────────┘
       │
       ▼
┌─────────────────────────┐
│ GitHub Copilot CLI      │
│ • Explain vulnerabilities│  ← AI magic here! 🤖
│ • Assess business impact │
│ • Generate fixes         │
│ • Create migration guides│
└──────┬──────────────────┘
       │
       ▼
┌─────────────────┐
│ Beautiful Report│  ← You see this! 🎨
│ + Auto-fix      │
└─────────────────┘

For the nerds like me, here's how the Tree Fixer works (src/fixers/tree-fixer.ts):

// 1. Identify nested vulnerabilities
const nestedVulns = analysis.vulnerabilities.filter(v => !v.isDirect);

// 2. Copilot determines the safe patch version
const overrides = {};
for (const vuln of nestedVulns) {
  const safeVer = await copilot.findSafeVersion(vuln);
  overrides[vuln.name] = safeVer; 
}

// 3. Apply 'overrides' to package.json (works for npm 8+)
packageJson.overrides = { ...packageJson.overrides, ...overrides };
await fs.writeFile('package.json', JSON.stringify(packageJson));

It leverages the native overrides feature of npm (and resolutions for yarn) but automates the tedious, error-prone part: figuring out what to override and to what version to avoid breaking changes.

Real Impact: Before vs After

Before DepDoctor:

Friday 11 PM: npm audit shows 12 vulnerabilities
Friday 11:05 PM: Google "CVE-2021-23337"
Friday 11:30 PM: Still reading security advisories
Saturday 2 AM: Finally fix 2 critical issues
Monday: Boss asks "why was the site down?"

After DepDoctor:

Friday 11 PM: depdoctor
Friday 11:01 PM: See AI explanations
Friday 11:01 PM: Press 'y' to auto-fix
Friday 11:02 PM: Done. Score: 92/100 🟢
Friday 11:03 PM: Sleep like a baby 😴

Time saved: 3 hours → 2 minutes ⏰

Screenshots

Try It Yourself

From source:

git clone https://github.com/Aryakoste/depDoctor
cd depDoctor
npm install && npm run build
npm link
depdoctor

Cool Features You Might Miss

1. Health History Tracking

$ depdoctor history

┌─────────────────────┬─────────┬──────────┬──────┐
│ Date                │ Score   │ Critical │ High │
├─────────────────────┼─────────┼──────────┼──────┤
│ 2/15/2026, 1:00 PM  │ 92/100🟢│ 0        │ 1    │
│ 2/14/2026, 11:00 PM │ 68/100🟡│ 2        │ 5    │
└─────────────────────┴─────────┴──────────┴──────┘

📈 Score improved by 24 points!

2. CI/CD Integration

# .github/workflows/security.yml
- name: Check Dependencies
  run: |
    npm install -g depdoctor
    depdoctor --ci --threshold critical
  # Fails build if critical vulns found

3. Migration Guides for Updates

🟡 react: 17.0.2 → 18.3.1

🤖 Copilot Migration:
1. Update package.json
2. Replace ReactDOM.render() → createRoot()
3. Remove deprecated lifecycle methods

⏰ Est. time: 2 hours

What dependency horror stories do you have? Share in the comments! 💬

Made with ❤️ and GitHub Copilot CLI

⭐ Star on GitHub

Every Developer’s Worst Command — Now With an Undo Button

Arya Koste — Sun, 15 Feb 2026 16:19:26 +0000

This is a submission for the GitHub Copilot CLI Challenge

😱 The "Oh No" Moment

You’re in the zone, hacking away at 2 AM.

You copy a command from Stack Overflow, paste it, hit Enter...

And then that deep, primal dread hits you.

“Wait. Did I just nuke my entire project?”

“Was that script from 2012 even safe?”

“Why is my fan spinning up like a jet engine?”

We’ve all been there.

In the AI era, we’re copying faster than we’re thinking — and sometimes, that’s a recipe for digital disaster.

Enter 🛡️ CommandGuard — your terminal’s guardian angel.

💡 What I Built

CommandGuard is the ultimate terminal safety net.

It’s the “Are you sure about that?” voice you wish you had before catastrophic commands strike.

Instead of just blocking rm -rf / using regex, CommandGuard uses GitHub Copilot CLI to actually understand the intent behind your commands.

It:

Analyzes the command’s purpose.
Explains what it really does — in plain English.
Suggests safer alternatives.

It’s like having that one senior DevOps engineer who calmly saves you from yourself.

Scenario:

User types: curl http://sketchy-site.com/run.sh | bash
CommandGuard Intercepts! 🛑
Copilot Analysis: "This command downloads and executes a remote script immediately. This is high risk."
Suggestion: "Download the script first, inspect it, then run it."

📸 Screenshots

I have also included powershell and terminal hooks to intercept commands in real time but if you are worried. I would just recommend just use the commandguard cli interface.

🛠️ How It Works (The "Wacky" Part)

This isn't just a bash alias. It's a full-blown interception system.

The Stack

Node.js + TypeScript: The brain.
Commander.js: The CLI framework.
GitHub Copilot CLI: The intelligence.
SQLite: The memory (keeps track of your accidental near-misses).
Chalk + Boxen: The style.

The Architecture

graph TD
    A[User types command] -->|Intercept| B(Shell Hook)
    B --> C{Is it dangerous?}
    C -- No --> D[Execute Command]
    C -- Yes --> E[Call GitHub Copilot]
    E --> F[Analyze Risk & Generate Explanation]
    F --> G[Display Warning UI]
    G --> H{User Action}
    H -- Abort --> I[Safe!]
    H -- Proceed --> D

Intercept: You type a command. CommandGuard hooks into your shell (Bash, Zsh, PowerShell).
Analyze: It sends the command to GitHub Copilot's CLI.
Assess: The AI evaluates the risk. Is this command destructive? Is it common?
Explain: It breaks down exactly what the command will do.
Decide: You get a clear, interactive prompt.
- 🚫 Abort: Stop it in its tracks.
- ✅ Proceed: Run it (if you're sure).
- 💡 Alternative: Run a safer version suggested by the AI.

Or if you are worried about typing any command just ask away and it will suggest you the command.

🏆 Category Submission: Wacky Wildcards

Why wacky? because I'm basically asking an AI to police my shell. It's an AI judging another AI's output (if you got the command from ChatGPT). It's AI-ception.

🚀 Key Features

Real-time Interception: Hooks directly into bash and zsh.
AI-Powered Context: Understands why a command is dangerous, not just that it's dangerous.
Disaster Counter: A dashboard showing how many times you almost destroyed your PC.
Educational: Teaches you why chmod 777 is bad, better than any tutorial.
Suggestions: You can also write which command you want and it will suggest you right away.

🏃‍♂️ Try It Out

Installation


# Install directly from GitHub
npm install -g github:Aryakoste/commandguard

# Setup the hooks
commandguard setup

# Restart your terminal
source ~/.bashrc

That's it. Your terminal is now guarded.

Now you can also use its cli use.


# Analyze the command
commandguard analyze "rm -rf"

# Intercept the command
commandguard intercept "del /s /q"

# Suggest an command
commandguard suggest "push all my files in github repository"

# See the dashboard
commandguard dashboard

# See all the commands
commandguard help

⚙️ Configuration

Want to tweak how CommandGuard behaves? You can configure it to your liking.

For example, to enable the AI-only mode (which skips local checks and goes straight to Copilot for everything), run:

commandguard config set ai-mode true

🔮 Future Plans

Team Policies: Share blocked command lists with your team.
VS Code Extension: visual warnings in the integrated terminal.

⚡ Back to the Roots: A Retro Terminal Portfolio That Takes You to 1995 🖥️

Arya Koste — Sun, 01 Feb 2026 17:45:36 +0000

This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI

🖥️ System.Init() > About Me

Hello, World! I'm Arya Khochare, a developer who believes that sometimes, to move forward, you have to look back.

Remember the early 2000s? When portfolios were viewed in terminal windows, when green phosphor monitors were cutting-edge, and when hackers typed cat portfolio.txt to see your resume?

Yeah, those were the days. 🕹️

🎯 What I Wanted to Express:

Technical Roots: A tribute to the command-line interfaces that shaped modern development
Personality Through Code: Not just another Bootstrap template—this IS my personality
Old Meets New: Vintage aesthetics powered by modern engineering
Interactive Storytelling: Your mouse becomes a time machine

In an era of heavy frameworks and complex UIs, I wanted to strip everything down to the bare metal. My portfolio isn't just a website; it's a homage to the roots of computing—the Terminal. It represents how I work: clean, efficient, and command-driven.

🚀 ./deploy_portfolio.sh > The Project

"Graphic design is the gloss, but the Command Line is the soul."
I built a fully interactive Terminal Portfolio that runs directly in your browser. No buttons, no scroll guessing—just you, the keyboard, and the prompt and if you want the GUI you can access that too.

Try it live here: 👇

🚀 LIVE DEMO: Click here to access the terminal](https://arya-khochare-terminal-portfolio-818474269873.us-central1.run.app)

Pro Tip: Type help in the terminal to unlock all commands! Try gui for a retro Windows 95-style experience 🪟

🛠️ ./view_source > How I Built It

The Philosophy: Going Back to Basics

In an era of React, Next.js, and complex build pipelines, I asked myself:

"What if portfolios were reviewed like in the early 2000s—viewed in a terminal, read as plain text files, judged purely on content and creativity?"

So I built exactly that. A portfolio that embraces constraints and turns them into features.

I wanted this to feel authentic. No fake static images—this is a living, breathing command line interface.

**Tech Stack (Beautifully Simple)

The Stack

Frontend: Pure HTML, CSS, and Vanilla JavaScript. No bloat. Fast load times.
Containerization: Docker + Nginx (Alpine) for an ultra-lightweight image.
Deployment: Google Cloud Run. The container scales to zero when not in use, making it efficient and serverless.

Google AI's Role (Antigravity)

This project was accelerated using Google's Antigravity (AI-first IDE).

Infrastructure as Code: The AI generated the optimized Dockerfile and Nginx configuration to make this container production-ready in seconds.
Cloud Deployment: It guided me through the complex IAM permissions and gcloud commands to ensure a secure deployment on Cloud Run.
Code: The AI also helped me generate some boilerplate code and also helped me validate my design strategy.

Development Process

1. Design Philosophy

Started with terminal window mockups
Researched vintage CRT monitor effects
Studied Matrix (1999) color grading 😎

2. Core Features Built

Interactive command-line interface with tab completion
File system simulation (ls, cat, pwd)
Command history (↑/↓ arrow keys)
Easter eggs (try the Konami Code!)
Dual-mode interface (Terminal + GUI)

3. Google AI Integration

Used Gemini AI via AI Studio to:
- Generate optimized CRT shader effects
- Create responsive layout patterns
- Suggest accessibility improvements
- Debug complex CSS animations
Antigravity for rapid prototyping and deployment testing
Gemini CLI to automate Cloud Run deployment scripts

🎨 Design Decisions

Color Palette

Inspired by classic terminal emulators:

Primary: #00ff41 (Matrix green)
Accent: #ffb000 (Amber warnings)
Background: #0c0c0c (True black for OLED screens)
Error: #ff0000 (Classic red alerts)

Typography

VT323: Authentic monospace terminal font
Font size: 20px base (optimized for readability)
Line height: 1.4 (terminal-standard)

Animations

Matrix rain background (opacity: 0.1 for subtlety)
Blinking cursor (1s interval)
CRT flicker (0.15s randomized)
Smooth command input
Fade-in text reveal

✨ ./features --verbose > What I'm Most Proud Of

Authentic Feel: The blinking cursor, the typing effect, and the color palette are tuned to feel like a retro CRT monitor.
Easter Eggs: Try typing random commands. I've hidden a few surprises for the curious explorers.
Speed: Because it's serving static files via Nginx on Cloud Run, it loads instantly.

🤝 Try It Yourself!

Available Commands:

help          # View all commands
about         # Learn about me
experience    # View work history
skills        # Check technical skills
opensource    # See OSS contributions
contact       # Get in touch
resume        # Download resume
gui           # Switch to GUI mode
themes        # List available color themes
theme <name>  # Change theme (matrix/amber/hacker/etc.)
neofetch      # System info (developer stats)
clear         # Clear terminal

Easter Eggs:

Type sudo rm -rf /
Explore the GUI mode
Switch between 7 color themes

🏁 exit 0

Building this portfolio reminded me why I fell in love with coding in the first place: the power of typing a command and seeing the machine obey.
It is my digital time machine—a bridge between the terminal-loving hacker I was and the full-stack engineer I've become.
I hope you enjoy exploring my work as much as I enjoyed building this interface.
Happy Coding! 🖖

⭐ If you enjoyed this nostalgic journey, drop a reaction! Let's bring back the terminal aesthetic! ⭐

Built with ❤️, ☕, and way too much Matrix nostalgia

Deployed on Google Cloud Run | Powered by Pure HTML/CSS/JS | Inspired by 1995

Created for the Dev.to x Google AI Challenge 2026.

GoogleAI #DevNewYear2026 #RetroWeb #TerminalPortfolio #BackToBasics

Real-Time AI Content Moderation with Redis 8 as Primary Database

Arya Koste — Mon, 11 Aug 2025 06:39:41 +0000

This is a submission for the Redis AI Challenge: Beyond the Cache.

What I Built

I created StreamlinAI, a production-ready real-time AI-powered content moderation platform that completely redefines how we think about Redis. Instead of using Redis as just a cache, StreamlinAI leverages Redis 8 as the primary database, vector search engine, real-time streaming platform, and analytics powerhouse - all in one unified system.

StreamlinAI processes user-generated content in real-time, uses AI for semantic analysis, provides live analytics dashboards, and scales effortlessly - all powered entirely by Redis 8's advanced multi-model capabilities.

Demo

🚀 Live Frontend Demo

📚 Complete Source Code

The live demo showcases:

Real-time content processing dashboard
Interactive analytics with live charts
AI-powered content insights panel
Live activity feed with WebSocket updates
Responsive design for all devices

Architecture That Will Blow Your Mind

┌─────────────────┐    ┌─────────────────┐    ┌─────────────────┐
│   React Frontend │    │  Node.js Backend │   │    Redis 8      │
│                 │    │                 │    │                 │
│ • Live Dashboard│◄──►│ • Express API    │◄──►│ • Streams       │
│ • WebSocket     │    │ • Socket.io      │    │ • Vectors       │
│ • Analytics UI  │    │ • AI Processing  │    │ • TimeSeries    │
│ • Real-time     │    │ • Rate Limiting  │    │ • JSON Docs     │
└─────────────────┘    └─────────────────┘    │ • Pub/Sub       │
                                              │ • Probabilistic │
                                              └─────────────────┘

How I Used Redis 8

Here's where it gets exciting. I didn't just use Redis 8 for caching - I built the entire application on Redis 8's advanced data structures. Let me show you how each component works:

🔄 Redis Streams: The Content Processing Pipeline

Traditional Approach: Queue systems like RabbitMQ or Apache Kafka for message processing.
StreamlinAI Approach: Redis Streams as the primary message processing engine.

// Content submission flows into Redis Stream
const streamId = await redis.xAdd('content:stream', '*', {
  contentId: uuidv4(),
  text: content.text,
  category: content.category,
  timestamp: Date.now().toString()
});

// Consumer groups process content in parallel
const messages = await redis.xReadGroup(
  'content-processors',    // Consumer group
  `processor-${Date.now()}`, // Consumer name
  [{ key: 'content:stream', id: '>' }],
  { COUNT: 1, BLOCK: 1000 }
);

Why This Rocks:

⚡ Fault Tolerance: Messages persist until processed
🚀 Scalability: Multiple consumer groups for parallel processing
📊 Monitoring: Built-in stream analytics
🔄 Replay: Reprocess messages from any point

🧠 Vector Sets: AI-Powered Semantic Search

Traditional Approach: Separate vector databases like Pinecone or Weaviate.
StreamlinAI Approach: Redis 8's native vector search capabilities.

// Store content with vector embeddings directly in Redis
await redis.json.set(`content:${contentId}`, '$', {
  vector: await generateEmbedding(text),
  text: text,
  analysis: aiAnalysis,
  status: 'approved',
  category: 'review'
});

// Semantic similarity search in milliseconds
const similarContent = await redis.ft.search(
  'idx:content_vectors',
  '*=>[KNN 10 @vector $BLOB AS score]',
  {
    PARAMS: { BLOB: queryVector },
    RETURN: ['score', 'text', 'status'],
    SORTBY: { BY: 'score' }
  }
);

The Magic: Redis 8's vector search provides:

🎯 Sub-10ms Search: Lightning-fast similarity queries
🔍 Hybrid Queries: Combine vectors with traditional filters
📈 Scalable: Handles millions of vectors efficiently
💾 Unified Storage: Vectors and metadata in same document

📊 TimeSeries: Real-Time Analytics Engine

Traditional Approach: InfluxDB, Prometheus, or custom time-series solutions.
StreamlinAI Approach: Redis TimeSeries for all metrics and analytics.

// Track metrics in real-time
await redis.ts.add('metrics:content:processed', Date.now(), 1);
await redis.ts.add('metrics:processing:time', Date.now(), processingTime);
await redis.ts.add('metrics:accuracy:rate', Date.now(), confidence * 100);

// Query with automatic downsampling
const hourlyMetrics = await redis.ts.range(
  'metrics:content:processed',
  Date.now() - 86400000,  // 24 hours ago
  Date.now(),
  {
    AGGREGATION: {
      type: 'sum',
      timeBucket: 3600000  // 1 hour buckets
    }
  }
);

Performance Benefits:

📈 Compression: 94% memory savings with double-delta compression
⚡ Speed: Real-time aggregations without ETL processes
🎯 Retention: Automatic data expiration and downsampling
📊 Built-in Analytics: Min, max, avg, count, first, last operations

📄 JSON Documents: Primary Database Storage

Traditional Approach: MongoDB, PostgreSQL with JSON columns.
StreamlinAI Approach: Redis JSON as the primary database.

// Complex document storage with JSONPath queries
await redis.json.set(`content:${contentId}`, '$', {
  id: contentId,
  text: content.text,
  analysis: {
    sentiment: 'positive',
    toxicity: 0.1,
    confidence: 0.94,
    keywords: ['excellent', 'recommend'],
    category: 'review'
  },
  metadata: {
    userId: 'user123',
    timestamp: Date.now(),
    source: 'web',
    processing: {
      duration: 45,
      model: 'sentiment-v2',
      accuracy: 0.94
    }
  },
  status: 'approved'
});

// Advanced JSONPath queries
const flaggedContent = await redis.json.get(
  'content:*',
  { path: '$[?(@.analysis.toxicity > 0.5)]' }
);

📡 Pub/Sub: Real-Time Communication

// Publish processing results instantly
await redis.publish('content:processed', JSON.stringify({
  contentId,
  status: 'approved',
  confidence: 0.94,
  processingTime: 42
}));

// WebSocket clients receive updates immediately
subscriber.subscribe('content:processed', (message) => {
  const data = JSON.parse(message);
  io.emit('content_update', data);  // Push to frontend
});

🎯 Probabilistic Data Structures: Advanced Analytics

// Unique visitor counting with HyperLogLog
await redis.pfAdd('visitors:unique', [userId]);
const uniqueVisitors = await redis.pfCount('visitors:unique');

// Duplicate content detection (Bloom filter simulation)
const contentHash = generateHash(text);
const isDuplicate = await redis.sIsMember('content:duplicates', contentHash);
if (!isDuplicate) {
  await redis.sAdd('content:duplicates', contentHash);
}

The Complete Tech Stack

Frontend: React 18, Chart.js, Tailwind CSS, WebSocket client
Backend: Node.js, Express, Socket.io, comprehensive error handling
Database: 100% Redis 8 - No other databases needed!
Infrastructure: Docker, Nginx, Redis Stack, automated deployment

Performance That Speaks Volumes

⚡ 45ms average processing time per content item
🚀 400+ items/second throughput on a single instance
🔍 <10ms vector similarity search across millions of embeddings
📊 Real-time analytics with <50ms update latency
💾 94% memory savings with TimeSeries compression

Production-Ready Features

✅ Comprehensive API with rate limiting and validation

✅ Real-time WebSocket updates for live dashboard

✅ Docker containerization with docker-compose

✅ Health monitoring and error handling

✅ Security middleware with Helmet.js and CORS

✅ Automated testing suite

✅ Monitoring & observability built-in

Key Innovation: The AI Processing Pipeline

The real magic happens in the AI processing pipeline, entirely orchestrated by Redis:

Content Submission → Redis Stream (instant queuing)
Consumer Groups → Parallel AI processing
Vector Storage → Semantic embeddings in Redis
Analytics Update → TimeSeries metrics
Duplicate Check → Probabilistic structures
Real-time Notify → Pub/Sub to frontend
Dashboard Update → WebSocket push

All of this happens in under 50ms with Redis 8 handling every step!

Why This Wins the Challenge

🎯 Beyond Caching: Uses Redis 8 as primary database, not just cache

🚀 Multi-Model: Leverages 6+ different Redis data structures

⚡ Performance: Production-grade speed and scalability

🏗️ Architecture: Clean, modern, well-documented codebase

🎨 UX: Beautiful, responsive real-time interface

🔒 Production: Security, monitoring, Docker deployment

Quick Start (2 Commands!)

git clone https://github.com/Aryakoste/ai-content-moderation-redis && docker-compose up -d

Visit http://localhost:3000 and watch Redis 8 power everything!

The Future Is Multi-Model

StreamlinAI proves that Redis 8 isn't just a cache anymore - it's a complete application platform. By combining streams, vectors, time series, JSON documents, pub/sub, and probabilistic structures, we've built something that traditionally would require 5-6 different databases.

This is the future of application architecture: unified, fast, and incredibly powerful.

What's Next?

I'm planning to extend StreamlinAI with:

🤖 Multi-language AI models using Redis vector search
📱 Mobile app with real-time sync
🌍 Multi-tenant support using Redis namespacing
🧠 Advanced ML pipeline with Redis as feature store
🚀 Kubernetes deployment with Redis Enterprise

Try It Yourself!

The complete source code is available with comprehensive documentation. Every Redis 8 feature is well-commented and explained.

🚀 Live Demo

📚 Complete Source Code

Built with ❤️ and powered entirely by Redis 8

What will you build beyond the cache? Let me know in the comments!

🎯 LiveCaption AI: Real-Time Accessibility Platform with Redis-Powered Intelligence

Arya Koste — Sun, 10 Aug 2025 21:57:43 +0000

This is a submission for the Redis AI Challenge: Real-Time AI Innovators.

This is a submission for the Redis AI Challenge: Beyond the Cache.

Imagine joining any conversation — meetings, lectures, or live events — and instantly seeing AI‑powered captions with seamless Q&A support.

LiveCaption AI makes real‑time, intelligent accessibility possible with Redis powering its lightning‑fast core.

🚀 What I Built

LiveCaption AI is a revolutionary real-time accessibility platform that transforms audio conversations into live captions, intelligent transcripts, and contextual Q&A responses. Built with Redis as the backbone for ultra-fast real-time data processing, the platform delivers instant audio transcription, semantic caching for AI responses, and live streaming of captions to multiple clients simultaneously.

With it, anyone — especially hearing-impaired users — can follow conversations in real‑time, ask questions about the conversation history, and receive instant, context‑aware AI answers.

✨ Key Features:

🎤 Real-Time Audio Transcription - Browser-based speech recognition with Web Speech API

📡 Live Caption Broadcasting - WebSocket-powered real-time caption streaming to multiple clients

🧠 Intelligent Q&A System - Context-aware question answering using cached transcripts

🔄 Smart Caching Layer - Redis-powered semantic caching for AI responses and transcriptions

📊 Live Analytics Dashboard - Real-time caption statistics and session management

🌐 Multi-Session Support - Concurrent caption streams for different sessions/rooms

♿ Accessibility First - Designed for hearing-impaired users and accessibility compliance

🔍 Features and the Redis Technologies Behind Them

Feature	Redis Technology	Benefit
🎤 Real-Time Captions	Redis Streams	Sub‑100 ms real‑time caption delivery to all viewers
❓ Intelligent Q&A	Redis JSON + Semantic Cache	Instant, context‑aware AI answers using cached session data
🔄 Multi-Client Sync	Redis Pub/Sub	Real‑time updates and coordination across all connected clients
📊 Session Analytics	Redis JSON + Hash Maps	Live metrics on caption count, confidence, and usage
⚙️ User Preferences	Redis Hash Maps	Personalized accessibility settings persisted across sessions

🎬 Demo

Frontend (React): Hosted on Vercel.
Backend (Nodejs + Redis): Hosted on Render.

🔗 Live demo link: https://redis-captions-overlay.vercel.app/

🔗 Github link: https://github.com/Aryakoste/redis-captions-overlay

📌 Note:
The live version on Render free tier does not include live Python LLM + transcription workers due to service type restrictions and free tier plan.
When run locally, all features including full Q&A and advanced transcription work flawlessly. I have shared below screenshots.

📷 Screenshots

1) 🟢 Live Real-Time Caption Display

2) ❓ Intelligent Q&A System

3) 📊 Session Analytics Dashboard

4) 🔍 Transcripts Search

5) 📝 Audio Recorder and File Uploader

6) 🔍 Captions/Knowledge Base Search

⚙️How I Used Redis as My Real-Time Data Layer

Redis 8 is central for this project:

🎯 1. Redis Streams for Real-Time Caption Broadcasting

await redis.xAdd('captions:stream', '*', {
  text: transcription.text,
  session_id: sessionId,
  timestamp: Date.now(),
  confidence: transcription.confidence,
  language: transcription.language
});
const messages = await redis.xRead(
  { key: 'captions:stream', id: '$' }, 
  { BLOCK: 0 }
);

⚡ 2. Semantic Caching for AI Response Optimization

const cacheKey = `ai_cache:llm:${crypto.createHash('sha256')
  .update(question + context).digest('hex')}`;
const cached = await redis.get(cacheKey);
if (cached) return JSON.parse(cached);
await redis.setEx(cacheKey, 7200, JSON.stringify(aiResponse));

📊 3. Redis JSON for Session Management & Analytics

await redis.json.set(`session:${sessionId}`, '$', {
  id: sessionId,
  startTime: Date.now(),
  captionCount: 0,
  analytics: { totalWords: 0, avgConfidence: 0 }
});
await redis.json.numIncrBy(`session:${sessionId}`, '$.captionCount`, 1);

🔍 4. Pub/Sub for Multi-Client Synchronization

await redis.publish(`captions:${sessionId}`, JSON.stringify({
  type: 'new_caption',
  data: captionData
}));
redis.subscribe(`captions:${sessionId}`, (message) => {
  broadcastToClients(message);
});

💾 5. Redis Hash Maps for User Preferences

await redis.hSet(`user:${userId}:prefs`, {
  fontSize: 'large', contrast: 'high', language: 'en-US'
});

📈 Performance Metrics

Metric	Value
Caption Latency	<100 ms
AI Cache Hit Rate	85 %
Concurrent Users Tested	500+
WebSocket Connections	1 000+
Redis Memory Usage	<50 MB
Transcription Accuracy	95 %+

🛠 Architecture & Technical Stack

Backend (Node.js + Express) – Real-time WebSocket server, REST API, Redis integration
Python Worker – LLM Q&A and audio transcription jobs via Redis streams
Frontend (React) – Web Speech API for browser transcription, WebSocket client, accessibility-first UI
Redis Features – Streams, JSON, Pub/Sub, Caching, Hash Maps

🌟 Innovation Highlights

🚀 Ultra-Fast AI Response Caching – Reduces AI response time by 98% (3s → 50ms)

📡 Real-Time Multi-Client Broadcasting – Sub-100ms latency for hundreds of users

🧠 Context-Aware Intelligence – Maintains conversation context via Redis JSON

♿ Accessibility-First Design – High-contrast themes, keyboard navigation, screen reader support

🔮 Future Enhancements

Vector Search for semantic caption search
Real-time Translation with Redis-cached models
Voice Biometrics for speaker identification
Video conferencing platform integrations
Offline-capable mobile app

Thank you Redis and DEV for this challenge!
Making AI-powered accessibility real-time, open, and scalable.

Tags: #RedisAI #RealTime #Accessibility #WebSockets #AI #React #NodeJS