Building a AI Enabled Blog Editor

Recently, I've started writing a blog on my personal website, on topics related to AI. People have questioned if blogs are still relevant in 2025 in the age of AI, and I'll refer to this recent post on hacker news which outlines why I think it's a good idea.

Currently, I'm exploring different tools and ways to host my blog. In my developer setup, the AI tools have greatly helped me be more efficient, and write better code. In my blog editing setup, I'd like to achieve the same thing.

So far, I've tried google docs + gemini, notion (with their notion ai), as well as chatGPT and Claude. I've also tried editing markdown directly in cursor, using copilot, but they've all had some limitations.

• ChatGPT and Claude tends to write in a generic style erases my personal tone of voice. I don't want to create "AI slop", I just want to write more efficiently.
• Notion's AI was similar, it just didn't feel quite effective.
• Cursor is just heavily optimized for coding, and not writing. Some things worked, but it was definitely a hack.

Building My Own Tool

Instead of spending more time looking for better tools, I've decided to try to create a tool to help me out. I'm looking for:

1. A simple editor that writes markdown. This way I can easily copy-paste it to different surfaces like notion, google docs, wordpress, etc.
2. AI features that don't replace me as a writer. I'm not trying to auto-generate SEO spam, and I'm not trying to make the dead internet theory a reality.
3. AI features that improve the speed at which I can write.** Echoing the point above, I want copilot features. Here I'm envisioning things like suggestions and automated research.

This blog post is currently being written via this tool - at the moment, I've set up a markdown editor using mdxEditor, and a nextJS project. I spent some time figuring out how to setup the editor, paste images into the editor, and I've also added a placeholder AI tools component, which currently does nothing:

This gets me done with my first goal:

• A simple editor that writes markdown.

Getting a Bit Meta

• After pasting the image above, I noticed that the editor started lagging a bit. This is because I'm creating base64 image strings instead of uploading the pasted images to my server. To fix this, I switched to uploading images on paste, and storing them in vercel's blob store.

First AI Feature: Finding reference sources

Often, when I'm writing a blog post I have a few sources in my head that I want to reference. For example, for this current post, there's a HN blog post about writing blog posts (yes I know, this is getting meta), that I remember seeing. There's also a reference to the MDXEditor, which I should probably link to.

Traditionally, I'd have to do some research in order to find this post, and then embed the link in the blog at the right place. Even though this might only take a few minutes, it adds up. If I have a dozen sources that I want to reference, and each reference takes 1-5 minutes to find, it can take me anywhere from 10 minutes to an hour to find sources!

I like this feature because it aligns with my goals #2 and #3 - it doesn't replace my writing at all, and it improves the speed at which I can write.

Designing the feature

From the UX perspective, I want a simple way to use this tool. I decided a tool panel next to the main editing area should be effective. Since I'm not a Designer, I'll try to keep this simple, and move on to the AI system design - the area which is my expertise.

Here's how I will design the AI components:

1. First, I'll define the data structures.
   1. Suggested Source Topics: Given my blog content, I need to generate a list of suggested topics or queries that I want to search for. For example, so far in this blog this list could include:
      • MDXEditor, or markdown editors
      • AI slop
      • ChatGPT
      • Hacker news post on blogging
   2. Sources: These are the actual sources that my AI will find on the internet. I should be able to find more sources than I need, and select which ones I want to insert. Each source should consist of a URL, a "why this URL" description, and a source topic which comes from the list above.
   3. Reference Insert Suggestion: This should be a list of suggested references that the AI suggests we insert. It should use the sources defined above, and suggest a location in the blog to insert the reference.
      • for now, I'll skip this and just manually insert the references.

What I like about this design is that it gives the control to the author - there isn't any risk of hallucination, because the author can see immediately what the source is. We can also automatically ensure that URLs are valid.

Implementation

To implement this, I use Zod + Instructor to define my data structures, Perplexity to do the research, and GPT4o to generate the structured suggestions.

After a couple hours of work and cursor magic, I managed to get this working, and the results are good! I was able to find the original blog post I was thinking of that I saw on hacker news, as well as get good suggestions for other sources. Perplexity is doing most of the heavy lifting here.

Conclusion

I've decided that I'm at a good stopping point. I'm pretty happy with the result of the tool, and this blog post is also the output of the result. This blog post was completely written inside the tool, and every reference was found using the AI tool within the tool.

I think I'll continue working on this and make a part two in the future.

Some ideas for future features include:

• Improving UX
• Adding a "proofread" function
• Adding autocomplete feature
• highlight a passage -> start search
• Adding Images - image search and/or imagegen

If you're interested in trying out the tool, reach out to me on x. The perplexity API isn't cheap, and I don't want to be met by the death of hackernews by allowing free access to the tool.

Cheers.