Samuel Edusa MD

< Back
Azalea Report logo

Azalea Report

Status: Active

Timeline: January 2024 - present

Visit site: azaleareport.com

Technologies: Next.js, TypeScript, Tailwind CSS, Convex, Vercel

The Azalea Report is the official newsletter for the SGMC Health Internal Medicine Residency program. Built as a modern web application, it serves as a central hub for residency news, academic updates, and community highlights.

Purpose

The newsletter was created to improve communication within the residency program and provide a professional platform for sharing accomplishments, upcoming events, and educational content with residents, faculty, and staff.

Technical Details

Architecture

The project is a TypeScript monorepo powered by Turborepo, containing two Next.js 14 applications and three shared packages:

  • @azalea/web — Public-facing newsletter site (port 3000)
  • @azalea/admin — Content management dashboard (port 3001)
  • @azalea/ui — Shared UI component library
  • @azalea/shared — Shared types, constants, and utilities
  • @azalea/sections — Reusable content block components

Backend & Database

The backend runs on Convex, a serverless backend platform providing a real-time cloud database. Key data include issues, sections, media, users, birthdays, and locks (for concurrent editing).

Hosting & Deployment

  • Frontend: Deployed on Vercel with continuous deployment
  • Backend: Hosted on Convex Cloud
  • Custom deploy scripts for production deployments and storage migrations

Admin Dashboard

A full-featured content management dashboard built with Next.js, featuring:

  • Issue creation, editing, publishing, and archiving
  • 18+ content section types (spotlight, chief's corner, events, carousel, podcast, birthdays, etc.)
  • Rich text editing via Tiptap
  • Drag-and-drop section ordering via dnd-kit
  • Media library with image uploads (via react-dropzone)
  • User authentication and concurrent editing locks
  • Dashboard stats overview (total issues, drafts, published)
  • Light/dark theme toggle

Styling

  • Tailwind CSS 3.4 with @tailwindcss/typography and @tailwindcss/forms plugins
  • Custom Azalea brand palette (green #016f53, peach #FFE6D6)
  • Fonts: Montserrat (sans) and Georgia (serif)
  • Custom animations and CSS variable-based theming

API & Integrations

  • Convex real-time queries and mutations for all content operations
  • OG image proxy API route for WhatsApp/social media link previews
  • HTML sanitization (sanitize-html, DOMPurify) for XSS prevention

Key Features

  • Responsive newsletter layout
  • Custom-built CMS with rich content editing
  • 18+ flexible content section types
  • Real-time database with concurrent editing support
  • Media library and image management
  • Fast delivery via Vercel CDN
  • Mobile-friendly reading experience