My First Time with Cursor AI: Building an Obsidian Plugin from Scratch
Published: 31/03/2025 at 11:15
I recently stumbled upon a video about “vibe” coding and, at first, dismissed it as hype. I’ve been a software developer for a decade, so I believed I wouldn’t need any extra help. But when I started playing around with the Cursor AI assistant, it completely changed my perspective.
Tackling the Obsidian Image-Paste Problem I’ve always found it frustrating that Obsidian doesn’t automatically handle images the way I want. Whenever I copy an image from the web, I have to:
- Download the file to my computer.
- Place it in my attachments folder.
- Manually create the Markdown link to embed it in my note.
This extra work breaks my creative flow, especially when I’m trying to quickly add visual references to my notes. That’s why I decided to build the Image Embedder plugin: a tool that automatically detects copied images, downloads them, and embeds them in one swift go.
First Prompt
In my first prompt, I made sure to highlight two key points:
- The main idea: I want a plugin that automates image downloading and embedding in Obsidian.
- The plugin’s core functionalities: It should detect when an image is pasted, download it, and insert the appropriate Markdown link.
Here’s the example prompt (with a bit of help from ChatGPT):
I'm building an Obsidian plugin called **Image Embedder** (repo: `obsidian-image-embedder`). The goal of this plugin is:
I just cloned this repo in Cursor and I'm still new to it.
Now I want to:
1. Use [obsidian-sample-plugin](https://github.com/obsidianmd/obsidian-sample-plugin) as a starting point
2. Understand the basic structure of a plugin (what each file does)
3. Clean up or rename the template code to fit my project
4. Start adding settings (toggle confirm, show path, etc.)
Can you guide me through:
- The purpose of each file in the sample plugin?
- What I should rename (class name, plugin ID, etc.)?
- How to add my own plugin settings?
After that, we’ll move on to implementing the paste-detection + image download part.
Implementation Steps
Cursor AI responded by creating some initial files and explaining each one. It also listed the next steps:
The plugin is now set up with:
✅ Proper naming (ImageEmbedderPlugin, image-embedder)
✅ Basic settings structure
✅ Event listener for paste events (skeleton)
Next steps would be:
1. Implement the paste handler to detect image URLs
2. Add image downloading functionality
3. Create the file embedding logic
4. Add confirmation dialog and success notifications
Would you like me to start implementing any of these next steps?
I then asked it to create regression tests after every new feature. Testing is crucial to make sure each change doesn’t break existing functionality. Plus, it allows you to roll back or fix issues quickly. Always commit after each successful test run!
Conclusion
I’ve been really inspired by AI and the innovations emerging around automated coding. Do I think non-technical people could develop a fully functioning application without any help? Probably not—there are still moments when AI doesn’t find the right answer and gets stuck in a loop. But I’m excited to see how AI tools like Cursor will continue improving.
If you’re not a developer, you can still try using AI tools to accelerate your learning. However, if your goal is to master programming, you’ll need to build your own apps, make mistakes, and learn the fundamentals.
Repository: github.com/sky150/obsidian-image-embedder
Repsitory: https://github.com/sky150/obsidian-image-embedder