From Zero to MindMaps... Without Writing a Single Line of Code? 🤯
Tags: python, ai, beginners, api
Published: 2024-06-12 15:35:10


[The code write by our AI overlords](https://github.com/Red-54/MindMap)

I'll admit it – I’m a lazy programmer at heart.  So when I saw that viral video where some genius used OpenAI to whip up an app without coding, my inner sloth rejoiced. Could I pull off the same magic with Google’s Gemini and avoid the drudgery of typing? 

Challenge accepted! My mission: **build a web app that could magically transform dull documents into beautiful MindMaps, all with the help of AI.**  No coding experience required… right?

**Round 1:  "Hello World," Says Gemini (and a Mountain of Errors) 💪**

Armed with a blank text file and the unyielding optimism of someone who’s never actually built a web app, I summoned Gemini into my coding arena (aka my chat window).

> “Hey Gemini, my brilliant AI friend, let’s make a Flask app where people can upload documents, and you, with your infinite wisdom, will turn them into glorious Mermaid mindmaps!”

Gemini, bless its silicon soul, responded with a torrent of code snippets, helpful explanations (or so I thought at the time), and a Flask app skeleton. “Cool,” I thought, naively. “This AI stuff is easy!”  

**Round 2:  The Encoding Labyrinth of Doom 🤯**

The honeymoon phase was short-lived.  My first boss battle?  Encoding.  Gemini dutifully generated Mermaid code, but `mermaid.ink`, the online rendering service I was using, kept spitting back errors. 

"Invalid encoded code!" it screamed. "Bad Request!"

Turns out, Base64 encoding wasn't enough. We ventured into the treacherous realm of URL-safe encoding, battled mysterious "pako:" strings from the Mermaid Live Editor, and I swear I saw a hex editor flash before my eyes.

**Round 3: Mermaid Syntax:  Where Spaces Are Deadly Weapons ⚔️**

Mermaid diagrams, those elegant visualizers of information, are beautiful… until they're not.  Gemini and I spent an eternity (or at least what felt like it) wrangling Mermaid's finicky syntax:

- Missing spaces around arrows: "400 Bad Request!"
- Extra spaces around arrows: "400 Bad Request!"
- The `graph LR` directive:  A mystical incantation that sometimes worked and sometimes didn't.  

I began to suspect that Mermaid was sentient and enjoyed tormenting me.

**Round 4:  The Phantom "Syntax Error" Image 👻**

Just when we thought victory was near, a new terror emerged:  the dreaded "Syntax error in text" image.  But wait… Gemini was now generating perfectly valid Mermaid code!  What dark sorcery was this?!

![Syntax Error Image Generated by Mermaid Ink](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4dnaalj0aidek4r986f8.png)


Enter the villain: browser caching! My browser, like a stubborn mule, refused to let go of the old, error-ridden image. Clearing the cache and performing hard refreshes became my new mantra.
 

**The Result: A Frankensteinian MVP 🧟‍♂️**

Bruised, battered, but not entirely broken, I emerged from the AI coding gauntlet with a working app!  It was a Frankensteinian creation, cobbled together with duct tape and Gemini's digital sweat.  
A diagram that was generated:-

![A Mind Map generated from file containing some theory on AI](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t9ctsx0foerrb6qgsbuh.png)

The UI was hideous, performance was slower than a snail in molasses, and I still had nightmares about encoding.  But it functioned!  And I hadn’t written a single line of “real” code. 

![Hideous UI of my App](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/nzqwnroast7lequqahw9.png)



**Lessons Learned from the AI-pocalypse:**

- **AI is a powerful tool:**  Gemini's ability to generate code, explain concepts, and assist with debugging was impressive. 
- **Human skills still matter:**  Clear communication, problem-solving, and the ability to understand (and fix!) code are essential.  
- **Patience is a virtue:** When working with AI, be prepared for unexpected errors, cryptic messages, and a whole lot of head-scratching. 

**The Quest Continues... Manually!**

Now, armed with newfound (and hard-won) knowledge, I'm embarking on a new quest: rebuilding this app from scratch, using my own coding skills.  Will I be able to create a better, more refined version?  And how will the time and effort compare to the AI-assisted approach?