Spectrum Newsletter

Department of Electronics & Communication Engineering

Three different approaches to showcase our newsletter content with varying levels of interactivity and design fidelity.

complete
Content-First

Markdown-Based Newsletter

Content stored as Markdown with multi-format export capabilities. Perfect for version control and collaborative editing.

Advantages

  • Easy to edit and maintain
  • Version control friendly
  • Multiple export formats (PDF, DOCX, HTML, RTF)
  • Fast loading and rendering
  • SEO friendly

Considerations

  • Limited styling flexibility
  • Requires Markdown knowledge
  • Less visually rich than HTML
complete
Design-First

Original HTML Newsletter

Serves the original visually rich HTML newsletter with advanced export features. Preserves all original styling and layout.

Advantages

  • Exact original design fidelity
  • Rich visual elements and styling
  • Print-ready formatting
  • Multiple export formats
  • Professional appearance

Considerations

  • Harder to edit content
  • Large file size
  • Not responsive by default
complete
Modern UI

Interactive Next.js UI

Modern, interactive newsletter built with Next.js and shadcn/ui components. Features responsive design and smooth animations.

Advantages

  • Modern, responsive design
  • Interactive elements
  • Fast performance
  • Mobile-friendly
  • Easy to customize
  • Export capabilities

Considerations

  • Different from original design
  • Requires React knowledge for editing
  • More complex structure

Technical Implementation

This project demonstrates three different approaches to content presentation and export:

Markdown Approach

Uses marked.js for parsing, with custom content converter supporting multiple export formats via Pandoc and Puppeteer.

HTML Approach

Serves static HTML with Puppeteer-based PDF generation and HTML-to-Markdown conversion for other formats.

Interactive Approach

React components with shadcn/ui, server-side rendering to HTML, and multi-format export capabilities.