Marp Server

An Express.js server that converts Markdown presentations to PowerPoint slides using Marp CLI.

Overview

The Marp Server is an Express.js application that provides a simple yet powerful API for converting Markdown presentations to PowerPoint slides. Built on top of Marp CLI, this server allows users to upload Markdown files and receive beautifully formatted PowerPoint presentations in return.

Key Features

Simple API Endpoint: Upload Markdown files via HTTP POST request
Automatic Conversion: Converts Markdown to PowerPoint using Marp CLI
File Management: Handles file uploads, processing, and cleanup automatically
Theme Support: Supports Marp themes for customized presentation styling
Error Handling: Robust error handling with detailed feedback
Cross-Platform: Works on Windows, macOS, and Linux

Technology Stack

Express.js: Fast, unopinionated, minimalist web framework for Node.js
Marp CLI: Markdown presentation writer with built-in themes
Multer: Middleware for handling multipart/form-data, used for file uploads
Node.js: JavaScript runtime built on Chrome's V8 JavaScript engine
PowerPoint Export: Direct conversion to PPTX format
Markdown: Lightweight markup language for creating formatted text

Architecture Overview

System Architecture

The Marp Server follows a simple yet effective architecture with clear separation of concerns for file handling and conversion.

# High-Level Architecture Flow
Client Application
    ↓
HTTP POST Request (Markdown file)
    ↓
Express.js Server (Marp Server)
    ↓
Multer File Upload Handler
    ↓
Marp CLI Conversion Process
    ↓
PowerPoint File Generation
    ↓
File Download Response

# Key Components:
- Server: Express.js web framework
- File Upload: Multer middleware
- Conversion: Marp CLI
- Output: PowerPoint PPTX format
- Environment: Node.js runtime

Key architectural features:

Simple RESTful API endpoint for file uploads
Automatic file cleanup after processing
Cross-platform compatibility with shell execution
Error handling with detailed feedback
Environment configuration for Chrome sandbox
Streamlined file processing pipeline

AI Integration & Chat Interface

The core of the application is its conversational AI interface that transforms natural language descriptions into professional presentations.

// AI Service Integration
interface AIService {
  generateSlides(prompt: string, context?: string): Promise
  refineSlides(slides: SlideData[], refinement: string): Promise
}

// OpenAI Implementation
class OpenAIService implements AIService {
  async generateSlides(prompt: string): Promise {
    const response = await openai.chat.completions.create({
      model: "gpt-4",
      messages: [
        {
          role: "system",
          content: "Generate professional presentation slides in Slidev format..."
        },
        {
          role: "user",
          content: prompt
        }
      ]
    })
    
    return this.parseSlideResponse(response.choices[0].message.content)
  }
}

// Chat Context Management
const ChatContext = createContext({
  messages: [],
  slides: [],
  isGenerating: false,
  sendMessage: (message: string) => {},
  refineSlides: (refinement: string) => {}
})

AI Integration Features:

Support for multiple AI providers (OpenAI, OpenRouter)
Context-aware conversation for slide refinement
Intelligent prompt processing and optimization
Real-time slide generation with progress feedback
Error handling and fallback mechanisms
Configurable AI models and parameters

# Example User Interactions

User: "Create a 10-slide presentation about machine learning basics"
AI: Generates comprehensive ML presentation with:
- Introduction to ML
- Types of ML (supervised, unsupervised, reinforcement)
- Common algorithms
- Real-world applications
- Code examples
- Future trends

User: "Make it more technical and add Python code examples"
AI: Refines slides with:
- Advanced technical concepts
- Python implementation examples
- Mathematical formulations
- Performance metrics
- Best practices

Technical Implementation

The Marp Server is built with Node.js and Express.js, providing a lightweight and efficient solution for converting Markdown presentations to PowerPoint slides:

Server Implementation

Built with Express.js using minimal dependencies for optimal performance and easy deployment.

// Project Structure
marp-server/
├── index.js                 # Main server file
├── package.json            # Dependencies and scripts
├── uploads/                # Temporary file storage
├── output/                 # Generated PowerPoint files
├── vibe-coding-presentation.md  # Sample presentation
└── node_modules/           # NPM dependencies

// Key Dependencies
{
  "name": "marp-server",
  "dependencies": {
    "@marp-team/marp-cli": "^4.1.2",
    "express": "^5.1.0",
    "multer": "^2.0.1"
  }
}

API Implementation

The core functionality is implemented in a single Express.js endpoint that handles file uploads and conversion.

// Main API Endpoint
app.post('/convert', upload.single('markdown'), (req, res) => {
  if (!req.file) {
    return res.status(400).send('No file uploaded.');
  }

  const markdownFilePath = path.resolve(__dirname, req.file.path);
  const outputFileName = `${path.parse(req.file.originalname).name}.pptx`;
  const outputFilePath = path.join(outputDir, outputFileName);
  
  const command = path.join(__dirname, 'node_modules', '.bin', 'marp');

  const args = [
    '--no-stdin',
    markdownFilePath,
    '--to', 'pptx',
    '-o', outputFilePath
  ];

  const spawnOptions = {
    env: {
      ...process.env,
      'CHROME_NO_SANDBOX': 'true'
    },
    shell: true
  };

  const marpProcess = spawn(command, args, spawnOptions);
  
  marpProcess.on('close', (code) => {
    if (code === 0) {
      res.download(outputFilePath, outputFileName, (err) => {
        // Cleanup after download
        fs.unlinkSync(markdownFilePath);
      });
    } else {
      // Handle error
      res.status(500).send('Error during conversion.');
    }
  });
});

Performance & Accessibility

Optimized for performance with comprehensive accessibility features following WCAG 2.1 AA standards.

// Performance Optimizations
- Code splitting for optimal loading
- Image optimization with Next.js
- Caching for AI responses and slides
- Lazy loading for non-critical components
- Debounced user inputs

// Accessibility Features
- Semantic HTML structure
- ARIA attributes for screen readers
- Keyboard navigation support
- Sufficient color contrast ratios
- Focus management
- Alternative text for images

// Responsive Design
- Mobile-first approach
- Flexible grid layouts
- Touch-friendly interactions
- Optimized for all screen sizes

Key Benefits

Simplicity: Easy-to-use API with minimal setup required
Speed: Fast conversion from Markdown to PowerPoint format
Reliability: Robust error handling and automatic cleanup
Flexibility: Supports all Marp features and themes
Cross-Platform: Works on Windows, macOS, and Linux
Lightweight: Minimal resource usage and fast deployment

Use Cases

Content Creators: Convert Markdown presentations to PowerPoint for sharing
Developers: Integrate presentation conversion into existing workflows
Educators: Create educational materials from Markdown notes
Business Users: Generate professional presentations from text documents
Automation Systems: Batch convert multiple Markdown files to PowerPoint