Hi, I'm Kanai 🌊
FRONT-END
WEB DEVELOPER.
Front-end developer building full-stack products. I ship fast, accessible web apps end to end, from pixel-perfect React interfaces to Supabase-backed APIs, payments, and AI features.
Reach outAbout
Hello there! I'm Kanai, a front-end / full-stack JavaScript developer based near San Francisco. I like building the whole product: designing the interface, wiring up the data layer, and shipping the parts users never see, like auth, payments, and APIs.
People who know me say I'm obsessed, and that's fair. I'm driven, I sweat the details, and I'm always learning the next thing. Most days start with a Starbucks coffee and end with something new running on the web.
Outside of code, you'll find me gaming, watching anime, and boxing.
Technologies
- JavaScript (ES6+)
- TypeScript
- React
- Node.js
- HTML & CSS
- Supabase / PostgreSQL
- Stripe
- REST & AI APIs
- Next.js
- TailwindCSS
Featured project
MealPreppi is a production full-stack SaaS for collaborative household meal planning. It's live on the web at mealpreppi.com, with a native iOS/Android build currently in review to be published on the App Store and Google Play. I built it end to end on React + TypeScript and Supabase, with PostgreSQL, row-level security across 30+ tables, and multiplexed Realtime sync. It ships AI meal planning and fridge-photo ingredient recognition powered by Claude, Stripe and RevenueCat subscription billing, recipe import with one-tap grocery cart export, role-based households (admin / planner / viewer), and 14 serverless edge functions handling AI, payments, push, and GDPR export. The whole thing runs on Vercel with a Capacitor 7 native shell.
Tech stack
- React
- TypeScript
- Supabase
- PostgreSQL
- TanStack Query
- Vite
- Claude AI
- Stripe
- RevenueCat
- Capacitor
- Vercel
- Edge Functions
Project type
Full-Stack SaaS · Web (live) + Native Mobile (in App Store review)
Timeline
May 2026 – present
Projects
A mix of production client work and experiments that sharpen the fundamentals: public-sector sites serving thousands of monthly visitors, API-driven React apps, and canvas/animation builds in vanilla JavaScript. Each one balances performance, accessibility, and clean, responsive design.
Alameda County District Attorney's Office
Alameda County District Attorney's Office
Lead developer for the District Attorney's Office, shipping responsive, WCAG-compliant sites for a high-stakes public-sector audience.
I owned the full development lifecycle: technical planning, stakeholder coordination, and delivery against strict deadlines. Built on WordPress and extended well past the visual builders with custom HTML, CSS, JavaScript, PHP, and AJAX-driven async data flows, every page tuned for speed, accessibility, and mobile.
WebsiteAlameda County Family Justice Center
Alameda County Family Justice Center
Redesigned the Family Justice Center site, improving accessibility and UX for 15,000+ monthly visitors seeking critical victim support services.
Built with React, Divi, and custom PHP for a fast, accessible, and responsive experience. Dynamic front-end components sit on top of scalable back-end logic tailored for public service delivery, giving residents reliable access to legal resources and victim support.
WebsiteAnime Directory Site
Anime Directory Site
An anime search app that pulls live API data to surface trailers, character info, and show details on demand.
A responsive React app driven by real-time API calls, rendering trailers, character images, and metadata with custom search and filtering. A focused demonstration of building interactive, data-driven UIs against a third-party API.
WebsiteYoutube Clone
Youtube Clone
A fully responsive YouTube clone focused on pixel-accurate layout, UI design, and working video playback.
Recreates the platform's core layout and interactions, including a functional UI with video playback and responsive, mobile-friendly design. A good exercise in matching a complex production layout down to the details.
Demo coming soonNinja Sprite Animation
Ninja Sprite Animation
An interactive sprite animation tool that plays ninja actions from multiple sprite sheets via a user-controlled menu.
Renders distinct animated actions from layered sprite sheets, switchable through a custom dropdown. Built in vanilla JavaScript to exercise canvas rendering, frame timing, and interactive UI control with no framework.
WebsiteParallax Moving Background Compound Animation
Parallax Moving Background Compound Animation
A parallax background animation that layers and moves elements to produce a dynamic sense of depth.
Simulates depth by scrolling layered background elements at varying speeds in response to user input. It's pure HTML, CSS, and JavaScript, a study in animation timing, layering, and smooth visual transitions.
WebsiteRPG Game
RPG Game
A text-based RPG with inventory management, combat mechanics, and a final-boss progression system.
Features a shop and gold economy, health management, and combat against escalating enemies leading to a final boss. Built in JavaScript to model game logic, branching conditions, and interactive decision-based systems.
WebsiteLet's build something
I'm open to full-stack and front-end roles and freelance work. Have a project, a role, or just a question? Drop me a line and I'll get back to you quickly.
Reach out