<?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: Siddiqui Qamar</title>
    <description>The latest articles on DEV Community by Siddiqui Qamar (@qamar_dev_01).</description>
    <link>https://dev.to/qamar_dev_01</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%2F3793905%2F8151d452-67b0-4bca-ac94-5a8295e643cc.png</url>
      <title>DEV Community: Siddiqui Qamar</title>
      <link>https://dev.to/qamar_dev_01</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/qamar_dev_01"/>
    <language>en</language>
    <item>
      <title>I Vibe-Coded an App for a $3,000 Hackathon. It Was Complete Slop 🫠</title>
      <dc:creator>Siddiqui Qamar</dc:creator>
      <pubDate>Thu, 16 Jul 2026 06:56:42 +0000</pubDate>
      <link>https://dev.to/qamar_dev_01/i-vibe-coded-an-app-for-a-3000-hackathon-it-was-complete-slop-146i</link>
      <guid>https://dev.to/qamar_dev_01/i-vibe-coded-an-app-for-a-3000-hackathon-it-was-complete-slop-146i</guid>
      <description>&lt;p&gt;In January 2026, I vibe-coded a Streamlit app to analyze dozens to hundreds of GitHub profiles in a single click. We all know GitHub provides their REST API, so the only thing remaining was to open Claude Code and pass the prompt. Run the app, and it worked. Easy peasy.&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;&lt;em&gt;(P.S. This was my submission for a $3,000 hackathon, but the problem is real: how would you analyze that many profiles?👀)&lt;/em&gt;&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;But deep down, I knew the codebase was total slop. It felt like a house of cards that could crash at any second.&lt;/p&gt;

&lt;p&gt;Things that were completely missing are:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Zero error handling:&lt;/strong&gt; If one API call failed or hit a rate limit, the whole run died.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;The UI freeze:&lt;/strong&gt; If you passed 50 profiles, you had to stare at a frozen screen. There was no progress bar, leaving you guessing if the app crashed silently or was just slow.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;Sequential processing:&lt;/strong&gt; It ran one profile at a time. There was no parallel processing or async, making bulk runs painfully slow.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;No batching:&lt;/strong&gt; It was all or nothing.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;&lt;strong&gt;No safety nets:&lt;/strong&gt; No unit tests, no stop/resume buttons, and no way to export the partial data if you wanted to stop early.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Upgrading vibe code to real engineering
&lt;/h2&gt;

&lt;p&gt;Since I now knew exactly what was missing and how to fix it, it was time to open the Claude Code window again.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Here is what changed:&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;Implemented parallel workers to fetch profile data concurrently, cutting down wait times significantly.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Added proper batch processing with real-time UI updates so you actually know where the queue stands.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Wrapped the API calls in robust error handling. If one profile fails, the app skips it, logs the error, and keeps moving.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Added controls to pause or stop a bulk run mid-way and instantly export whatever data had already been processed to a CSV.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The difference after implementing these changes was fabulous. The app didn't just get faster; it felt incredibly reliable and professional to use. My mentor always tells me: "&lt;em&gt;There’s always a chance to improve and make it perfect later, but it should be done first.&lt;/em&gt;"&lt;/p&gt;

&lt;p&gt;The repository is open-source. You can check out the refactored code directly by clicking &lt;a href="https://github.com/siddqamar/github-profile-screening" rel="noopener noreferrer"&gt;here&lt;/a&gt; ⭐️&lt;/p&gt;

&lt;p&gt;BTW, I didn't win that hackathon, but the learning I gained throughout the process was epic.&lt;/p&gt;

</description>
      <category>hackathon</category>
      <category>vibecoding</category>
      <category>showdev</category>
      <category>llm</category>
    </item>
    <item>
      <title>Save yourself from drowning in feeds 🚩</title>
      <dc:creator>Siddiqui Qamar</dc:creator>
      <pubDate>Thu, 09 Jul 2026 08:12:16 +0000</pubDate>
      <link>https://dev.to/qamar_dev_01/save-yourself-from-drowning-4e67</link>
      <guid>https://dev.to/qamar_dev_01/save-yourself-from-drowning-4e67</guid>
      <description>&lt;p&gt;Dev.to is an absolute goldmine. On any given day, thousands of builders share brilliant engineering lessons, launch side projects, break down new AI models, or submit hackathon entries.&lt;/p&gt;

&lt;p&gt;The problem is that this massive amount of information is hard to process.&lt;/p&gt;

&lt;p&gt;We want to stay updated with the fellow builder community, but nobody has the time to click through fifty long posts just to see what someone built and why it matters.&lt;/p&gt;

&lt;p&gt;So, I vibe-coded an internal tool called Dev.to ASSISTANT and decided to open-source it.&lt;/p&gt;

&lt;h2&gt;
  
  
  See it in action 🎬
&lt;/h2&gt;

&lt;p&gt;Instead of explaining it, here is the tool turning the noise into a clean, structured summary in real-time:&lt;/p&gt;

&lt;p&gt;  &lt;iframe src="https://www.youtube.com/embed/lYFAGLiIatg"&gt;
  &lt;/iframe&gt;
&lt;/p&gt;

&lt;h2&gt;
  
  
  From Infinite Scroll to Instant Value
&lt;/h2&gt;

&lt;p&gt;The goal isn't to skip reading—it's to figure out exactly where to dive deep.&lt;/p&gt;

&lt;p&gt;When you pass the assistant a tag (like &lt;code&gt;#weekendchallenge&lt;/code&gt; or &lt;code&gt;#ai&lt;/code&gt;), it uses a &lt;strong&gt;Gemma 4&lt;/strong&gt; layer to extract the meat of each post. You instantly get:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;The exact "why" and "how" behind the project, stripped of fluff.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;What tools, frameworks, or models were used.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Live reaction and comment counts so you can see what's sparking conversation.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;A link right back to the original Dev.to post so you can jump in and engage with the author.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Built with the Community, For the Community
&lt;/h2&gt;

&lt;p&gt;Because Dev.to is an open ecosystem that generously provides an official API, I wanted to build this in that exact same spirit.&lt;/p&gt;

&lt;p&gt;The backend is built with Python (FastAPI) and the frontend dashboard uses Next.js. I’ve made the entire project completely open-source so any builder can run it locally, tweak the filters, or add new curation features.&lt;/p&gt;

&lt;p&gt;If you want to discover great engineering lessons faster, track challenge submissions, or just find amazing people to follow without getting lost in the feed, give it a spin.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/siddqamar/dev.to-assistant"&gt;Check out the GitHub repository here&lt;/a&gt; ⭐️&lt;/p&gt;

&lt;p&gt;If this tool helps you find a cool repository or saves you some scroll time, I’d love to hear your thoughts in the comments below!&lt;/p&gt;

</description>
      <category>opensource</category>
      <category>gemma</category>
      <category>vibecoding</category>
      <category>ai</category>
    </item>
    <item>
      <title>I Built an AI Second Brain with Gemma 4</title>
      <dc:creator>Siddiqui Qamar</dc:creator>
      <pubDate>Sun, 24 May 2026 17:47:38 +0000</pubDate>
      <link>https://dev.to/qamar_dev_01/i-built-an-ai-second-brain-with-gemma-4-5370</link>
      <guid>https://dev.to/qamar_dev_01/i-built-an-ai-second-brain-with-gemma-4-5370</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/google-gemma-2026-05-06"&gt;Gemma 4 Challenge: Build with Gemma 4&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

&lt;h1&gt;
  
  
  Brain Dump — AI That Connects Your Knowledge
&lt;/h1&gt;

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

&lt;p&gt;Brain Dump is a second brain that turns scattered personal data into a searchable memory layer.&lt;/p&gt;

&lt;p&gt;Users can capture notes, URLs, PDFs, screenshots, audio, video, and project files. The system extracts content, transcribes media with Whisper, builds embeddings, and enables semantic search across the entire knowledge base.&lt;/p&gt;

&lt;p&gt;Instead of remembering filenames or folders, users can search naturally and retrieve the right context instantly.&lt;/p&gt;

&lt;h3&gt;
  
  
  Key Features
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;Semantic search across mixed-format content&lt;/li&gt;
&lt;li&gt;Whisper-powered transcription&lt;/li&gt;
&lt;li&gt;AI-generated summaries and insights&lt;/li&gt;
&lt;li&gt;Memory connections + lightweight knowledge graph&lt;/li&gt;
&lt;li&gt;SQLite-based MVP with production-ready migration path to Postgres + pgvector&lt;/li&gt;
&lt;/ul&gt;




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

&lt;p&gt;Video walkthrough coming soon.&lt;/p&gt;




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

&lt;p&gt;Repository:&lt;br&gt;&lt;br&gt;
&lt;a href="https://github.com/siddqamar/brain-dump" rel="noopener noreferrer"&gt;https://github.com/siddqamar/brain-dump&lt;/a&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  How I Used Gemma 4
&lt;/h2&gt;

&lt;p&gt;Brain Dump uses &lt;code&gt;gemma-4-26b-a4b-it&lt;/code&gt; through Google AI Studio API for contextual summarization and insight generation.&lt;/p&gt;

&lt;p&gt;I chose the &lt;code&gt;26B A4B&lt;/code&gt; model because it provided a strong balance between reasoning quality, speed, and practical deployment for a hackathon-scale product.&lt;/p&gt;

&lt;p&gt;Gemma powers:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Memory summarization&lt;/li&gt;
&lt;li&gt;Context extraction&lt;/li&gt;
&lt;li&gt;Insight generation&lt;/li&gt;
&lt;li&gt;Relationship discovery between captured knowledge&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The goal was to combine local knowledge management with modern AI retrieval workflows in a lightweight and developer-friendly MVP.&lt;/p&gt;

</description>
      <category>devchallenge</category>
      <category>gemmachallenge</category>
      <category>gemma</category>
    </item>
    <item>
      <title>Using Notion to Turn Reading Sessions Into a Searchable Knowledge System</title>
      <dc:creator>Siddiqui Qamar</dc:creator>
      <pubDate>Sun, 29 Mar 2026 17:47:16 +0000</pubDate>
      <link>https://dev.to/qamar_dev_01/using-notion-to-turn-reading-sessions-into-a-searchable-knowledge-system-2g59</link>
      <guid>https://dev.to/qamar_dev_01/using-notion-to-turn-reading-sessions-into-a-searchable-knowledge-system-2g59</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/notion-2026-03-04"&gt;Notion MCP Challenge&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

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

&lt;p&gt;I built Reader’s Companion, a Chrome extension that turns online reading into something actually useful.&lt;/p&gt;

&lt;p&gt;The idea came from a super common problem: you’re reading something valuable — a research paper, a long-form blog, documentation, even an ebook in the browser — and the moment you want to save something important, your focus breaks. You start switching tabs, copying text into notes, saving screenshots to nowhere, or telling yourself you’ll come back to it later.&lt;/p&gt;

&lt;p&gt;And yeah… later never comes.&lt;/p&gt;

&lt;p&gt;Reader’s Companion fixes that by making capture part of the reading flow itself.&lt;/p&gt;

&lt;p&gt;So instead of treating reading and note-taking as two separate tasks, this makes them feel like one smooth workflow.&lt;/p&gt;

&lt;p&gt;You can check out the code here:&lt;/p&gt;

&lt;p&gt;[&lt;a href="https://github.com/siddqamar/readers-companion.git" rel="noopener noreferrer"&gt;https://github.com/siddqamar/readers-companion.git&lt;/a&gt;]&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;How I Used Notion MCP&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Notion is the core destination for the whole experience.&lt;/p&gt;

&lt;p&gt;I used Notion MCP as the bridge that turns the extension from a simple capture tool into something that fits into a real workflow.&lt;/p&gt;

&lt;p&gt;That means Notion becomes more than a storage layer. It becomes the place where reading turns into usable knowledge.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Closing Thought&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;A lot of tools help you collect information.&lt;/p&gt;

&lt;p&gt;I wanted to build one that helps you stay in flow while doing it.&lt;/p&gt;

&lt;p&gt;That is what Reader’s Companion is really about.&lt;/p&gt;

</description>
      <category>devchallenge</category>
      <category>notionchallenge</category>
      <category>mcp</category>
      <category>ai</category>
    </item>
    <item>
      <title>A skill that builds ATS friendly Resumes from terminal directly</title>
      <dc:creator>Siddiqui Qamar</dc:creator>
      <pubDate>Mon, 02 Mar 2026 17:02:59 +0000</pubDate>
      <link>https://dev.to/qamar_dev_01/a-skill-that-builds-ats-friendly-resumes-from-terminal-directly-2mbp</link>
      <guid>https://dev.to/qamar_dev_01/a-skill-that-builds-ats-friendly-resumes-from-terminal-directly-2mbp</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/weekend-2026-02-28"&gt;DEV Weekend Challenge: Community&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  The Community
&lt;/h2&gt;

&lt;p&gt;This is built for developers who prefer terminal-first workflows and want a resume that actually survives ATS screening. A lot of devs have solid skills and projects, but their resumes get filtered out before any human sees them because of formatting, structure, or missing keywords. I wanted to solve that problem where developers are most comfortable: the CLI.&lt;/p&gt;

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

&lt;p&gt;A Resume Builder Skill for Gemini CLI that automates three core workflows:&lt;br&gt;
1) Build a clean resume from a single master JSON “source of truth”&lt;br&gt;
2) Transform content into ATS-friendly structure using defined standards&lt;br&gt;
3) Personalize the resume to a specific Job Description by extracting key requirements and aligning the resume accordingly&lt;/p&gt;

&lt;p&gt;It also supports exporting the final resume as PDF or PNG.&lt;/p&gt;

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

&lt;p&gt;[Add your demo video link here]&lt;br&gt;
[&lt;a href="https://dev.to/qamar_dev_01/a-skill-that-builds-ats-friendly-resumes-and-actually-matches-the-jd-pmc"&gt;https://dev.to/qamar_dev_01/a-skill-that-builds-ats-friendly-resumes-and-actually-matches-the-jd-pmc&lt;/a&gt;]&lt;/p&gt;

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

&lt;p&gt;[&lt;a href="https://github.com/siddqamar/resume-builder-skill.git" rel="noopener noreferrer"&gt;https://github.com/siddqamar/resume-builder-skill.git&lt;/a&gt;]&lt;/p&gt;

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

&lt;p&gt;I build this using Gemini CLI by describing the problem statement and use built-in web search capabilities. The skill is implemented as a CLI agent skill with a structured, repeatable workflow:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;code&gt;references/master_resume.json&lt;/code&gt; acts as the canonical resume data source&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;references/ats_standards.md&lt;/code&gt; contains ATS optimization and formatting rules&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;assets/templates/resume_markdown.md&lt;/code&gt; defines the output structure&lt;/li&gt;
&lt;li&gt;
&lt;code&gt;SKILL.md&lt;/code&gt; contains the skill instructions and triggers&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Users interact with it through natural language prompts inside Gemini CLI, for example:&lt;br&gt;
&lt;code&gt;@resume-builder personalize my resume for this Job Description: [Paste JD here]&lt;/code&gt;&lt;/p&gt;

</description>
      <category>devchallenge</category>
      <category>weekendchallenge</category>
      <category>showdev</category>
    </item>
    <item>
      <title>A skill that builds ATS friendly Resumes (and actually matches the JD)</title>
      <dc:creator>Siddiqui Qamar</dc:creator>
      <pubDate>Mon, 02 Mar 2026 15:01:40 +0000</pubDate>
      <link>https://dev.to/qamar_dev_01/a-skill-that-builds-ats-friendly-resumes-and-actually-matches-the-jd-pmc</link>
      <guid>https://dev.to/qamar_dev_01/a-skill-that-builds-ats-friendly-resumes-and-actually-matches-the-jd-pmc</guid>
      <description>&lt;p&gt;If you’ve ever applied to a role you were clearly qualified for and still got nothing back, there’s a decent chance that your resume didn't pass the initial screening process.&lt;/p&gt;

&lt;p&gt;Most resumes get screened by ATS before a recruiter sees them. If your formatting breaks parsing, your keywords don’t match the job description, or your structure isn’t predictable, your resume can get filtered out silently. No feedback. &lt;/p&gt;

&lt;p&gt;That’s the gap I wanted to fix but in a way that fits how developers actually work.&lt;/p&gt;

&lt;h2&gt;
  
  
  Why a CLI skill, not another resume website?
&lt;/h2&gt;

&lt;p&gt;Because developers live in the terminal.&lt;/p&gt;

&lt;p&gt;We automate build steps, package releases, manage infra, ship code and then we’re supposed to open a drag-and-drop resume builder and fight PDF formatting like it’s 2009? Nah.&lt;/p&gt;

&lt;p&gt;So I built a skill that lets you build, optimize, and tailor your resume without leaving your Gemini CLI.&lt;/p&gt;

&lt;h2&gt;
  
  
  The core design is simple
&lt;/h2&gt;

&lt;p&gt;Your resume data should not live inside ten different documents.&lt;/p&gt;

&lt;p&gt;Instead, it lives in one place, a master JSON file and the skill generates the output from that every time. That means updating your resume becomes a real dev workflow: change the source, regenerate, done.&lt;/p&gt;

&lt;h2&gt;
  
  
  What it actually does
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;p&gt;First, it can generate a clean resume from your master data consistent structure, predictable headings, readable layout.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Second, it can transform your resume to be ATS-friendly, using a standards file that controls formatting rules and keyword optimization logic. No guessing what ATS wants. The rules live in the repo, and you can tweak them.&lt;/p&gt;&lt;/li&gt;
&lt;li&gt;&lt;p&gt;Third (and this is the fun one), it can personalize your resume for a specific job description. You paste the JD, it extracts the important skills/requirements, and aligns your resume content accordingly emphasizing relevant experience and language without you manually rewriting the whole thing every time.&lt;/p&gt;&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;That’s basically “resume tailoring” but as a deterministic workflow.&lt;/p&gt;

&lt;h2&gt;
  
  
  Usage: it’s meant to feel natural
&lt;/h2&gt;

&lt;p&gt;I didn’t want it to feel like a tool with 30 flags. You trigger it like you’d talk to an agent:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;@resume-builder personalize my resume for this job description: [paste JD]
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;Or if you’re updating your master profile:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;@resume-builder add my new role as Senior Developer at X to my master resume
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Why I think this helps the community
&lt;/h2&gt;

&lt;p&gt;There are devs with real skills and real projects who lose opportunities because their resume is structured in a way machines don’t like. That’s not a talent problem that’s a tooling problem.&lt;/p&gt;

&lt;p&gt;This skill is my attempt to make resume building feel like what it should’ve always been for developers: &lt;strong&gt;structured data&lt;/strong&gt; → &lt;strong&gt;repeatable outputs&lt;/strong&gt; → &lt;strong&gt;easy tailoring&lt;/strong&gt;.&lt;/p&gt;

</description>
      <category>weekendchallenge</category>
    </item>
    <item>
      <title>How I vibe coded a chrome extension using YOLO mode</title>
      <dc:creator>Siddiqui Qamar</dc:creator>
      <pubDate>Thu, 26 Feb 2026 09:49:51 +0000</pubDate>
      <link>https://dev.to/qamar_dev_01/how-i-vibe-coded-a-chrome-extension-using-yolo-mode-4j75</link>
      <guid>https://dev.to/qamar_dev_01/how-i-vibe-coded-a-chrome-extension-using-yolo-mode-4j75</guid>
      <description>&lt;p&gt;So, I took the famous 2048 puzzle game and decided to recreate it myself. Not for production, just an experiment to see how YOLO mode actually handles a full build when you stop micro-managing the coding agent.&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%2Foi4bga348yq9b9429te7.gif" 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%2Foi4bga348yq9b9429te7.gif" alt=" " width="397" height="526"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p&gt;Pro-tip: If you’re going to run YOLO mode, do it in a sandbox.&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p&gt;I used the Gemini CLI to vibe code the whole thing with Gemini 3 Pro for development.&lt;/p&gt;

&lt;p&gt;Here’s exactly how it went down:&lt;/p&gt;

&lt;h2&gt;
  
  
  1. Start YOLO mode
&lt;/h2&gt;

&lt;p&gt;This is like giving the permission to do whatever it takes to get the work done. It&amp;nbsp;can execute commands, create files, and iterate without asking for a "Yes/No" confirmation at every line of code.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;gemini --yolo
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  2. The Visual Prompt
&lt;/h2&gt;

&lt;p&gt;Instead of typing out a massive spec, I just took a screenshot of the original 2048 game and pasted it directly into the terminal. Let the model review the UI so it actually understood the spatial logic before it started development.&lt;/p&gt;

&lt;h2&gt;
  
  
  3. The Context Loop
&lt;/h2&gt;

&lt;p&gt;Now here the prompting skills comes in. See the example below how I started:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;I want to recreate this game as a chrome extension... explain briefly.&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;And let the gemini ask me the follow-up questions. This ensured it actually grasped the requirements and manifest v3 constraints before it wrote a single line.&lt;/p&gt;

&lt;h2&gt;
  
  
  4. Ninja technique for vibe coding
&lt;/h2&gt;

&lt;p&gt;Once the context was set, I had the terminal to create &lt;code&gt;GEMINI.md&lt;/code&gt; and divide the whole development into easy achievable tasks and save it to &lt;code&gt;TODO.md&lt;/code&gt;.&lt;/p&gt;

&lt;p&gt;Having these files meant the agent always had a "&lt;em&gt;source of truth&lt;/em&gt;" to look back at. It stayed on the plan regardless of what happened to the session.&lt;/p&gt;

&lt;h2&gt;
  
  
  5. Let Gemini Cook
&lt;/h2&gt;

&lt;p&gt;At this point, I just sat back. The model handled the grid logic, the tile merging, and the extension packaging.&lt;/p&gt;

&lt;p&gt;Wanna see code? &lt;a href="https://github.com/siddqamar/2048-chrome-ext-rebuilt.git" rel="noopener noreferrer"&gt;Here's GitHub repo ⭐️&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion:
&lt;/h2&gt;

&lt;p&gt;This is the first time I built any chrome extension. The game works perfectly. It’s smooth, the logic is tight, and honestly I enjoyed the process.&amp;nbsp;While I still need to add a memory layer so it remembers your state when you close the extension.&lt;/p&gt;

</description>
      <category>opensource</category>
      <category>showdev</category>
      <category>vibecoding</category>
      <category>gemini</category>
    </item>
  </channel>
</rss>
