DEV Community: Sagar Budhathoki

Free forever is an architecture, not a pricing decision

Sagar Budhathoki — Thu, 09 Jul 2026 10:42:22 +0000

I built a recipe keeper called Recipe Jar. You paste a recipe link, it gives you a clean card with just the ingredients and steps, and you can save as many recipes as you want. No account, no ads, works offline, free forever.

That last part, "free forever," is usually where you should get suspicious. I get suspicious too. Every "free" recipe tool I tried eventually capped saved recipes at 20 or 40 and asked for money past that, which is fair, they have a database to pay for. So when I say free forever, the honest question is: what is the catch, and what happens when the bills come due?

The answer is that there are no bills, because there is almost nothing to run. That is not a promise about my intentions. It is a property of how the thing is built. This post is about that.

Demo GIF:

The whole app is your browser

Recipe Jar has no application server and no database. Your recipes live in your own browser's IndexedDB, on your device. When you save a recipe, nothing is uploaded, because there is nowhere to upload it to. The site itself is a pile of static files on a CDN.

That single decision cascades into everything the product claims:

No account, because there is no server-side user to attach data to.
Works offline, because it is a PWA and your recipes are already local.
Private, because your data never leaves the device unless you export a backup yourself.
Free forever, because static hosting plus on-device storage costs the same at ten users and ten million: roughly nothing.

The cost curve is the feature. A freemium recipe app caps your saves because each saved recipe is a row in a database they pay for. Mine cannot cap you, because your saves are not my problem to store. The economics and the privacy are the same fact viewed from two angles.

The one piece of server that exists

There is exactly one bit of backend: a stateless fetch proxy, a single Cloudflare Pages Function. When you paste a URL, your browser cannot fetch that page directly because of CORS, so the proxy fetches it and hands the HTML back. It is about a hundred lines. It stores nothing, it has no database, and it keeps no record of who asked for what. It just reads a public page and forwards it, the same thing your browser's reader mode does.

I hardened it because an open proxy is an abuse magnet: it checks the request actually came from the app, refuses internal and loopback addresses so it cannot be turned into an SSRF tool, restricts responses to HTML, and edge-caches so two people fetching the same recipe share one upstream request.

The bot walls, and being honest about them

Some sites (NYT Cooking, AllRecipes, a few big publishers) return a 403 to my proxy no matter what headers it sends. A commenter on launch day pushed on this: if you set the right user agent, how does the site even know it is a bot?

The answer is that user agent and headers are the easy, spoofable part. Modern bot protection reads the TLS handshake itself. A real Chrome negotiates TLS with a specific ordering of ciphers and extensions; curl, or my Cloudflare function, negotiate it differently. That fingerprint (people call it JA3) gives you away no matter what the headers claim. Add IP reputation, my fetch comes from a datacenter range and you browse from a home ISP, and a site can refuse every non-browser with high confidence.

Could I spoof the fingerprint? There are libraries for it. But it is an arms race I would lose, since I do not control the TLS stack Cloudflare gives me, and honestly it is a race I do not want to run. The whole posture of the app is reader mode: fetch what you could already read, keep it privately on your own device, never republish it. Defeating bot walls is a different, more hostile business.

So for those sites there is a bookmarklet. It runs inside your actual browser, on the page you are already looking at, so the request carries your real fingerprint and your real IP, because it is you. No spoofing, no arms race. The limitation became a design line, not a bug to paper over.

Three things that bit me

Svelte 5 state proxies do not survive IndexedDB. Svelte 5 wraps anything you put in $state in a deep reactive Proxy. IndexedDB's structured clone throws DataCloneError on a Proxy. I claimed the jar "worked" before I had actually tested a save in a browser, and it did not. The fix is a JSON round-trip at the database boundary to read a plain object back out of the proxy. The lesson, relearned: always browser-test an IndexedDB write, never trust that it compiles.

A regex lookbehind white-screened the whole app on older iOS Safari. I had a lookbehind in the parser. Safari before 16.4 does not support it, and it is a syntax error, so the entire bundle failed to parse and users on slightly older iPhones got a blank page. Playwright's WebKit was too new to catch it. I found it by reading the code with old-Safari support tables open, then rewrote the regex without the lookbehind. Cross-engine testing is necessary but not sufficient; the engine version matters.

The bundle size is a budget, not an accident. The app is about 70KB gzipped, enforced in CI. Every feature has to fit, which is why the parser is plain string and regex work with no DOM dependency, and why there is no state library. On real-world field data the largest-contentful-paint is well under Google's "good" threshold, which matters most on the cheap Android phones I eventually want this to reach.

Cook mode came from actually cooking

The feature people mention most is cook mode: it shows one step at a time in large text, keeps the screen awake, and turns any duration in the instructions ("simmer 20 minutes") into a tappable timer. It exists because I kept burning garlic while scrolling back up to check how long something needed, with the screen dimming under my floury hands. A stranger on launch day described hitting "next" with floury hands and it made my week, because that is the exact moment I built it for.

The tradeoff, stated plainly

Local-first is not free of downsides, and pretending otherwise would undercut the honesty the whole thing runs on. Your recipes live only on your device, so if you clear your browser or lose the phone, they are gone. There is no cloud safety net because there is no cloud. The app nudges you to export a one-file backup, and you can point that backup at any synced folder you like, but the responsibility is yours. That is the real cost of owning your data instead of renting it back from someone.

For a recipe keeper, I think that is the right trade. It is not a bank. It is a jar on your own shelf.

If you want to look

Recipe Jar is live at recipejar.app and open source (MIT) at github.com/sbmagar13/recipe-jar. The architecture doc walks through all of the above in one page, and if you find a recipe site that does not import cleanly, that is the most useful bug report you can file.

It is on Product Hunt if you want to poke at it: producthunt.com/products/recipe-jar.

Connecting Claude Tools to Hashnode using MCP Server

Sagar Budhathoki — Sat, 10 May 2025 05:07:27 +0000

Introduction

In the rapidly evolving landscape of AI tools and integrations, the ability to extend AI capabilities through custom interfaces has become increasingly valuable. Today, I'm excited to share a project I've been working on: the Hashnode MCP Server. This tool bridges the gap between AI assistants and the Hashnode blogging platform, enabling seamless content creation, management, and retrieval directly through AI interactions.

In this article, I'll walk you through what the Model Context Protocol (MCP) is, how my Hashnode MCP server works, and how you can set it up to enhance your own content workflow.

Demo First? (😁)

Create Article:

Update Article

What is the Model Context Protocol (MCP)?

The Model Context Protocol (MCP) is a framework that allows AI models to interact with external tools and data sources. It provides a standardized way for AI assistants to access additional capabilities beyond their built-in functions.

MCP servers act as intermediaries between AI models and external services, exposing a set of tools and resources that the AI can use to perform specific tasks. This extends what AI assistants can do without requiring them to have direct API access to every possible service.

Introducing the Hashnode MCP Server

The Hashnode MCP Server is a Python-based implementation that connects AI assistants to the Hashnode API. It allows AI models to perform various operations on Hashnode blogs, including:

Creating and publishing new articles
Updating existing articles
Searching for articles by keywords
Retrieving article details
Getting user information
Fetching the latest articles from a publication

This means that with the Hashnode MCP Server, you can ask an AI assistant to draft a blog post, publish it to your Hashnode blog, search for related content, or update existing articles—all without leaving your conversation with the AI.

How the Hashnode MCP Server Works

At its core, the Hashnode MCP Server is a bridge between AI assistants and the Hashnode GraphQL API. Here's how it works:

Connection: The MCP server establishes a connection with both the AI assistant and the Hashnode API.
Tool Exposure: It exposes a set of tools that represent different Hashnode operations.
Request Handling: When the AI assistant wants to perform an action, it sends a request to the MCP server.
API Interaction: The server translates this request into the appropriate GraphQL query or mutation for the Hashnode API.
Response Formatting: After receiving a response from Hashnode, the server formats it in a way that's easy for the AI to understand and present to the user.

The server is built using the FastMCP framework, which simplifies the process of creating MCP servers by handling the communication protocol details.

Setting Up the Hashnode MCP Server

Prerequisites

Python 3.8 or higher
A Hashnode account with a personal access token
Basic familiarity with command-line operations

Installation Steps

Clone the repository:

git clone https://github.com/sbmagar13/hashnode-mcp-server.git
cd hashnode-mcp-server

Create a virtual environment:

python -m venv .venv
source .venv/bin/activate  # On Windows: .venv\Scripts\activate

Install dependencies:
```
pip install -r requirements.txt
```
Set up environment variables: Create a .env file in the project root with the following content:
```
HASHNODE_API_URL=https://gql.hashnode.com
HASHNODE_PERSONAL_ACCESS_TOKEN=your_personal_access_token
```
Replace your_personal_access_token with your actual Hashnode personal access token, which you can generate in your Hashnode account settings.
Run the server:

You have two options for running the server:

Option 1: Run the server manually
```
python run_server.py
```
Or directly using the root file:
```
python mcp_server.py
```
The server will start and listen for connections from AI assistants. By default, it runs on localhost:8000.

Option 2: Let the MCP integration handle it automatically (I’ll be using this)

When properly configured in Claude Desktop or Cline VSCode extension, the MCP integration will automatically start and manage the server process for you.

Important Note on File Structure

When configuring your MCP server in Claude Desktop or Cline VSCode extension, you should use the root mcp_server.py file directly rather than the files in the hashnode_mcp directory. The hashnode_mcp directory is primarily for packaging purposes.

For example, in your configuration, point to:

/path/to/your/hashnode-mcp-server/mcp_server.py

And not:

/path/to/your/hashnode-mcp-server/hashnode_mcp/mcp_server.py

This ensures you're using the most up-to-date version of the server with all features enabled. The root mcp_server.py file contains all the necessary functionality and doesn't require the package structure to operate correctly.

Using the Hashnode MCP Server with AI Assistants

Once your server is configured, you can connect compatible AI assistants to it. Unlike traditional API integrations that use URLs, MCP servers are typically configured directly in the AI assistant's configuration files, as we'll see in the next section.

The connection process generally involves:

Setting up the configuration file for your AI assistant (Claude Desktop or Cline VSCode extension)
Specifying the path to your Python interpreter and the MCP server script
Providing necessary environment variables like your Hashnode personal access token

After configuring the connection, you can start giving the AI commands related to your Hashnode blog. For example:

"Create a new article about Python programming tips"
"Update my article with ID 12345 to fix the code examples"
"Get the latest articles from my blog"
"Search for articles about machine learning"

The AI will use the MCP server to execute these commands and return the results.

Configuring MCP on Claude Desktop and Cline VSCode Extension

To use your Hashnode MCP Server with Claude AI, you'll need to configure it in either Claude Desktop or the Cline VSCode extension. Here's how to set it up in both environments:

Configuring MCP on Cline VSCode Extension

Open VS Code with the Cline extension installed.
Navigate to the Cline MCP settings file located at:

* Windows: `%APPDATA%\Code\User\globalStorage\saoudrizwan.claude-dev\settings\cline_mcp_settings.json`

* macOS: `~/Library/Application Support/Code/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json`

* Linux: `Unfortunately, Claude Desktop is not available for Linux as of now (at the time of writing this article)` (So you can use VSCode Cline Extension instead)

Add your Hashnode MCP server configuration to the file:

{
  "mcpServers": {
    "hashnode": {
      "command": "/path/to/your/venv/bin/python",
      "args": [
        "/path/to/your/hashnode-mcp-server/mcp_server.py"  // Use the root mcp_server.py file
      ],
      "env": {
        "HASHNODE_PERSONAL_ACCESS_TOKEN": "your-personal-access-token"
      }
    }
  }
}

Note that the configuration points to the root mcp_server.py file, not the one in the hashnode_mcp directory.

Replace the paths and token with your actual values. For example:

{
  "mcpServers": {
    "hashnode": {
      "command": "/Users/sagar/my_personal/hashnode-mcp-server/.venv/bin/python",
      "args": [
        "/Users/sagar/my_personal/hashnode-mcp-server/mcp_server.py"
      ],
      "env": {
        "HASHNODE_PERSONAL_ACCESS_TOKEN": "your-personal-access-token"
      }
    }
  }
}

Save the file and restart VS Code or reload the window.
Open a new Cline conversation and test the connection by asking it to interact with your Hashnode blog.

Configuring MCP on Claude Desktop

Open Claude Desktop and navigate to the configuration file:

* Windows: `%APPDATA%\Claude\claude_desktop_config.json`

* macOS: `~/Library/Application Support/Claude/claude_desktop_config.json`

* Linux: `Unfortunately, Claude Desktop is not available for Linux as of now (at the time of writing this article)`

Add your Hashnode MCP server configuration to the file, using the same format as for the Cline VSCode extension. Make sure to point to the root mcp_server.py file:

{
  "mcpServers": {
    "hashnode": {
      "command": "/path/to/your/venv/bin/python",
      "args": [
        "/path/to/your/hashnode-mcp-server/mcp_server.py"  // Use the root mcp_server.py file
      ],
      "env": {
        "HASHNODE_PERSONAL_ACCESS_TOKEN": "your-personal-access-token"
      }
    }
  }
}

Save the file and restart Claude Desktop.
Test the connection by asking Claude to perform a simple operation like "Get the latest articles from my Hashnode blog."

Troubleshooting Connection Issues

If you encounter connection issues:

Verify the server is running by checking the terminal where you started the MCP server.
Check the paths in your configuration are correct and point to the right Python interpreter and script.
Ensure your environment variables are properly set, especially the Hashnode personal access token.
Check the server logs for any error messages.
Try restarting both the MCP server and the Claude application.

Example: Creating a New Article

Let's walk through a practical example of using the Hashnode MCP Server to create and publish a new article:

Start the server as described above.
Connect your AI assistant to the MCP server.

Ask the AI to create an article:

Create a new article titled "Getting Started with Python" with the following content:

# Getting Started with Python

Python is one of the most popular programming languages today. In this article, we'll explore the basics of Python and how to get started.

## Installation

First, you need to install Python...

[rest of the article content]

Tags: python, programming, beginners

The AI will use the MCP server to:

* Format the request for the Hashnode API

* Send the creation request

* Return the result, including the article ID and URL

You can then ask the AI to:

* Publish the article immediately


Save it as a draft
Make further edits

Advanced Features

Timeout Handling

The Hashnode MCP Server includes robust timeout handling for API requests. This is particularly important for operations like article creation and updates, which might take longer to process. If a request times out, the server provides helpful error messages and suggestions.

Error Management

The server includes comprehensive error handling to provide clear feedback when issues occur. This makes troubleshooting easier and improves the user experience.

Pagination Support

For operations that might return large amounts of data, like searching for articles, the server supports pagination to manage the response size and improve performance.

Potential Use Cases

The Hashnode MCP Server opens up numerous possibilities for content creators:

Automated Content Creation: Generate draft articles based on outlines or topics.
Content Management: Update, organize, and manage your blog without leaving your AI assistant.
Research Assistance: Search your existing content to find relevant articles or avoid duplication.
Batch Operations: Perform bulk updates or content audits across your blog.
Integration with Workflows: Incorporate blog publishing into broader AI-assisted workflows.

Technical Architecture

The project is organized with a clean, modular structure:

mcp_server.py: Root server implementation that can be run directly
hashnode_mcp/: Core package containing the modular functionality
- mcp_server.py: Package version of the server implementation
- utils.py: Utility functions for formatting responses and GraphQL queries
examples/: Example usage scripts
tests/: Test suite for verifying functionality
run_server.py: Entry point for running the server using the package version

While the project includes a package structure (hashnode_mcp/) for organization and potential distribution, users can simply run the root mcp_server.py file directly without needing to use the package. This provides flexibility in how you choose to deploy the server.

The server uses asynchronous programming with Python's asyncio and httpx libraries for efficient API communication. GraphQL queries and mutations are defined as constants, making them easy to maintain and update.

Future Enhancements

There are several exciting possibilities for future development:

Additional Hashnode Features: Support for more Hashnode API capabilities like managing comments, series, and newsletters.
Analytics Integration: Retrieving and analyzing blog performance metrics.
Content Optimization: AI-assisted SEO optimization for articles.
Multi-User Support: Enhanced capabilities for team publications.
Webhook Support: Responding to events from your Hashnode blog.

Conclusion

The Hashnode MCP Server represents a powerful bridge between AI assistants and content creation on Hashnode. By enabling AI models to interact directly with your blog, it streamlines the writing and publishing process, making content creation more efficient and accessible.

Whether you're a solo blogger looking to optimize your workflow or part of a content team seeking to scale your production, this tool offers valuable capabilities for integrating AI into your content strategy.

I'm excited to see how others in the community will use and extend this project. The code is open-source and available on GitHub, so feel free to fork it, contribute, or adapt it to your specific needs.

Resources

Thanks!

Have you integrated AI tools into your content workflow? Share your experiences in the comments below!

This is test article from MCP server with Cline

Sagar Budhathoki — Wed, 30 Apr 2025 18:32:10 +0000

Hello guys!!

This is just a test article using MCP server.