<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Abhishek J N</title>
    <description>The latest articles on DEV Community by Abhishek J N (@abhishek_jn_1553cf06a8e7).</description>
    <link>https://dev.to/abhishek_jn_1553cf06a8e7</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3962085%2F890adf0e-e8d9-4afa-a456-b4b2c69190af.png</url>
      <title>DEV Community: Abhishek J N</title>
      <link>https://dev.to/abhishek_jn_1553cf06a8e7</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/abhishek_jn_1553cf06a8e7"/>
    <language>en</language>
    <item>
      <title>NatureQuest AI: An Open-Weight AI That Sends You Outside</title>
      <dc:creator>Abhishek J N</dc:creator>
      <pubDate>Sat, 10 Oct 2026 17:00:29 +0000</pubDate>
      <link>https://dev.to/abhishek_jn_1553cf06a8e7/naturequest-ai-an-open-weight-ai-that-sends-you-outside-1h34</link>
      <guid>https://dev.to/abhishek_jn_1553cf06a8e7/naturequest-ai-an-open-weight-ai-that-sends-you-outside-1h34</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;NatureQuest AI&lt;/strong&gt; is an AI-powered outdoor discovery companion that turns a few spare minutes into a mindful real-world exploration.&lt;/p&gt;

&lt;p&gt;Tagline: &lt;em&gt;"A little less scrolling. A little more exploring."&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Modern algorithmic feeds are engineered to maximize screen time, pulling us into infinite digital doomscrolls. NatureQuest AI inverts this dynamic: instead of keeping users trapped in an open-ended chatbot conversation, it uses open-weight AI to provide an immediate, practical reason to put the phone away and step outside.&lt;/p&gt;

&lt;p&gt;Users choose their immediate surroundings (neighborhood street, public park, campus, garden, or trail), available time (10, 15, or 30 minutes), difficulty, and sensory interests (plants, birds, trees, weather, mindful observation). &lt;/p&gt;

&lt;p&gt;NatureQuest AI creates a structured, achievable outdoor micro-mission featuring:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Actionable Field Tasks:&lt;/strong&gt; Achievable without purchasing equipment; practical whether you live in Bengaluru, London, or Tokyo.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Sensory Observation Tips &amp;amp; Safety Reminders:&lt;/strong&gt; Clear reminders on keeping footing safe and respecting wildlife.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Distraction-Free "Outdoor Mode":&lt;/strong&gt; A high-contrast, one-task-at-a-time checklist with a progress tracker and an explicit protocol to silence notifications and lock the device between tasks.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Post-Walk Reflection &amp;amp; Field Notes:&lt;/strong&gt; A contemplation question with personal field notes saved privately in the browser (&lt;code&gt;localStorage&lt;/code&gt;)—zero user accounts, zero tracking cookies, and zero personal data harvesting.&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The idea is simple: technology should sometimes help us put our phones away.&lt;/p&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Live Application:&lt;/strong&gt; &lt;div class="crayons-card c-embed text-styles text-styles--secondary"&gt;
    &lt;div class="c-embed__content"&gt;
      &lt;div class="c-embed__body flex items-center justify-between"&gt;
        &lt;a href="https://naturequest-ai.onrender.com" rel="noopener noreferrer" class="c-link fw-bold flex items-center"&gt;
          &lt;span class="mr-2"&gt;naturequest-ai.onrender.com&lt;/span&gt;
          

        &lt;/a&gt;
      &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Demo Video:&lt;/strong&gt;   &lt;iframe src="https://www.youtube.com/embed/BQKyTgurYOE" width="710" height="399"&gt;
  &lt;/iframe&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Screenshots
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Ftyeq721zs9h4zkdgdqcy.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Ftyeq721zs9h4zkdgdqcy.png" alt=" " width="800" height="432"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F32zhhl8r5ov5f6aw1rqs.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F32zhhl8r5ov5f6aw1rqs.png" alt=" " width="800" height="432"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Code
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;GitHub Repository:&lt;/strong&gt; &lt;/p&gt;
&lt;div class="ltag-github-readme-tag"&gt;
  &lt;div class="readme-overview"&gt;
    &lt;h2&gt;
      &lt;img src="https://assets.dev.to/assets/github-logo-5a155e1f9a670af7944dd5e12375bc76ed542ea80224905ecaf878b9157cdefc.svg" alt="GitHub logo"&gt;
      &lt;a href="https://github.com/JNAbhishek27" rel="noopener noreferrer"&gt;
        JNAbhishek27
      &lt;/a&gt; / &lt;a href="https://github.com/JNAbhishek27/naturequest-ai" rel="noopener noreferrer"&gt;
        naturequest-ai
      &lt;/a&gt;
    &lt;/h2&gt;
    &lt;h3&gt;
      
    &lt;/h3&gt;
  &lt;/div&gt;
  &lt;div class="ltag-github-body"&gt;
    
&lt;div id="readme" class="md"&gt;&lt;div class="markdown-heading"&gt;
&lt;h1 class="heading-element"&gt;NatureQuest AI 🌿&lt;/h1&gt;
&lt;/div&gt;
&lt;blockquote&gt;
&lt;p&gt;&lt;em&gt;"A little less scrolling. A little more exploring."&lt;/em&gt;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;a href="https://github.com/JNAbhishek27/naturequest-ai/LICENSE" rel="noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/784362b26e4b3546254f1893e778ba64616e362bd6ac791991d2c9e880a3a64e/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c6963656e73652d4d49542d677265656e2e737667" alt="License: MIT"&gt;&lt;/a&gt;
&lt;a href="https://hacktoberfest.com/" rel="nofollow noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/cd012dba4623adc1928808370f924c6323ba5f15e22b53d6957245ca5baa0bf4/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4861636b746f626572666573742d546f75636825323047726173732532304368616c6c656e67652d6f72616e67652e737667" alt="Hacktoberfest"&gt;&lt;/a&gt;
&lt;a href="https://ai.google.dev/gemma" rel="nofollow noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/efde457dd6cdc0d9a73b8725f7b0b39f4917fc62f5185087c2eb092dff942e8e/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4149253230456e67696e652d47656d6d612532304f70656e2d2d576569676874732d626c75652e737667" alt="Model"&gt;&lt;/a&gt;
&lt;a href="https://python.org" rel="nofollow noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/4325f29269cc459b93decb36f4b62bd7992e4410c8da0f39ae1757704da20cc2/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f507974686f6e2d332e31312532422d627269676874677265656e2e737667" alt="Python"&gt;&lt;/a&gt;&lt;/p&gt;
&lt;p&gt;NatureQuest AI is an open-source, distraction-free outdoor companion application built for the &lt;strong&gt;Hacktoberfest Open-Source AI Challenge Week 1: "Touch Grass"&lt;/strong&gt;.&lt;/p&gt;

&lt;div class="markdown-heading"&gt;
&lt;h2 class="heading-element"&gt;1. Project Overview &amp;amp; Problem Statement&lt;/h2&gt;
&lt;/div&gt;
&lt;p&gt;Modern algorithms are engineered to maximize screen time, capture attention, and keep users indoors scrolling infinite feeds. This screen saturation directly contributes to digital fatigue, sedentary routines, and detachment from immediate surroundings.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;NatureQuest AI flips this dynamic:&lt;/strong&gt;
Instead of trapping you in an open-ended chatbot conversation, NatureQuest AI uses Google's open-weights &lt;strong&gt;Gemma&lt;/strong&gt; model to generate a &lt;strong&gt;finite, structured, actionable micro-mission&lt;/strong&gt; tailored to your immediate environment (parks, gardens, university campuses, or neighborhood streets in India and worldwide). Once your mission is ready, the app switches to an &lt;strong&gt;Outdoor Mode&lt;/strong&gt; that prompts you to silence notifications, slip your phone into your pocket, and explore the living world with your actual senses.&lt;/p&gt;

&lt;div class="markdown-heading"&gt;
&lt;h2 class="heading-element"&gt;2. Key Features&lt;/h2&gt;…&lt;/div&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="gh-btn-container"&gt;&lt;a class="gh-btn" href="https://github.com/JNAbhishek27/naturequest-ai" rel="noopener noreferrer"&gt;View on GitHub&lt;/a&gt;&lt;/div&gt;
&lt;/div&gt;


&lt;h2&gt;
  
  
  How I Built It
&lt;/h2&gt;

&lt;p&gt;I built NatureQuest AI using Python, Flask, HTML, CSS, and Vanilla JavaScript, with Google's open-weight &lt;strong&gt;Gemma&lt;/strong&gt; model (&lt;code&gt;gemma-3-4b-it&lt;/code&gt;) serving as the core engine for generating outdoor missions.&lt;/p&gt;

&lt;h3&gt;
  
  
  Architecture &amp;amp; Gemma Integration
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Server-Side AI Module (&lt;code&gt;ai_service.py&lt;/code&gt;):&lt;/strong&gt; Integrates with the official &lt;code&gt;google-genai&lt;/code&gt; Python SDK. A strict system prompt enforces a validated JSON schema contract containing &lt;code&gt;mission_title&lt;/code&gt;, &lt;code&gt;three_to_five_tasks&lt;/code&gt;, &lt;code&gt;observation_tips&lt;/code&gt;, &lt;code&gt;one_reflection_question&lt;/code&gt;, &lt;code&gt;safety_reminders&lt;/code&gt;, and &lt;code&gt;low_screen_mode_instruction&lt;/code&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Configurable Models:&lt;/strong&gt; The model identifier is set through the &lt;code&gt;GEMMA_MODEL_ID&lt;/code&gt; environment variable (compatible with &lt;code&gt;gemma-3-4b-it&lt;/code&gt;, &lt;code&gt;gemma-2-9b-it&lt;/code&gt;, or &lt;code&gt;gemma-3-12b-it&lt;/code&gt;).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Status Indicator &amp;amp; Honest Fallback:&lt;/strong&gt; The application features a dedicated &lt;code&gt;/api/model-status&lt;/code&gt; endpoint. When no API credentials are present, or during network disruptions, it serves a pre-designed, clearly labeled sample mission. It never misrepresents fallback content as live model output.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Frontend Experience:&lt;/strong&gt; Designed with an editorial nature color palette (deep forest green, warm ivory, soft sage, and earthy amber accents) and responsive layouts.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Automated Testing:&lt;/strong&gt; Tested using &lt;code&gt;pytest&lt;/code&gt; (&lt;code&gt;tests/test_app.py&lt;/code&gt;) covering health checks, input parameter validation, schema verification, fallback labeling, and mocked Gemma responses. All 10 unit and integration tests pass without requiring a live API key.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Why Does Open Innovation Matter?
&lt;/h2&gt;

&lt;p&gt;An outdoor companion should not require an expensive proprietary model or an opaque, unchangeable AI system to generate simple activities.&lt;/p&gt;

&lt;p&gt;Using an open-weight model gives developers the opportunity to inspect the available model options, adapt the generation instructions, compare alternatives, and potentially run inference on their own hardware.&lt;/p&gt;

&lt;p&gt;This version uses hosted Gemma inference, so it is not fully offline. However, the model-based design makes it possible to explore local inference as a future step, which could reduce dependence on connectivity and provide users with greater control over their data.&lt;/p&gt;

&lt;p&gt;Most importantly, the AI is not designed to keep users chatting indefinitely. It creates a finite mission and encourages them to leave the screen behind.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Learned
&lt;/h2&gt;

&lt;p&gt;Building this project provided several key takeaways:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Constraining Generative Models for the Real World:&lt;/strong&gt; Crafting prompt boundaries to prevent the model from inventing real-time weather conditions, claiming botanical identifications, or assuming expensive outdoor gear was crucial for user trust.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Defensive Schema Parsing:&lt;/strong&gt; Open-weight models benefit from explicit schema enforcement on the backend, ensuring JSON output is sanitized and typed before reaching client templates.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Designing for Low Screen Time:&lt;/strong&gt; It was refreshing to design a frontend whose explicit goal is to be put away. Outdoor Mode emphasizes high-contrast text, clear progress steps, and minimal interaction so attention stays on the physical environment.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Resilient Production Workflows:&lt;/strong&gt; Configuring automated tests with &lt;code&gt;pytest&lt;/code&gt; and deploying via Gunicorn on Render demonstrated how quickly an idea can go from concept to a production-ready open-source utility.&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Prize Categories
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Best Use of Gemma&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Best Use of Render&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Future Improvements
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Local, offline inference with a compatible open-weight model (via Ollama or llama.cpp on edge devices).&lt;/li&gt;
&lt;li&gt;Optional nature journals and reusable mission history.&lt;/li&gt;
&lt;li&gt;Evidence-based regional nature guides and seasonal checklists.&lt;/li&gt;
&lt;li&gt;Audio-guided missions using the Web Speech API for zero screen touches.&lt;/li&gt;
&lt;li&gt;More accessible activities and community-created missions.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Thanks for checking out NatureQuest AI! 🌿&lt;/p&gt;

</description>
      <category>devchallenge</category>
      <category>hf26challenge</category>
    </item>
    <item>
      <title>SafePlate</title>
      <dc:creator>Abhishek J N</dc:creator>
      <pubDate>Sun, 04 Oct 2026 05:27:57 +0000</pubDate>
      <link>https://dev.to/abhishek_jn_1553cf06a8e7/safeplate-2n08</link>
      <guid>https://dev.to/abhishek_jn_1553cf06a8e7/safeplate-2n08</guid>
      <description>&lt;p&gt;The Allergy-Safe Kitchen Guardian Built for My Roommate (Powered by On-Device Open-Weight AI)&lt;br&gt;
published: true&lt;br&gt;
tags: hacktoberfest, opensource, ai, webdev&lt;br&gt;
canonical_url: &lt;a href="https://safeplate-built-for-a-friend.ai.studio" rel="noopener noreferrer"&gt;https://safeplate-built-for-a-friend.ai.studio&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/hacktoberfest-weekend-2026-10-01"&gt;Hacktoberfest Weekend Challenge: Build for a Friend&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;I built &lt;strong&gt;SafePlate&lt;/strong&gt; for my college roommate and closest friend, &lt;strong&gt;Sam&lt;/strong&gt;. &lt;/p&gt;

&lt;p&gt;Sam lives with severe Celiac Disease and life-threatening peanut and tree-nut anaphylaxis. Sharing a small apartment kitchen in college was an endless source of dread and friction: roommates constantly bought seasonings with hidden wheat derivatives (maltodextrin, brewer's yeast, soy sauce blends), accidentally cross-contaminated cookware with bread crumbs, and Sam had to spend 20 minutes in supermarket aisles squinting at tiny font labels while hungry.&lt;/p&gt;

&lt;p&gt;SafePlate gives our apartment:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Instant On-Device Label &amp;amp; Ingredient Scanner&lt;/strong&gt;: Detects sneaky allergen derivatives (&lt;em&gt;malt, farina, brewer’s yeast, hydrolyzed wheat, shared facility lines&lt;/em&gt;) and provides certified 1-to-1 kitchen swaps (e.g., &lt;em&gt;San-J GF Tamari, SunButter, coconut aminos&lt;/em&gt;).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Safe Shared Weekly Meal Planner&lt;/strong&gt;: Curated comfort dinners certified 100% safe for Sam that all roommates love (under $4/portion), with step-by-step cooking instructions and kitchen isolation protocols.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Pantry &amp;amp; Fridge Quick Cook&lt;/strong&gt;: Generates instant safe recipes from whatever is in the fridge so no one orders risky takeout.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Apartment Cross-Contamination Protocols&lt;/strong&gt;: Non-negotiable roommate kitchen boundaries (&lt;em&gt;The Red Toaster Sanctuary, blue allergy sponge segregation, double-dip bans on butter &amp;amp; jam&lt;/em&gt;).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Safe Smart Grocery List&lt;/strong&gt;: Filterable shopping checklist with specific brand guidance so roommates never grab the wrong soy sauce or oat brand.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Live Deployed App&lt;/strong&gt;: &lt;div class="crayons-card c-embed text-styles text-styles--secondary"&gt;
    &lt;div class="c-embed__content"&gt;
      &lt;div class="c-embed__body flex items-center justify-between"&gt;
        &lt;a href="https://safeplate-built-for-a-friend.ai.studio" rel="noopener noreferrer" class="c-link fw-bold flex items-center"&gt;
          &lt;span class="mr-2"&gt;safeplate-built-for-a-friend.ai.studio&lt;/span&gt;
          

        &lt;/a&gt;
      &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Video Demo&lt;/strong&gt;:   &lt;iframe src="https://www.youtube.com/embed/jPRBuPAvNr0" width="710" height="399"&gt;
  &lt;/iframe&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Video Demo&lt;/strong&gt;: &lt;div class="ltag-github-readme-tag"&gt;
  &lt;div class="readme-overview"&gt;
    &lt;h2&gt;
      &lt;img src="https://assets.dev.to/assets/github-logo-5a155e1f9a670af7944dd5e12375bc76ed542ea80224905ecaf878b9157cdefc.svg" alt="GitHub logo"&gt;
      &lt;a href="https://github.com/JNAbhishek27" rel="noopener noreferrer"&gt;
        JNAbhishek27
      &lt;/a&gt; / &lt;a href="https://github.com/JNAbhishek27/SafePlate" rel="noopener noreferrer"&gt;
        SafePlate
      &lt;/a&gt;
    &lt;/h2&gt;
    &lt;h3&gt;
      SafePlate, open source AI, Gemma 2B, Llama 3.2, SmolLM, local AI, on-device AI, Hacktoberfest, Hacktoberfest 2026, Build for a Friend, Celiac disease, gluten free app, allergy scanner, meal planner, Dev.to challenge, privacy AI, edge AI, web development, react, typescript
    &lt;/h3&gt;
  &lt;/div&gt;
  &lt;div class="ltag-github-body"&gt;
    
&lt;div id="readme" class="md"&gt;&lt;div class="markdown-heading"&gt;
&lt;h1 class="heading-element"&gt;SafePlate: Built for a Friend 🍽️🛡️&lt;/h1&gt;
&lt;/div&gt;
&lt;blockquote&gt;
&lt;p&gt;&lt;strong&gt;An allergy-safe shared apartment meal planner and on-device ingredient guardian built for a roommate, powered by local open-weight AI.&lt;/strong&gt;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;em&gt;Built for the &lt;a href="https://dev.to/challenges/hacktoberfest-weekend-2026-10-01" rel="nofollow"&gt;Hacktoberfest Weekend Challenge: Build for a Friend&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;a href="https://ais-pre-jeg2cbrol7f2to5cry7if6-1000591823797.asia-southeast1.run.app" rel="nofollow noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/2c173fa532ffeb1fb0e64bc6b44ddcf4221a41781067cb66095764114d2b4ac5/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c6976655f44656d6f2d53616665506c6174655f5765625f4170702d616d6265723f7374796c653d666c61742d737175617265" alt="Live App"&gt;&lt;/a&gt;
&lt;a href="https://huggingface.co/" rel="nofollow noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/f2c9cfe89c995d7138b3a21eeb4a31fd9f50231c661fc45434bb6a3b18b934aa/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4f70656e5f536f757263655f41492d47656d6d615f32425f2537435f4c6c616d615f332e325f2537435f536d6f6c4c4d322d626c75653f7374796c653d666c61742d737175617265" alt="Open Source AI"&gt;&lt;/a&gt;
&lt;a href="https://github.com/" rel="noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/ba131b1d4b87ebd36e6250058a863c3e292f428900d465f7c8ec2fd4d636994e/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f507269766163792d305f42797465735f436c6f75645f4567726573732d656d6572616c643f7374796c653d666c61742d737175617265" alt="Privacy"&gt;&lt;/a&gt;
&lt;a href="https://github.com/JNAbhishek27/SafePlate/LICENSE" rel="noopener noreferrer"&gt;&lt;img src="https://camo.githubusercontent.com/f109c2b8d38056be348825c139fcc61cb331a6a76016df803a945e6ebe868281/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c6963656e73652d4170616368655f322e302d73746f6e653f7374796c653d666c61742d737175617265" alt="License"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;div class="markdown-heading"&gt;
&lt;h2 class="heading-element"&gt;📖 The Story: Who I Built This For&lt;/h2&gt;
&lt;/div&gt;
&lt;p&gt;I built &lt;strong&gt;SafePlate&lt;/strong&gt; for my college roommate and closest friend, &lt;strong&gt;Sam&lt;/strong&gt; (Apartment 4B).&lt;/p&gt;
&lt;p&gt;Sam lives with &lt;strong&gt;severe Celiac Disease&lt;/strong&gt; and &lt;strong&gt;life-threatening peanut and tree-nut anaphylaxis&lt;/strong&gt;. In our shared college apartment, cooking was an endless source of stress and friction:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;Roommates repeatedly purchased seasonings, sauces, and snacks containing sneaky wheat derivatives (&lt;em&gt;maltodextrin, barley malt, brewer’s yeast, fermented soy sauce&lt;/em&gt;).&lt;/li&gt;
&lt;li&gt;An accidental breadcrumb in the toaster or a shared porous sponge could trigger weeks of agonizing autoimmune intestinal damage or an emergency room EpiPen visit.&lt;/li&gt;
&lt;li&gt;Grocery shopping was exhausting: Sam spent 20 minutes in supermarket aisles squinting at micro-print ingredient lists while hungry.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;SafePlate provides…&lt;/p&gt;&lt;/div&gt;


&lt;/div&gt;
&lt;br&gt;
  &lt;div class="gh-btn-container"&gt;&lt;a class="gh-btn" href="https://github.com/JNAbhishek27/SafePlate" rel="noopener noreferrer"&gt;View on GitHub&lt;/a&gt;&lt;/div&gt;
&lt;br&gt;
&lt;/div&gt;

&lt;/li&gt;

&lt;/ul&gt;

&lt;h2&gt;
  
  
  Code
&lt;/h2&gt;

&lt;p&gt;The project is built as a production-grade TypeScript React web application powered by on-device open-weight model architectures. &lt;/p&gt;

&lt;p&gt;Key code modules:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;/src/services/openAiEngine.ts&lt;/code&gt;: Local open-weight inference &amp;amp; heuristic safety parsing engine with real-time telemetry (0 bytes cloud egress verification, token tracking, latency measurement).&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;/src/components/IngredientScanner.tsx&lt;/code&gt;: Real-time allergen detection, cross-contamination vector checking, and safe ingredient substitutions.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;/src/components/MealPlanner.tsx&lt;/code&gt;: Weekly apartment meal planner with full cross-contamination protocols.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;/src/components/PantryChef.tsx&lt;/code&gt;: On-demand safe recipe synthesis from on-hand ingredients.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;/src/components/KitchenSafetyChecklist.tsx&lt;/code&gt;: Shared apartment kitchen rules and fridge pledge.&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;/src/components/OpenSourceInspector.tsx&lt;/code&gt;: Interactive benchmark lab comparing on-device open weights against closed cloud APIs.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  How I Built It
&lt;/h2&gt;

&lt;p&gt;SafePlate has open-source AI at its very foundation:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Gemma 2 2B (Google Open Weights)&lt;/strong&gt;: Ultra-efficient instruction-tuned model powering rapid ingredient parsing, hidden derivative detection, and safe culinary substitutions directly inside the browser runtime.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Llama 3.2 1B (Meta Open Weights)&lt;/strong&gt;: High-speed edge model with sub-1GB footprint optimized for instant latency in low-memory environments.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;SmolLM2 360M (Hugging Face)&lt;/strong&gt;: Micro-footprint open model providing lightweight safety checks on older student laptops.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Local On-Device Execution&lt;/strong&gt;: Runs completely air-gapped on the client with zero network requests to remote cloud AI endpoints.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Why Does Open Innovation Matter?
&lt;/h2&gt;

&lt;p&gt;Building for a real person with medical vulnerabilities proved why open innovation is vastly superior to closed cloud APIs:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Medical Data Sovereignty &amp;amp; Absolute Privacy&lt;/strong&gt;: Sam's medical allergies, Celiac diagnosis, and dietary restrictions are sensitive personal health information. Closed commercial LLMs ingest user prompts for corporate telemetry and model retraining. With open-weight models, &lt;strong&gt;0 bytes leave the device&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Zero Recurring Cost for Students &amp;amp; Roommates&lt;/strong&gt;: College roommates and students cannot afford $20/month per-seat closed AI subscriptions just to check sauce labels or plan dinner. Open models run forever at zero marginal cost.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Grocery Store Dead Zones&lt;/strong&gt;: Supermarket basements, subways, and farm stands notoriously have zero cellular reception. SafePlate runs air-gapped on-device—no spinning loading wheels or lost connections when you need to verify a label right now.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Specialized Steering Over Corporate Disclaimers&lt;/strong&gt;: Closed commercial APIs hedge with 5 paragraphs of legal disclaimers ("&lt;em&gt;we cannot guarantee accuracy, consult a doctor&lt;/em&gt;"). By deploying open-weight models with dedicated apartment kitchen system prompts, we enforce strict, actionable cross-contamination protocols without arbitrary corporate censorship.&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  What Sam Said Upon Handoff
&lt;/h2&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;em&gt;"Dude, you actually made this for me?! Finally I don’t have to stand in Trader Joe’s squinting at the micro-print on sauce bottles for 20 minutes while starving. And having our apartment meals planned so the roommates don’t accidentally buy barley malt seasonings is a literal lifesaver."&lt;/em&gt;&lt;br&gt;
— &lt;strong&gt;Sam&lt;/strong&gt;, Apartment 4B Roommate&lt;/p&gt;
&lt;/blockquote&gt;

&lt;h2&gt;
  
  
  My Agent Session
&lt;/h2&gt;

&lt;p&gt;Agent session saved with DevRelay. Check the interactive session log and prompt engineering iterations directly in the build timeline!&lt;/p&gt;

&lt;h2&gt;
  
  
  Prize Categories
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Open-Source AI at its Core&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Edge / On-Device AI &amp;amp; Privacy&lt;/strong&gt;&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Build for a Friend (Most Heartwarming &amp;amp; Usable)&lt;/strong&gt;&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>devchallenge</category>
      <category>weekendchallenge</category>
      <category>hf26challenge</category>
    </item>
    <item>
      <title>ChronoSyntax: Building an Anomaly Incident Control App with Sanity App SDK &amp; Autonomous AI Workflows</title>
      <dc:creator>Abhishek J N</dc:creator>
      <pubDate>Wed, 30 Sep 2026 12:12:12 +0000</pubDate>
      <link>https://dev.to/abhishek_jn_1553cf06a8e7/chronosyntax-building-an-anomaly-incident-control-app-with-sanity-app-sdk-autonomous-ai-workflows-5490</link>
      <guid>https://dev.to/abhishek_jn_1553cf06a8e7/chronosyntax-building-an-anomaly-incident-control-app-with-sanity-app-sdk-autonomous-ai-workflows-5490</guid>
      <description>&lt;h2&gt;
  
  
  &lt;strong&gt;ChronoSyntax: Building an Anomaly Incident Control App with Sanity App SDK &amp;amp; Autonomous AI Workflows&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;This is a submission for the MLH x DEV Writing Challenge&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;Most headless CMS projects treat content as inert, static text: a blog post with a hero image, published once and forgotten. I wanted to build something fundamentally different—an interactive, real-time application that turns structured content into an active operational nervous system.&lt;br&gt;
I built &lt;strong&gt;ChronoSyntax: The Multiversal Anomaly Broadcast Network&lt;/strong&gt;.&lt;br&gt;
ChronoSyntax reimagines the Sanity Content Lake as a live incident control and telemetry mesh monitoring dimensional anomalies and occult radio signals across spacetime.&lt;/p&gt;

&lt;p&gt;Key Capabilities:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Workflows Modeled as Data (workflow.state):&lt;/strong&gt; Instead of an ordinary status string (status: 'draft' | 'published'), the entire editorial lifecycle is modeled as first-class structured content directly next to the document. Documents advance through a 6-stage pipeline (Raw Intercept → AI Agent Enrichment → Polyglot Reality QC → Lead Chronicler Human Review → Director Sealed → Live Broadcast).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Autonomous Agent &amp;amp; External Webhooks:&lt;/strong&gt; An AI agent (Agent-Gemini-Theta) autonomously queries incoming intercepts, calculates hazard classes (Safe, Euclid, Keter, Reality-Bending), decrypts occult radio ciphers, and triggers an automated external HTTP webhook to an incident relay before handing off the draft to human archivists.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Custom Studio Input (Video-to-GIF Glitch Synthesizer):&lt;/strong&gt; Replaces generic file uploaders with an interactive canvas frame buffer. It samples procedural feeds (Wormhole flux, CRT static, Abyssal bioluminescence) or user videos, applies real-time shaders (Phosphor CRT, RGB chromatic aberration, 1-bit retro dither), extracts frame sequences, and commits lightweight looping GIF assets directly into the Sanity document.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;The App SDK (Interactive Incident Control Deck):&lt;/strong&gt; Rather than another read-only blog, this custom operational application executes real-time bidirectional mutations against the Content Lake (client.patch, client.create, client.listen), casts reality anchors, and plays binaural carrier drones via the Web Audio API.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Real-time GROQ Query Studio:&lt;/strong&gt; A live in-app GROQ playground with sub-millisecond execution telemetry, projection testing, and instant JSON inspection.&lt;/li&gt;
&lt;/ol&gt;
&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Live Deployed App:&lt;/strong&gt; &lt;br&gt;
&lt;/p&gt;
&lt;div class="crayons-card c-embed text-styles text-styles--secondary"&gt;
    &lt;div class="c-embed__content"&gt;
      &lt;div class="c-embed__body flex items-center justify-between"&gt;
        &lt;a href="https://chronosyntax.ai.studio" rel="noopener noreferrer" class="c-link fw-bold flex items-center"&gt;
          &lt;span class="mr-2"&gt;chronosyntax.ai.studio&lt;/span&gt;
          

        &lt;/a&gt;
      &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;


&lt;p&gt;&lt;strong&gt;Video Walkthrough:&lt;/strong&gt;&lt;br&gt;
  &lt;iframe src="https://www.youtube.com/embed/cxARIY8j9r4" width="710" height="399"&gt;
  &lt;/iframe&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;Screenshots&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6dleccy734tf8z8gv3av.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6dleccy734tf8z8gv3av.png" alt=" " width="799" height="428"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fqbq6qq51gi3yn8vvm95s.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fqbq6qq51gi3yn8vvm95s.png" alt=" " width="799" height="428"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;Code&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;GitHub Repository:&lt;/strong&gt; - &lt;a href="https://github.com/JNAbhishek27/ChronoSyntax-" rel="noopener noreferrer"&gt;https://github.com/JNAbhishek27/ChronoSyntax-&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Core Technologies:&lt;/strong&gt; Sanity Content Lake, GROQ, TypeScript, React 19, Tailwind CSS, Express, Web Audio API, @google/genai (Gemini 3.8 Flash).&lt;/p&gt;

&lt;h2&gt;
  
  
  Partner Technologies
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;Sanity (Content Lake, GROQ, App SDK &amp;amp; Workflows)
Sanity was the foundational data layer for the entire project. Rather than using it purely as a back-office blog CMS, I pushed into its advanced capabilities:
Sanity App SDK &amp;amp; Real-Time Subscriptions: Built an interactive frontend that subscribes to the Content Lake via client.listen() and executes atomic patch operations (client.patch(id).inc({ containmentIntegrity: 4 }).commit()) with immediate optimistic UI updates.
Workflows as Data (&lt;a class="mentioned-user" href="https://dev.to/sanity"&gt;@sanity&lt;/a&gt;/workflow pattern): Modeled workflow state as a first-class schema object with append-only polymorphic audit history arrays ({ type: 'agent' | 'human' | 'system', name: string, note: string }). Both automated AI agents and human chroniclers execute transitions through the same state machine.
Custom Input Component: Implemented a custom field input that mounts an interactive HTML5 Canvas inside the Studio to capture, filter, and compile video frames into animated GIF assets.
GROQ (Graph Relational Object Queries): Structured queries using projections, aliases, sort orderings, and aggregate count expressions (*[_type == "anomaly" &amp;amp;&amp;amp; dangerLevel &amp;gt; 60] | order(dangerLevel desc)).&lt;/li&gt;
&lt;li&gt;Google Gemini AI (@google/genai)
Implemented server-side autonomous agent intelligence using the gemini-3.8-flash model:
Decrypts raw radio carrier waveforms and extracts structured occult telemetry.
Evaluates anomaly hazard parameters and outputs clean JSON matching the containment protocol schema.
Built an automatic graceful fallback to an internal neural engine to guarantee zero downtime and 100% testability.&lt;/li&gt;
&lt;li&gt;Web Audio API
Used the native Web Audio API to create binaural drone synthesizers mapping anomalous document frequencies (MHz) into audible carrier hums and detuned beat frequencies.&lt;/li&gt;
&lt;/ol&gt;

&lt;h2&gt;
  
  
  Hackathon Experience
&lt;/h2&gt;

&lt;p&gt;Building ChronoSyntax during the hackathon was an intense masterclass in rapid prototyping, vibe-coding, and pushing developer tooling to its limits:&lt;br&gt;
The Vibe-Coding Pivot: When I first started prompting the application, AI assistants kept nudging the project toward a standard, passive blog template. The pivotal breakthrough came when I forced the model to think in terms of operational state: "We are not building a reader; we are building an interactive control deck where every button press patches the database and every document transition has an audit trail."&lt;br&gt;
What Surprised Me: How powerful modeling workflows as structured content really is. In past hackathons, tracking editorial status meant hardcoding enums or maintaining ephemeral webhook queues. Storing workflow.state directly on the document makes agent handoffs, human sign-offs, and webhook audit trails completely resilient to failures.&lt;br&gt;
What I Learned: Balancing optimistic client-side UI mutations with real-time streaming listeners requires strict revision tracking (_rev). Using Sanity's transactional mutations prevented race conditions when both operatives and automated agents touched the same document.&lt;/p&gt;


&lt;div class="ltag__link--embedded"&gt;
  &lt;div class="crayons-story "&gt;
  &lt;a href="https://dev.to/abhishek_jn_1553cf06a8e7/chronosyntax-vibe-coding-a-multiversal-anomaly-broadcast-network-with-sanity-app-sdk-autonomous-1m0p" class="crayons-story__hidden-navigation-link"&gt;ChronoSyntax: Vibe-Coding a Multiversal Anomaly Broadcast Network with Sanity App SDK &amp;amp; Autonomous Workflows&lt;/a&gt;


  &lt;div class="crayons-story__body crayons-story__body-full_post"&gt;
      &lt;a href="https://dev.to/abhishek_jn_1553cf06a8e7/chronosyntax-vibe-coding-a-multiversal-anomaly-broadcast-network-with-sanity-app-sdk-autonomous-1m0p" class="crayons-article__context-note crayons-article__context-note__feed"&gt;&lt;p&gt;Sanity Challenge Path Two Submission&lt;/p&gt;

&lt;/a&gt;
    &lt;div class="crayons-story__top"&gt;
      &lt;div class="crayons-story__meta"&gt;
        &lt;div class="crayons-story__author-pic"&gt;

          &lt;a href="/abhishek_jn_1553cf06a8e7" class="crayons-avatar  crayons-avatar--l  "&gt;
            &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3962085%2F890adf0e-e8d9-4afa-a456-b4b2c69190af.png" alt="abhishek_jn_1553cf06a8e7 profile" class="crayons-avatar__image" width="96" height="96"&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;div&gt;
          &lt;div&gt;
            &lt;a href="/abhishek_jn_1553cf06a8e7" class="crayons-story__secondary fw-medium m:hidden"&gt;
              Abhishek J N
            &lt;/a&gt;
            &lt;div class="profile-preview-card relative mb-4 s:mb-0 fw-medium hidden m:inline-block"&gt;
              
                Abhishek J N
                
                
              
              &lt;div id="story-author-preview-content-4777086" class="profile-preview-card__content crayons-dropdown branded-7 p-4 pt-0"&gt;
                &lt;div class="gap-4 grid"&gt;
                  &lt;div class="-mt-4"&gt;
                    &lt;a href="/abhishek_jn_1553cf06a8e7" class="flex"&gt;
                      &lt;span class="crayons-avatar crayons-avatar--xl mr-2 shrink-0"&gt;
                        &lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3962085%2F890adf0e-e8d9-4afa-a456-b4b2c69190af.png" class="crayons-avatar__image" alt="" width="96" height="96"&gt;
                      &lt;/span&gt;
                      &lt;span class="crayons-link crayons-subtitle-2 mt-5"&gt;Abhishek J N&lt;/span&gt;
                    &lt;/a&gt;
                  &lt;/div&gt;
                  &lt;div class="print-hidden"&gt;
                    
                      Follow
                    
                  &lt;/div&gt;
                  &lt;div class="author-preview-metadata-container"&gt;&lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;

          &lt;/div&gt;
          &lt;a href="https://dev.to/abhishek_jn_1553cf06a8e7/chronosyntax-vibe-coding-a-multiversal-anomaly-broadcast-network-with-sanity-app-sdk-autonomous-1m0p" class="crayons-story__tertiary fs-xs"&gt;&lt;time&gt;Sep 30&lt;/time&gt;&lt;span class="time-ago-indicator-initial-placeholder"&gt;&lt;/span&gt;&lt;/a&gt;
        &lt;/div&gt;
      &lt;/div&gt;

    &lt;/div&gt;

    &lt;div class="crayons-story__indention"&gt;
      &lt;h2 class="crayons-story__title crayons-story__title-full_post"&gt;
        &lt;a href="https://dev.to/abhishek_jn_1553cf06a8e7/chronosyntax-vibe-coding-a-multiversal-anomaly-broadcast-network-with-sanity-app-sdk-autonomous-1m0p" id="article-link-4777086"&gt;
          ChronoSyntax: Vibe-Coding a Multiversal Anomaly Broadcast Network with Sanity App SDK &amp;amp; Autonomous Workflows
        &lt;/a&gt;
      &lt;/h2&gt;
        &lt;div class="crayons-story__tags"&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/devchallenge"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;devchallenge&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/sanitychallenge"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;sanitychallenge&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/sanity"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;sanity&lt;/a&gt;
            &lt;a class="crayons-tag  crayons-tag--monochrome " href="/t/ai"&gt;&lt;span class="crayons-tag__prefix"&gt;#&lt;/span&gt;ai&lt;/a&gt;
        &lt;/div&gt;
      &lt;div class="crayons-story__bottom"&gt;
        &lt;div class="crayons-story__details"&gt;
            &lt;a href="https://dev.to/abhishek_jn_1553cf06a8e7/chronosyntax-vibe-coding-a-multiversal-anomaly-broadcast-network-with-sanity-app-sdk-autonomous-1m0p#comments" class="crayons-btn crayons-btn--s crayons-btn--ghost crayons-btn--icon-left flex items-center"&gt;
              

              &lt;span class="hidden s:inline"&gt;Add&amp;nbsp;Comment&lt;/span&gt;
            &lt;/a&gt;
        &lt;/div&gt;
        &lt;div class="crayons-story__save"&gt;
          &lt;small class="crayons-story__tertiary fs-xs mr-2"&gt;
            4 min read
          &lt;/small&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
&lt;/div&gt;

&lt;/div&gt;


&lt;p&gt;Thank You&lt;/p&gt;

</description>
      <category>mlhacks</category>
      <category>devchallenge</category>
      <category>hackathon</category>
    </item>
    <item>
      <title>ChronoSyntax: Vibe-Coding a Multiversal Anomaly Broadcast Network with Sanity App SDK &amp; Autonomous Workflows</title>
      <dc:creator>Abhishek J N</dc:creator>
      <pubDate>Wed, 30 Sep 2026 11:05:22 +0000</pubDate>
      <link>https://dev.to/abhishek_jn_1553cf06a8e7/chronosyntax-vibe-coding-a-multiversal-anomaly-broadcast-network-with-sanity-app-sdk-autonomous-1m0p</link>
      <guid>https://dev.to/abhishek_jn_1553cf06a8e7/chronosyntax-vibe-coding-a-multiversal-anomaly-broadcast-network-with-sanity-app-sdk-autonomous-1m0p</guid>
      <description>&lt;p&gt;This is a submission for the Sanity Challenge, Path Two: Vibe-Code Something Strange&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;What I Built&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;Most headless CMS demos showcase the same predictable pattern: a blog post with a hero image, a title, and a publish date. I wanted to build something strange—something that pushes the concept of "structured content" past marketing websites and into real-time operational software.&lt;br&gt;
I prompted into existence &lt;strong&gt;ChronoSyntax: The Multiversal Anomaly&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;ChronoSyntax reimagines the Sanity Content Lake as the telemetry and containment backbone for an occult research network monitoring dimensional breaches across spacetime.&lt;/p&gt;

&lt;p&gt;Key Capabilities:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;strong&gt;Workflows Modeled as Data (workflow.state):&lt;/strong&gt; Instead of an ordinary status string (status: 'draft' | 'published'), the entire editorial lifecycle is modeled as first-class structured content directly next to the document. Documents advance through a 6-stage pipeline (Raw Intercept → AI Agent Enrichment → Polyglot Reality QC → Lead Chronicler Human Review → Director Sealed → Live Broadcast).&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Autonomous Agent &amp;amp; External Webhooks:&lt;/strong&gt; An AI agent (Agent-Gemini-Theta) autonomously queries incoming intercepts, calculates hazard classes (Safe, Euclid, Keter, Reality-Bending), decrypts occult radio ciphers, and triggers an automated external HTTP webhook to an incident relay before handing off the draft to human archivists.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Custom Studio Input (Video-to-GIF Glitch Synthesizer):&lt;/strong&gt; Replaces generic file uploaders with an interactive canvas frame buffer. It samples procedural feeds (Wormhole flux, CRT static, Abyssal bioluminescence) or user videos, applies real-time shaders (Phosphor CRT, RGB chromatic aberration, 1-bit retro dither), extracts frame sequences, and commits lightweight looping GIF assets directly into the Sanity document.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;The App SDK (Interactive Incident Control Deck):&lt;/strong&gt; Rather than another read-only blog, this custom operational application executes real-time bidirectional mutations against the Content Lake (client.patch, client.create, client.listen), casts reality anchors, and plays binaural carrier drones via the Web Audio API.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Real-time GROQ Query Studio:&lt;/strong&gt; A live in-app GROQ playground with sub-millisecond execution telemetry, projection testing, and instant JSON inspection.&lt;/li&gt;
&lt;/ol&gt;
&lt;h2&gt;
  
  
  &lt;strong&gt;Demo&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;Live Deployed App:&lt;/strong&gt; &lt;br&gt;
&lt;/p&gt;
&lt;div class="crayons-card c-embed text-styles text-styles--secondary"&gt;
    &lt;div class="c-embed__content"&gt;
      &lt;div class="c-embed__body flex items-center justify-between"&gt;
        &lt;a href="https://chronosyntax.ai.studio" rel="noopener noreferrer" class="c-link fw-bold flex items-center"&gt;
          &lt;span class="mr-2"&gt;chronosyntax.ai.studio&lt;/span&gt;
          

        &lt;/a&gt;
      &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;


&lt;p&gt;&lt;strong&gt;Video Walkthrough:&lt;/strong&gt;&lt;br&gt;
  &lt;iframe src="https://www.youtube.com/embed/cxARIY8j9r4" width="710" height="399"&gt;
  &lt;/iframe&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;Screenshots&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6dleccy734tf8z8gv3av.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6dleccy734tf8z8gv3av.png" alt=" " width="799" height="428"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fqbq6qq51gi3yn8vvm95s.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fqbq6qq51gi3yn8vvm95s.png" alt=" " width="799" height="428"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;Code&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;GitHub Repository:&lt;/strong&gt; - &lt;a href="https://github.com/JNAbhishek27/ChronoSyntax-" rel="noopener noreferrer"&gt;https://github.com/JNAbhishek27/ChronoSyntax-&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Core Technologies:&lt;/strong&gt; Sanity Content Lake, GROQ, TypeScript, React 19, Tailwind CSS, Express, Web Audio API, @google/genai (Gemini 3.8 Flash).&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;My Build Process&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;The AI-Native IDE Experience&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;I prompted this application into existence using Google AI Studio Build powered by the Gemini 3.8 Flash model.&lt;br&gt;
Vibe-coding an app of this scope quickly reveals the dividing line between shallow prompting and real software architecture:&lt;br&gt;
Where the AI excelled:&lt;br&gt;
Complex State Modeling: Prompting the state transition rules for workflow.state worked remarkably well. The model quickly grasped that audit history records needed to be append-only arrays with polymorphic actors ({ type: 'agent' | 'human' | 'system', name: string }).&lt;br&gt;
Canvas Shaders: Generating the procedural mathematical routines (Wormhole flux ellipses, Floyd-Steinberg retro dithering, and chromatic aberration displacement) required almost zero manual math tweaking.&lt;br&gt;
GROQ Syntax Interpretation: The model effortlessly wrote valid GROQ queries with projections (*[_type == "anomaly"]{ title, "stage": workflow.currentStage }).&lt;br&gt;
Where the model stumbled &amp;amp; how I course-corrected:&lt;br&gt;
The "Read-Only Blog" Trap: In the initial prompts, the model repeatedly defaulted to building a typical marketing blog—rendering static cards with useEffect(() =&amp;gt; fetch()). I had to aggressively prompt: "No. We are building an App SDK. The frontend must execute bidirectional mutations (client.patch, client.inc, client.create), subscribe to live event streams (client.listen), and allow field operatives to stabilize containment fields in real time."&lt;br&gt;
Sanity v2 vs v3 Schema Confusion: The model initially tried to import legacy Studio v2 schema syntax (export default { name: 'anomaly', type: 'document', ... }). I course-corrected by enforcing the modern Sanity Studio v3 defineType() and defineField() conventions with typed components: { input: VideoToGifInput }.&lt;br&gt;
HTML Hydration Constraints: During interactive rendering, an inner blockquote was initially placed inside a p tag in the editorial write-up, triggering an HTML nesting hydration warning. I caught and unnested the elements cleanly into sibling tags.&lt;br&gt;
Reaching Past the Studio: The Two Bonus Points&lt;br&gt;
Workflows as Data: Traditional status fields (status: string) fail as soon as multiple automated agents and human departments collaborate. By modeling the workflow as a dedicated object alongside the anomaly content, every transition carries its own immutable trail: who triggered it, why, the webhook receipt status, and cryptographic approval hashes.&lt;br&gt;
The App SDK vs. Read-Only Frontend: Turning the frontend into an active operational dashboard proved to be the most satisfying part of the build. Being able to inject a resonance pulse that patches document integrity while simultaneously adjusting Web Audio carrier frequencies proves that structured content can drive interactive experiences far beyond static publishing.&lt;/p&gt;

&lt;h2&gt;
  
  
  Sanity Project Details
&lt;/h2&gt;

&lt;p&gt;Project ID: chronosyntax-lake-vibe (configurable to any live Sanity project via the in-app Settings modal)&lt;br&gt;
Dataset: production&lt;br&gt;
API Version: 2026-03-30&lt;br&gt;
Content Model Summary:&lt;br&gt;
anomaly: Core document storing title, slug, hazard classification, danger score (1-100), containment integrity, quantum carrier frequency (MHz), location, raw intercepts, decrypted ciphers, and attached GIF assets.&lt;br&gt;
workflowState: Embedded state machine containing currentStage, assignedAgent, assignedEditor, webhookLogs array, and an immutable history transition trail.&lt;br&gt;
sanity.imageAsset: Specialized asset payload holding generated GIF frame buffers, dimensions, filter modes, and payload sizes.&lt;/p&gt;

&lt;h2&gt;
  
  
  &lt;strong&gt;Agent Session&lt;/strong&gt;
&lt;/h2&gt;

&lt;p&gt;Model Used: Gemini 3.8 Flash (@google/genai)&lt;/p&gt;

&lt;p&gt;Thank you&lt;/p&gt;

</description>
      <category>devchallenge</category>
      <category>sanitychallenge</category>
      <category>sanity</category>
      <category>ai</category>
    </item>
    <item>
      <title>What If Your Notes Could Talk to Each Other?</title>
      <dc:creator>Abhishek J N</dc:creator>
      <pubDate>Mon, 01 Jun 2026 06:14:23 +0000</pubDate>
      <link>https://dev.to/abhishek_jn_1553cf06a8e7/what-if-your-notes-could-talk-to-each-other-2p4b</link>
      <guid>https://dev.to/abhishek_jn_1553cf06a8e7/what-if-your-notes-could-talk-to-each-other-2p4b</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/github-2026-05-21"&gt;GitHub Finish-Up-A-Thon Challenge&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;What I Built&lt;/strong&gt;&lt;br&gt;
CoralMind is a personal knowledge dashboard that lets you query all your scattered data — Notion notes, PDFs, CSV reading lists, Markdown files — in one place using natural language and SQL.&lt;br&gt;
The idea came from a frustrating reality: knowledge lives in too many places. You write notes in Notion, save papers as PDFs, track reading in spreadsheets, and when you need to connect ideas across them, you're opening five tabs and searching manually. CoralMind solves that with a single query box.&lt;br&gt;
Ask "What did I write about transformer architecture, and which papers back it up?" — and the dashboard streams back an answer that cites your Notion notes and your PDF index simultaneously. That's a cross-source join, powered by Coral's SQL interface, surfaced in plain English.&lt;/p&gt;

&lt;p&gt;The core features:&lt;br&gt;
Natural language queries across all connected sources with streaming AI responses&lt;br&gt;
Source citations on every answer — you always know where the information came from&lt;br&gt;
SQL Explorer with a live editor, cross-source JOIN examples, and auto-generated queries from every AI answer&lt;br&gt;
Add new sources on the fly by pasting any content — immediately queryable, no rebuild needed&lt;br&gt;
Query history, source filtering chips, and a stats panel tracking cache hits&lt;/p&gt;

&lt;p&gt;Built entirely as a single HTML file — no npm install, no build step, no server. Open it in a browser and it works.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Demo&lt;/strong&gt;&lt;br&gt;
Working: &lt;a href="https://youtu.be/SO3g0_2FQKI" rel="noopener noreferrer"&gt;https://youtu.be/SO3g0_2FQKI&lt;/a&gt;&lt;br&gt;
Repo: &lt;a href="https://github.com/JNAbhishek27/CoralMind" rel="noopener noreferrer"&gt;https://github.com/JNAbhishek27/CoralMind&lt;/a&gt;&lt;br&gt;
      follow whats given in ReadMe file&lt;br&gt;
Walkthrough:&lt;br&gt;
Three sources come pre-loaded — Notion research notes, academic PDFs, and a reading stats CSV&lt;br&gt;
Type any question and hit ⌘↵ — the answer streams in real time with [Source Name] citations&lt;br&gt;
Open the SQL Explorer tab to see the Coral cross-source JOIN query auto-generated from your question&lt;br&gt;
Click + Add source, paste your own notes or CSV content, and it's instantly queryable alongside existing sources&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frieil1k33lc4551ijtvr.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Frieil1k33lc4551ijtvr.png" alt=" " width="800" height="441"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;The Comeback Story&lt;/strong&gt;&lt;br&gt;
CoralMind started as a rough idea scribbled during the Coral Hackathon — a concept with no code behind it, just a judging rubric and the question "what would actually win this?"&lt;br&gt;
Where it started: A blank file and a list of features I wasn't sure I could build. The SQL Explorer felt too ambitious. Streaming responses felt like it would require a backend. Cross-source joins felt like hand-waving without Coral's actual infrastructure.&lt;/p&gt;

&lt;p&gt;What changed:&lt;br&gt;
The biggest unlock was deciding to keep it a single HTML file. No framework, no build toolchain, no deployment complexity. That constraint forced every feature to be lean and every interaction to be immediate — which turned out to be a strength, not a limitation.&lt;br&gt;
The streaming implementation was the hardest part to finish. The Groq API returns server-sent events, and parsing the stream cleanly while updating the DOM in real time required getting the reader/decoder loop exactly right. That was the piece that sat half-broken the longest.&lt;br&gt;
The SQL auto-generation — where every AI answer produces the equivalent Coral SQL query below it — was added late and ended up being the feature that ties the whole project together. It makes the Coral connection tangible and educational.&lt;br&gt;
What got finished:&lt;/p&gt;

&lt;p&gt;Streaming AI responses with proper SSE parsing&lt;br&gt;
Cross-source context bundling with per-source citations&lt;br&gt;
SQL Explorer with syntax highlighting and runnable example queries&lt;br&gt;
Live source indexing via the Add Source modal&lt;br&gt;
Full GitHub repo with README, .gitignore, .env.example, and MIT license&lt;/p&gt;

&lt;p&gt;The project went from concept → working demo → documented, shareable repo. That arc is what the Finish-Up-A-Thon is about.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;My Experience with GitHub Copilot&lt;/strong&gt;&lt;br&gt;
Copilot was most useful in the places where I knew what I wanted but not exactly how to write it.&lt;br&gt;
The SQL syntax highlighter is a good example. I knew I wanted keywords like SELECT, JOIN, and UNION ALL to render in a different colour inside a &lt;/p&gt;
&lt;pre&gt; block. Writing the regex replacements for every keyword by hand would have been tedious and error-prone. Copilot autocompleted the keyword array and the replace chain from the first two lines — saving probably 20 minutes of lookup and testing.&lt;br&gt;
The same happened with the SSE stream parser. Once I wrote the reader.read() loop and the first if (line.startsWith('data: ')) check, Copilot filled in the [DONE] guard, the try/catch around JSON.parse, and the delta extraction — all the boilerplate that surrounds the one line that actually matters.&lt;br&gt;
Where Copilot didn't help — and wasn't supposed to — was in the product decisions. Which features to cut, how to structure the judging-criteria story, what the SQL Explorer tab should actually do. Those required thinking through the problem, not autocompleting it.&lt;br&gt;
The honest summary: Copilot handled the mechanical parts so I could stay focused on the parts that required actual judgment. For a solo hackathon build where time is the constraint, that trade-off is exactly right.

&lt;p&gt;This is a Solo project&lt;/p&gt;

&lt;p&gt;Thank You&lt;/p&gt;

&lt;/pre&gt;

</description>
      <category>devchallenge</category>
      <category>githubchallenge</category>
    </item>
  </channel>
</rss>
