Skip to main content
PRITAM DAS
Back to Projects6 of 6
Freelance / Tailwind CSS / Healthcare Catalog•2024Freelance

TabDent Pharma

Product catalog for pharmaceutical formulations, dosage forms, and active ingredients.

Visit Website
Interactive Preview
Tabdent Pharma — Product Catalog
Catalog UI
Product Formulations
Therapeutic Profile

DENPAIN-SP

Tablet

Film-coated tablet for pain and inflammation management.

Active Ingredients & Strengths
Aceclofenac IP100 mg
Paracetamol IP325 mg
Serratiopeptidase IP15 mg
Responsive WebP Imagerytabdentpharma.com ↗
Context

Overview

A responsive product catalog developed for Tabdent Pharma to present dental and healthcare pharmaceutical formulations in a clean, easily searchable interface. Engineered without heavy framework runtimes to maintain sub-150 KB page weight for fast mobile lookups by healthcare professionals.

Key Features

  • Structured JSON formulation model for easy product updates and ingredient breakdowns
  • Therapeutic categorization for analgesics, gastrointestinal, and oral care medicines
  • Clean active ingredient strength tables with clear dosage indicators
  • Responsive Tailwind CSS layout with WebP packaging image delivery
Impact

Outcomes

Page Weight<150 KB
Framework OverheadNone (static)
Catalog UpdatesJSON-only
Process

How It Works

1

Structured Data Modeling

Stores all medicine formulations, active ingredients, and strengths in structured JSON data.

2

Therapeutic Navigation

Provides quick category filtering across analgesic, NSAID, and gastrointestinal products.

3

Responsive Product Breakdown

Renders ingredient strength tables and packaging details with responsive styling.

Screenshots & Interface

Visual Captures

[Screenshot Placeholder]
Alt: "TabDent Pharma product formulation catalog"
Suggested capture: Product catalog page showing medicine formulation details and active ingredient breakdown tables.
Decisions

Technical Choices & Trade-offs

JSON-only content updates

Decision: Model formulations in structured JSON that drives page rendering, instead of standing up a database or CMS.
Why: The catalog evolves occasionally, not daily. A one-file update path keeps hosting fully static with no backend to maintain, while making content edits safe and predictable.

No framework overhead for a read-only catalog

Decision: Ship plain HTML/ES modules with Tailwind utilities rather than pulling React into a site nobody logs into.
Why: Doctors and distributors skim ingredient tables on mobile between appointments - dropping framework overhead keeps every page under 150 KB and effectively instant.
Stack

Technologies Used

Languages & Core
HTML5JavaScript (ESNext)
Frontend & UI
Tailwind CSSJSON Data ModelsWebP Assets
PreviousGram Bahar