DavidHDev

React Bits: Animated React components for websites people remember (51k stars) What it does All text below is quoted directly from the project README. >The largest open-source library of animated, interactive, and customizable React & Next.js components for building standout web products and experiences. Built for humans and AI agents. Creative tools: - 215+ free animated components and backgrounds for React. Tune them yourself, or hand them to your agent. - Every component has a live demo with controls, and comes in four flavors: JavaScript or TypeScript, styled with CSS or Tailwind. - React Bits works with the shadcn MCP server, so Claude Code, Cursor, Codex, VS Code and Antigravity can find and add components for you. - Background Studio: browse every animated background, start from a preset and tune it live. Export the code, a high-resolution image or a looping MP4 or WebM video. - Center Stage: turn a screenshot or screen recording into a polished product shot on lifelike phones, laptops and browsers, with 3D tilt, depth of field, shadows and type. - Shape Magic: design a logo mark from shapes, patterns, text or your own SVG, then give it a 3D material like chrome, glass or neon. Export SVG, PNG, favicons, video or React. - Texture Lab: run photos, videos or your camera through 160 one-click styles and 75+ stackable effects, from ASCII and halftone to glass and glitch. - Sound Lab: audition 200 interface and video sounds, tune them and add effects like reverb, echo and filter, then install one with a single command or download WAV, MP3 or OGG. >npx shadcn@latest add @react-bits/SplitText-TS-TW Repository DavidHDev/react-bits Repository stats |Metric|Value| |:-|:-| |Stars|50,568| |Forks|2.5k| |Last release|None| |Languages|JavaScript 57.2%, TypeScript 38.1%, CSS 4.6%| |Contributors|136| |AI contributor accounts (Claude / Codex / Cursor / Copilot)|@Copilot (16 commits), @claude (3 commits)| |AI co-authored commits|Claude: 3, Copilot: 3| Main contributor |Field|Value| |:-|:-| |Name|David| |GitHub|@DavidHDev| |Commits to this repo|832 (top contributor)| |Bio|Caught in the web.| |Company / Location|Cluj-Napoca| |Followers|3.3k| ────────────────────────────── 📌 How many great GitHub repos have you discovered and completely forgotten about? Don't let another useful tool disappear into your Reddit feed. Get the community's best repos, organized by category, plus key takeaways from real developer discussions, delivered to your inbox twice a week. 📬 Never lose track of great repos again. Subscribe free.

Ofrenda Viva AI: The 100% Local Día de los Muertos Altar & Ghost-in-the-Machine Séance This is a submission for the Hacktoberfest Open-Source AI Challenge Week 4: Ghost in the Machine --- 🕯️ What I Built The Thin Veil Between Past and Present October 31 marks the arrival of Halloween, which flows seamlessly into Día de los Muertos on November 1 and 2—a sacred stretch on the calendar when ancient folklore tells us the barrier between the living world and the spirit realm grows thin. In Mexican tradition, no one is truly gone as long as their story is remembered ("No hay muerte verdadera mientras haya memoria"). Every autumn, families build ofrendas—tiered altars glowing with candlelight, fragrant copal incense, and golden marigold petals (cempasúchil)—to welcome the souls of ancestors back for one night of feasting, music, and love. At the exact same time, inside our modern computers, a parallel haunting takes place: the foundational algorithms, compiler paradigms, and mathematical discoveries of computing legends—Ada Lovelace, Alan Turing, Grace Hopper, and even ancient languages like COBOL—continue to execute in our silicon every millisecond. They are the literal "Ghost in the Machine". Introducing Ofrenda Viva AI Ofrenda Viva AI is an on-device, 100% local Día de los Muertos remembrance sanctuary and haunted terminal séance powered by Google Gemma 2 (2B) and styled with React Bits by DavidHDev. It offers two interconnected realities: 1. 🌼 The Sacred Día de los Muertos Altar (Three Tiers of Memory): - Tier 1 (El Cielo / The Heavens): Copal incense smoke, pure virgin beeswax candles, and celestial guidance. - Tier 2 (La Tierra / Earth & Ancestors): Framed portraits of departed loved ones, family elders, and computing pioneers. Clicking any portrait reveals their life story, authentic Mexican Calaverita Literaria poem, and consecrated offerings. - Tier 3 (El Inframundo / The Offerings): Traditional Pan de Muerto dusted with orange blossom sugar, clay cups of frothed Mexican chocolate (champurrado), sugar skulls (calaveras), purifying salt, and water to quench weary souls after the long journey from Mictlán. 2. 👻 Ghost in the Machine Mode (Retro CRT Terminal Séance): - A single click transmutes the golden candlelit sanctuary into an eerie 1980s green phosphor CRT monitor with scanlines, cathode hum, and chromatic aberration. - Interactive Offline Séance: Hold real-time terminal dialogues with the ghosts of computing pioneers (Ada Lovelace, Alan Turing, Grace Hopper, The Ghost of COBOL, or your own custom family ancestors) decrypted live through the screen. --- 🌿 Demo - 🌐 Live Web Application: ath1614.github.io - 📦 GitHub Repository: ath1614/OfrendaViva-AI !Ofrenda Viva AI Live Demo Animation Visual Walkthrough | 01. The Sacred 3-Tier Altar | 02. Calaverita Literaria Poem | | :---: | :---: | | !Altar Main | !Calaverita | | 03. Gemma 2 Remembrance Synthesis | 04. Ghost in the Machine CRT Terminal | | !Remembrance Modal | !CRT Terminal | | 05. Spirit Dialogue with Ada Lovelace | 06. Séance with The Ghost of COBOL | | !Ada Dialogue | !COBOL Spirit | --- 💻 Code {% github ath1614/OfrendaViva-AI %} The entire project is open-source under the MIT License. # Clone and run locally in under 60 seconds: git clone https://github.com/ath1614/OfrendaViva-AI.git cd OfrendaViva-AI npm install npm run dev --- 🛠️ How I Built It Ofrenda Viva AI was designed with four foundational pillars: On-Device Open-Weights Intelligence, React Bits UI Animation Craft, Procedural Web Audio, and Authentic Cultural Reverence. 1. Open-Weight Model Core: Google Gemma 2 (2B) To ensure that intimate family grief, ancestral letters, and sacred memories never leave your machine, the application is driven by Google Gemma 2 (2B Instruction-Tuned, 4-bit Quantized) running completely on-device. We structure each remembrance and séance exchange using Gemma's turn tokens: <start_of_turn>user You are the spirit of Ada Lovelace communicating through an offline terminal séance. Subject: Did you believe machines could possess a soul? <start_of_turn>model <ctrl94>thought 1. Access historical writings: 1843 translation of Menabrea's sketch. 2. Reflect on the distinction between calculating and originating. 3. Frame response with poetic science and warmth for the modern programmer. <ctrl95> The machine is an instrument of human thought, not its originator. Yet when you pour your devotion, late-night toil, and love into code, a reflection of the soul remains trapped between the silicon relays. That ghost is your own humanity. 2. React Bits UI Components (DavidHDev) To capture both the sacred warmth of candlelight and the eerie phosphor flicker of a retro terminal, we integrated components adapted from DavidHDev's react-bits: - DecryptedText: Renders spirit communications with real-time character scrambling and sequential glyph reveals. - SpotlightCard: Generates a dynamic radial candlelight glow tracking the cursor across the dark altar cards. - TiltedCard: Provides 3D parallax tilting photo frames with realistic perspective rotation and specular glare. - Particles: Canvas physics engine powering drifting golden cempasúchil marigold petals in Altar mode and floating green phosphor embers in Ghost mode. - GlitchText: Emulates CRT scanline chromatic aberration and cathode ray jitter when terminal spirits manifest. - StarBorder: Animated celestial light border highlighting the heavenly tier of the altar. 3. Procedural Web Audio Engine (0 External MP3s) Most web experiences load heavy external audio recordings. Ofrenda Viva generates its entire soundscape live in the browser using the Web Audio API: - Día de los Muertos: Karplus-Strong string synthesis approximating Spanish nylon guitar plucks, randomized noise buffers simulating candle wax crackles, and resonant multi-frequency bronze sanctuary bell tolls. - Ghost in the Machine: 50Hz/60Hz CRT transformer sawtooth hum, bandpass-filtered radio static whispering, square-wave mechanical keystroke pings, and spectral reverse-reverb sine swells. - Total External Audio Dependencies: 0 bytes. --- 🛡️ Why Does Open Innovation Matter? Why build this with open-weight models rather than an API key for OpenAI, Anthropic, or Gemini Cloud? Because for this project, closed APIs are an ethical failure: 1. The Inviolable Privacy of Grief: Our ancestors' photographs, family oral histories, secret grandmother recipes, and private grief are sacred. Uploading your late grandmother's letters to a commercial server where they can be logged, audited, or retained in closed corporate training corpuses is unacceptable. With open-weights Gemma 2, your family memories stay in your laptop's memory and vanish into air when you close the tab. 2. Works With the Lights & Internet Off: On Día de los Muertos, tradition calls for turning off the electric lights and sitting in the dark by candlelight. Because Ofrenda Viva runs on-device, you can disconnect your WiFi, sit in the candlelit dark, and commune with memory without an internet connection. 3. Eternal Preservation vs Corporate Deprecation: Closed startups shut down, sunset APIs, or put features behind subscription paywalls. An open-source model running on your local machine belongs to you forever. The ofrenda will still open fifty years from now. --- 🤖 My Agent Session Judges and builders can inspect the complete autonomous development, code generation, and test execution through DevRelay: {% agent_session 1311 %} 🔗 DevRelay Session URL: View Transcript on DEV --- 💀 The Spirit of It During testing, I added my great-aunt Tía Carmen, who passed away two years ago. I entered her favorite sweet ("Atole de guayaba y buñuelos crujientes") and recalled how she would teach us to braid orange and purple papel picado on cold autumn afternoons. Local Gemma 2 synthesized this Calaverita Literaria: > La Catrina vino al pueblo > buscando a Carmen con fervor, > pero encontró en esta ofrenda > un recuerdo lleno de amor. > "No me la llevo a la fosa", > dijo la Muerte al mirar, > "que quien vive en la memoria > nunca dejará de brillar." When the golden marigold petals drifted across the screen and the gentle nylon guitar chord sounded through the speakers, it gave me goosebumps. For a few quiet seconds in the dark, the distance between past and present truly felt as thin as a single sheet of paper. --- 🏆 Prize Categories - Primary Challenge: Hacktoberfest Open-Source AI Challenge: Week 4 (Ghost in the Machine). - Featured Partner Track: Best Use of Gemma (Leveraging Google's open-weights Gemma 2 2B architecture for on-device Calaverita synthesis, offering recommendations, and offline historical spirit séances). --- Dedicated to our ancestors and the immortal pioneers of computing whose ghosts still whisper through our machines. Happy Halloween & Feliz Día de los Muertos! 🕯️🌼💀

前端做落地页，最费时的就是动画细节。 React Bits：110+个现成组件，文字动画、背景、UI元素都有，还在每周更新。 直接抄：挑一个组件，把代码贴进工程就能跑。 仓库地址放评论了——你打算先用在哪个页面？ 仓库：DavidHDev/react-bits t.co

개발자들이 선택한 깃허브 디자인·모션 도구 TOP 14 웹사이트 UI 디자인부터 인터랙션, 모션그래픽, 3D 애니메이션까지. 깃허브에서 인기 있고 실제로 쓸 만한 AI 디자인 스킬과 도구 14개를 네 챕터로 정리했습니다. 필요한 챕터만 골라 보세요. 00:00 인트로 00:19 CH1 AI 디자인 스킬 00:19 프론트엔드 디자인 (Anthropic) 00:45 UI UX 프로 맥스 01:11 테이스트 스킬 01:33 홀마크 01:57 임페커블 02:28 CH2 작업공간 02:31 구글 스티치 02:55 오픈디자인 03:19 CH3 웹 인터랙션 03:22 에밀 코왈스키 애니메이션 스킬 03:49 리액트 비츠 04:09 키프레임 갤러리 04:23 CH4 모션그래픽 04:27 리모션 04:44 하이퍼프레임즈 05:06 클로드 모션 05:32 어썸 오푸스 5.5 비디오스 05:51 마무리 ▶ 영상 속 도구 링크 [CH1 AI 디자인 스킬] 프론트엔드 디자인: github.com/anthropics/skills/tree/main/skills/fro… UI UX 프로 맥스: nextlevelbuilder/ui-ux-pro-max-skill 테이스트 스킬: Leonxlnx/taste-skill 홀마크: Nutlope/hallmark 임페커블: pbakaus/impeccable (impeccable.style) [CH2 작업공간] 구글 스티치: stitch.withgoogle.com 오픈디자인: nexu-io/open-design [CH3 웹 인터랙션] 에밀 코왈스키 스킬: emilkowalski/skills 리액트 비츠: reactbits.dev (DavidHDev/react-bits) 키프레임 갤러리: keyframe.gallery [CH4 모션그래픽] 리모션: remotion.dev (remotion-dev/remotion) 하이퍼프레임즈: heygen-com/hyperframes 클로드 모션: claude.com 어썸 오푸스 5.5 비디오스: yihui-dev/awesome-opus5-5-videos [en-US] TOP 14 GitHub Design & Motion Tools Chosen by Developers From website UI design to interactions, motion graphics, and 3D animation. We have organized 14 popular and practically useful AI design skills and tools from GitHub into four chapters. Pick only the chapters you need. 00:00 Intro 00:19 CH1 AI Design Skills 00:19 Frontend Design (Anthropic) 00:45 UI UX Pro Max 01:11 Taste Skills 01:33 Hallmark 01:57 Impeccable 02:28 CH2 Workspace 02:31 Google Stitch 02:55 OpenDesign 03:19 CH3 Web Interactions 03:22 Emil Kowalski Animation Skills 03:49 React Beats 04:09 Keyframe Gallery 04:23 CH4 Motion Graphics 04:27 Remotion 04:44 Hyperframes 05:06 Claude Motion 05:32 Awesome Opus 5.5 Videos 05:51 Wrap-up ▶ Links to tools in the video [CH1 AI Design Skills] Frontend Design: github.com/anthropics/skills/tree/main/skills/fro… UI UX Pro Max: nextlevelbuilder/ui-ux-pro-max-skill Taste Skills: Leonxlnx/taste-skill Hallmark: Nutlope/hallmark Impeccable: pbakaus/impeccable (impeccable.style) [CH2 Workspace] Google Stitch: stitch.withgoogle.com Open Design: nexu-io/open-design [CH3 Web Interactions] Emil Kowalski Skills: emilkowalski/skills React Bits: reactbits.dev (DavidHDev/react-bits) Keyframes Gallery: keyframe.gallery [CH4 Motion Graphics] Remotion: remotion.dev (remotion-dev/remotion) Hyperframes: heygen-com/hyperframes Claude Motion: claude.com Awesome Opus 5.5 Videos: yihui-dev/awesome-opus5-5-videos [id] 14 Alat Desain & Motion GitHub Pilihan Para Developer Mulai dari desain UI situs web hingga interaksi, grafis gerak, dan animasi 3D. Kami telah mengorganisir 14 keterampilan dan alat desain AI yang populer dan praktis dari GitHub ke dalam empat bab. Pilih hanya bab yang Anda butuhkan. 00:00 Pendahuluan 00:19 CH1 Keterampilan Desain AI 00:19 Desain Frontend (Anthropic) 00:45 UI UX Pro Max 01:11 Taste Skills 01:33 Hallmark 01:57 Impeccable 02:28 CH2 Workspace 02:31 Google Stitch 02:55 OpenDesign 03:19 CH3 Interaksi Web 03:22 Keterampilan Animasi Emil Kowalski 03:49 React Beats 04:09 Galeri Keyframe 04:23 CH4 Grafis Gerak 04:27 Remotion 04:44 Hyperframes 05:06 Claude Motion 05:32 Video Awesome Opus 5.5 05:51 Penutup ▶ Tautan ke alat dalam video [CH1 Keterampilan Desain AI] Desain Frontend: github.com/anthropics/skills/tree/main/skills/fro… UI UX Pro Max: nextlevelbuilder/ui-ux-pro-max-skill Taste Skills: Leonxlnx/taste-skill Hallmark: Nutlope/hallmark Impeccable: pbakaus/impeccable (impeccable.style) [Ruang Kerja Bab 2] Google Stitch: stitch.withgoogle.com Open Design: nexu-io/open-design [Interaksi Web Bab 3] Emil Kowalski Skills: emilkowalski/skills React Bits: reactbits.dev (DavidHDev/react-bits) Galeri Keyframes: keyframe.gallery [Grafik Gerak CH4] Remotion: remotion.dev (remotion-dev/remotion) Hyperframes: heygen-com/hyperframes Claude Motion: claude.com Video Awesome Opus 5.5: yihui-dev/awesome-opus5-5-videos

7 أدوات على GitHub تعطي الذكاء الاصطناعي ذوق في تصميم المواقع المواقع اللي يسويها الذكاء الاصطناعي كلها شكل واحد؟ مو ذنب النموذج بس، ناقصه أدوات تعطيه ذوق. سبع أدوات على GitHub تفرق: 1. Taste Skill: تخلي الوكيل يختار ستايل للتصميم، ويجيب صور من أرشيفات مفتوحة، ويراجع شغله بالمتصفح. Leonxlnx/taste-skill 2. Impeccable: ناقد تصميم، أوامر تنقد الواجهة وتزبّط التفاصيل. pbakaus/impeccable 3. Designlang: عطها رابط موقع يعجبك، تطلع لك ألوانه وخطوطه ومسافاته. Manavarya09/design-extract 4. React Bits: أكثر من 215 قطعة متحركة جاهزة. DavidHDev/react-bits 5. GSAP Skills: تعلّم الوكيل يحرك عناصر الموقع وانت تنزل بالصفحة. greensock/gsap-skills 6. Transitions.dev: حركات صغيرة للقوائم والبطاقات والتنبيهات. Jakubantalik/transitions.dev 7. Playwright CLI من مايكروسوفت: الوكيل يفتح المتصفح ويصوّر موقعه ويشوف مشاكله. microsoft/playwright-cli ابدأ بـTaste Skill أو Impeccable، عطها وكيلك وقل له: استخدمها وراجع النتيجة. (أعداد النجوم حسب GitHub بتاريخ 25 أكتوبر 2026) #ذكاء_اصطناعي #تصميم_مواقع #GitHub #برمجة #عبدالرحمن_AI

I will never stop improving this library, help me make it even better -> DavidHDev/react-bits

Sound Lab by @davidhaz lets you tune effects and export WAV/MP3/OGG for video edits. Its license forbids reselling or redistributing standalone sound packs. Tool: reactbits.dev License: github.com/DavidHDev/react-bits/blob/main/LICENSE… x.com

Cubby: a home daycare talks through its day, Gemma writes the log, and code catches 37 of 37 planted licensing problems This is a submission for the Hacktoberfest Open-Source AI Challenge Week 2: Side Hustle It's 2:45 on a weekday afternoon at a home daycare. Two toddlers have just woken up, the baby is fussing, and the assistant heads out for the school run. The provider taps a quick note into her phone: "Dana out for school run." There are four kids under two in the house. In Massachusetts, one adult can look after up to six children, but no more than three of them under two. So for the next half hour the house is out of ratio, and nobody notices. It's right there in the notes. It's just not anywhere anyone will look. Earlier that day, 35 minutes went by without anyone checking on the sleeping baby. The rule is every 15. That's in the notes too. (Rosa, Dana and the kids are made up. So is every test day in this post.) I built Cubby to read those notes. On 14 test days I'd set aside before running anything on them, it caught all 37 problems I'd planted, with 4 false alarms. When I gave the same AI model the same notes and asked it to find the problems itself, it caught 30 and raised 72 false alarms. What I Built Running a licensed daycare out of your own home is a classic side hustle, and it comes with a lot of paperwork. Child Care Aware of America counted 94,227 licensed family child care homes in 2023, across the 39 states that reported numbers. Every day, a provider owes each parent a short report (what they ate, how long they slept, diapers, mood) and owes the state inspector exact logs: sign-ins, sleep checks, medicine, injuries, ratios. Most of it gets written from memory at nap time, or in an app. Here's what the apps publish for pricing (as of Oct 18): | App | Published price | |---|---| | Daily Connect | $8.99/mo up to 3 kids, $12.99/mo up to 6, or $16/mo billed yearly for 10 kids + $1.60 per extra kid | | Famly (US) | from $49/month | | Brightwheel, Procare, Lillio, Playground | contact sales | None of those pricing pages mention checking medication consent or incident reports against the rules. That's the stuff inspectors actually write people up for. Public California inspection reports show home daycares cited for having no infant sleep log and for leaving out the time of each 15-minute check. Here's how a day goes with Cubby: 1. You jot notes as things happen, typed or spoken. "Ava and Leo napped 1:10 to 2:40" is one note about two kids. Speech-to-text (Whisper) runs on the phone itself, so the audio never leaves it. 2. Gemma reads each note and turns it into log lines (meals, naps, sleep checks, diapers, injuries, medicine, pickups), each with the exact words it came from. If a note is unclear, like "the baby had a 4 oz bottle", it asks which child instead of guessing. 3. Plain code checks the log against Massachusetts' family child care rules (606 CMR 7.00): - sleep checks at least every 15 minutes - the ratio, minute by minute - medicine only with a current signed consent and a matching dose - an incident report for every injury (Cubby pre-fills it) - every child signed in and out to someone on their pickup list - late pickups, and times that don't add up Every warning shows the note behind it, the rule, and what to do about it. 4. Each parent gets a daily report. Gemma can make it warmer or translate it, but code checks every time, number, food and health word against the log before anyone sees it; if anything doesn't match, you get the plain version. Injuries and medicine are never reworded, and one parent's report never names another child ("Another child bit Leo on the arm…"). That last part came from reading reviews: in one public App Store review of a different daycare app, a Spanish translation turned a child who was "out" sick into a child who had "died". 5. The inspector's log for the day or the week exports as a PDF or CSV, and every line keeps the note it came from. It also works for a real program, not just the demo. Under "My program" you add your own kids (birthdays, allergies, medicine consents, photo consent, who can pick them up), your staff, and your rules, which start at the state's numbers. It all stays on your device. If Gemma asks "which child is 'the baby'?" you tap Mila once, and the rest of the day "the baby" means Mila. There's a week view too. Demo cubby-daycare.onrender.com is a one-page explainer. Tap Try the demo day and the app (/app) opens with a three-step tour of a made-up day at Rosa's: you send a note and watch it become a log line, then see the 8 things an inspector would flag and Ava's finished report. The ? button replays the tour. It's built for a phone. !A made-up day at Rosa's: see the whole day, jot a note and get a log line, fix what's flagged !Each parent's report (checked, even when translated), the week with the inspector's log, and Cubby running on a laptop with sleep-check reminders Code {% embed Hotragn/cubby %} It's all on GitHub: Hotragn/cubby. The interesting parts are the rule checks (public/lib/rules.js), the Massachusetts rules with their citations (public/lib/states.js), the prompt Gemma reads notes with (src/gemma.ts), and the tests (evals/, written up in docs/REPORT.md). How I Built It The whole design comes down to one split: the AI reads, the code decides. I didn't want a language model deciding whether a baby's nap was supervised safely. So Gemma's only job is to turn "checked all 1:40" into {"type":"sleep_check","kids":["all"],"time":"1:40"}, and even that gets double-checked. Names have to be on the roster, times have to make sense (providers write "1:10" meaning 1:10 pm, and Whisper writes it as "110"), and the quoted words have to actually appear in the note. After that, about 250 lines of plain rule code do the checking, right in the browser. There's a safety net too. Code scans every note for injury and medicine words, so "goose egg on his forehead" still raises a warning even if Gemma misses it. Testing it honestly. I wrote a generator for made-up days with problems planted in every rule type, plus two days I wrote by hand in a messy, spoken style ("um Clara had her Motrin three ml at like 10:15 I gave it"). The first 12 days were for finding bugs, and they found real ones: "had a few bites" of toast counted as an injury, and a 06:59 sign-in was read as 6:59 pm. Once I'd fixed those, I saved a separate set of 14 days, with the answer key, before running anything on it. | 14 set-aside test days, 37 planted problems | Caught | False alarms | |---|---|---| | Cubby (Gemma reads, code checks) | 37 | 4 | | Gemma alone (same notes, same rules written out in plain English) | 30 | 72 | The first run on those days caught all 37 with 6 false alarms. Two of them were "grapes cut in quarters" tripping my injury-word check, which I fixed after seeing it. The other 4 are real weaknesses: a pretend doctor kit, "Bodhi's mom here" not being read as a sign-out, diaper cream logged without a dose, and a pickup note that didn't say who it was. Gemma on its own missed 3 of the 4 ratio problems (it doesn't count heads minute by minute) and a whole day of 20-minute sleep-check gaps. To be fair to it, it used about a quarter of the tokens and caught every injury. The full write-up is in docs/REPORT.md. Speed and cost for a day of notes (about 27 of them): - In the cloud (Gemma 4 26B A4B): 34 to 39 seconds. That's free on Google AI Studio's free tier, or about a tenth of a cent at OpenRouter's price. - On my laptop (Gemma 4 E4B through Ollama on an M4 Mac, inside the real app): 162 seconds for the demo day's 39 notes, with all 9 planted problems flagged. On the test days it also caught all 37, but with 18 false alarms. The small model misses more wake-up times and pickups, and the code then flags those as missing. - A fine-tuned 4B model (Qwen3.5-4B with a LoRA trained on Tinker, from Gemma's own reading of 1,291 separate made-up notes): all 37 caught with 10 false alarms, in 3.5 seconds a day. The front end is React with a few React Bits components, on a small Node server. Why Does Open Innovation Matter? Because this is children's data. Nap times, diapers, injuries and medicine are about as private as a small business's records get. With an open model, the whole thing can run on the provider's own laptop: Gemma through Ollama, Whisper in the browser, and the checks in the page. Nothing leaves the house. The hosted demo only uses Google's cloud because every child in it is made up. It's also what makes the price work. Providers complain in public reviews about per-child pricing they only found out about after a trial. When a day of notes costs a tenth of a cent to read in the cloud, or nothing locally, I can charge a flat $9 a month for up to 12 kids, and it stays free if you run it yourself. And because it's open, anyone can check the work. Every warning cites its rule and shows its evidence, and a provider can read the exact line of code that flagged them. My First User I sent the demo to my friend Ravi on WhatsApp (first name only, with permission). Ravi's first reaction: "Checked out the demo, super cool project!" On price: "$9 flat is honestly a steal, especially since everyone else charges per kid. Totally fair!" On what to build next: "maybe a quick daily summary/report you can shoot to parents would be awesome." Cubby already does that; the Parents tab writes each child's daily report. Ravi just hadn't found it ("oh nice, my bad.good to know it already does that."), which tells me that report needs to be much easier to find. Ravi's last message: "Let me know when it's fully ready to buy, definitely want to grab it!" !The WhatsApp chat with Ravi, last name and profile photo blurred Prize Categories - Gemma: Gemma 4 does all the reading, measured in the cloud (26B: 37/37, 4 false alarms) and on a laptop (E4B: 37/37, 18) against Gemma on its own (30/37, 72). - Render: the live demo runs on Render and redeploys from the repo on every push. - ElevenLabs: a "Listen" button reads the finished parent report out loud. - Sentry Agent Tracing: every Gemma call is traced with its model and token counts, and never the note text or names. - Temporal: sleep-check and late-pickup reminders run as workflows. I killed the worker partway through a 20-second timer and restarted it, and the reminder still fired at 20.1 seconds (local dev server only). - Tinker: I fine-tuned a Qwen3.5-4B reader. It's 10 times faster but noisier (10 false alarms to Gemma's 4), so it's an experiment, not the default. - MongoDB Atlas: it stores anonymous feedback from testers and nothing about children. A few honest limits. I wrote both the rules and the tests, and the generated test days share templates with the days I debugged on; only the two hand-written days are truly new. Only Massachusetts is in so far, minus one ratio rule. Whisper sometimes mishears names, so notes stay editable before you send them. It isn't legal advice. And so far one person has tried the demo; nobody has used it on a real day yet. How I used AI: I picked the idea and directed the build. Claude Code wrote the code, generated the made-up test days, ran the tests, and drafted this post from the results. Every child, adult and note in the demo and the tests is invented.

Its created by david haz he has a github on his website x.com davidhaz.com github.com/DavidHDev x.com

fees to the creator? x.com github.com/DavidHDev x.com