opsNest

Inspiration

I kept watching AI crank out piles of code while teams still struggled to turn it into reliable software. opsNest exists to bridge that gap: a cockpit for vibe coders that organizes AI output, makes the SDLC visible, and keeps quality high. I’m building it as a side project while delivering for clients and family systems, always thinking about how to automate the repetitive parts so we can summon with AI and ship with opsNest.

What it does

We designed a React + Vite + TypeScript frontend with Tailwind/Framer Motion for a fast, animated UX and ReactFlow/three.js for visual pipelines. Supabase backs projects, environments, pipelines, tests, tech stack entries, and notifications. GitHub OAuth pulls repos; CodeRabbit and Gemini integrations let users review and sanity-check changes. The app centers on a visual SDLC (Plan → Code → Test → Deploy) plus scripts and indexing to keep AI-generated code contextualized.

How we built it

React 18 + Vite + TypeScript; Tailwind/Framer Motion + ReactFlow/three.js for visuals; Supabase for data/auth; GitHub OAuth, CodeRabbit, Gemini integrations (proxies for CORS); Vitest + PWA-ready build.

Challenges we ran into

• Harmonizing multiple providers’ auth patterns (GitHub OAuth, AI APIs).
• Keeping UX smooth while loading pipeline/test data in real time.
• Balancing flashy 3D/animation with performance budgets.
• Handling CORS and date-format quirks across external APIs.

Accomplishments that we're proud of

visual SDLC view (Plan→Code→Test→Deploy), smooth repo→AI review flow, polished/perf UI, sane defaults for quick setup, resilient API handling.

What we learned

Clear SDLC visuals reduce friction for both creators and maintainers. Lightweight proxies unblock OAuth/AI calls during local dev (CORS matters). Strict date handling and retries (e.g., CodeRabbit) prevent flaky integrations. Good defaults (fallback Supabase keys/URLs) keep demos from blocking users.

What's next for opsNest

Slack/webhook alerts, Anthropic client + unified AI settings, deeper test/coverage surfacing, smarter repo indexing/search, tighter prod security (secrets, server-side tokens, RBAC).

Built With

• coderabbit-api
• framer-motion
• gemini-api-(anthropic-mentioned-in-ux)
• gsap
• i18next
• languages/frameworks:-react-18
• local-proxy-servers-for-github/coderabbit-tooling:-vitest
• lucide
• ogl-state/data:-supabase-(db/auth)
• postcss/autoprefixer
• react-hook-form
• reactflow
• sonner
• three.js/@react-three/fiber/@react-three/drei
• typescript
• vite-plugin-pwa
• vite-ui/ux:-tailwind-css
• zod-integrations:-github-oauth