Introducing MD Doctor: A Modern Markdown Workspace Built with Next.js

A fast, privacy-first Markdown editor that combines a handcrafted writing experience with live previews, offline storage, multilingual support, and beautiful exports.

#Introduction

Markdown has become the standard writing format for developers, technical writers, and open-source communities. Yet many editors either focus on simplicity while sacrificing features, or become overloaded with unnecessary complexity.

I wanted something different.

MD Doctor is a modern Markdown workspace built for people who write every day. It combines a custom-built editing experience, real-time previews, offline storage, multilingual support, and professional export options into a single web application.

Built with Next.js 16, React 19, and Material UI, MD Doctor is designed to feel fast, intuitive, and enjoyable to use.

#Why I Built MD Doctor

Most online Markdown editors fall into one of three categories.

Some are little more than plain textareas.

Others rely on heavy editor frameworks that are difficult to customize.

Many require your documents to be stored on external servers.

I wanted complete control over the editing experience while keeping users in control of their own data.

Instead of building on top of Monaco, CodeMirror, or TipTap, I wrote the editing engine from scratch to create an experience tailored specifically for Markdown writing.

#Key Features

MD Doctor combines modern writing tools with a clean, distraction-free interface.

#Custom Markdown Editor

The editor has been built entirely from scratch.

It includes:

• Line numbers
• Smart list continuation
• Automatic indentation
• Native undo and redo
• Smooth typing experience
• Keyboard-first workflow

Everything is designed to make writing feel natural.

#Quick Formatting Tools

Formatting content should never interrupt your flow.

MD Doctor provides:

• Slash command menu (/)
• Floating formatting toolbar
• Keyboard shortcuts
• Instant Markdown insertion

Whether you're inserting headings, links, tables, or code blocks, everything stays within easy reach.

#Live Markdown Preview

Every change is rendered instantly.

The preview supports modern GitHub Flavored Markdown features including:

• Tables
• Task lists
• Footnotes
• Syntax highlighting
• Mathematical equations
• Mermaid diagrams

You always see exactly how your document will appear before exporting.

#Import & Export

Moving documents between applications is effortless.

Import:

• Markdown (.md)
• HTML (automatically converted to Markdown)

Export:

• Markdown
• Standalone HTML
• Print-ready PDF

This makes MD Doctor suitable for documentation, blogging, technical notes, and project documentation.

#Offline First

Privacy was one of the primary goals during development.

Documents are stored locally using IndexedDB.

Nothing is uploaded unless you explicitly choose to share it.

This allows MD Doctor to continue working even without an internet connection.

#Multilingual Support

MD Doctor currently supports four languages:

• English
• Türkçe
• العربية
• اردو

The application also includes complete Right-to-Left (RTL) support, ensuring a consistent experience for Arabic and Urdu users.

#Responsive Interface

Whether you're using a desktop, tablet, or laptop, the interface adapts to your screen while maintaining a comfortable writing experience.

Features include:

• Responsive layouts
• Light and dark themes
• Smooth animations
• Material Design interface
• Accessibility-focused components

#Technology Stack

MD Doctor is built using the latest web technologies.

Category	Technology
Framework	Next.js 16 (App Router, Turbopack)
Frontend	React 19
Language	TypeScript
UI	Material UI 9
Animation	Motion
Internationalization	next-intl
Markdown	react-markdown, remark-gfm, remark-math
Diagrams	Mermaid
Mathematics	KaTeX
Storage	IndexedDB (Dexie)

Using modern tooling allows the application to remain fast while being easy to maintain and extend.

#Writing Experience

One of my biggest goals with MD Doctor was creating an editor that stays out of your way.

Instead of overwhelming users with dozens of floating toolbars, the interface reveals tools only when they're needed.

The slash menu appears exactly where you're typing.

Formatting controls appear only when text is selected.

Everything else stays hidden so your focus remains on writing.

#Privacy by Design

Unlike many online editors, MD Doctor treats privacy as a feature rather than an afterthought.

Your documents remain on your own device.

No accounts.

No cloud synchronization.

No background uploads.

Just your writing.

#Getting Started

Clone the repository and install the dependencies.

git clone https://github.com/shehari007/md-doctor-next-js.git

cd md-doctor-next-js

npm install

Start the development server.

npm run dev

The application will be available at:

http://localhost:3000

Production build:

npm run build

npm run start

Run type checking:

npm run typecheck

#Project Structure

The project follows a modular architecture that keeps responsibilities clearly separated.

src/
├── app/
├── components/
├── i18n/
├── lib/
├── messages/
├── theme/
└── proxy.ts

This organization makes the project easier to navigate and simplifies future maintenance.

#Open Source

MD Doctor is completely open source and released under the MIT License.

Contributions, feature requests, bug reports, and pull requests are always welcome.

#Source Code

#GitHub Repository

https://github.com/shehari007/md-doctor-next-js

#Future Plans

Development is ongoing, with several improvements already planned.

Upcoming ideas include:

• Document tabs
• Split-screen editing
• Command palette
• Plugin support
• Custom themes
• AI writing assistance
• Collaboration features
• Version history
• Additional export formats

#Final Thoughts

MD Doctor began as an experiment to see how far a custom Markdown editor could go without relying on heavyweight editing frameworks.

It has grown into a complete writing workspace focused on speed, privacy, and developer productivity.

Whether you're writing documentation, technical articles, README files, notes, or blog posts, MD Doctor aims to provide a clean and enjoyable writing experience.

If you find the project useful, consider giving it a ⭐ on GitHub.

Every contribution, issue, suggestion, and star helps shape future releases.

Happy writing! ✍️