All projects

CompleteUpdated Added

DnD Initiative Tracker

A DnD utility for tracking the health, initiative, and status effects of a party of players and the enemies they face.

Note: Phone Recommended

Visit Initiative Tracker (opens in a new tab)Visit GitHub Repo (opens in a new tab)

About this project

Spurred on by a DM friend who needed some assistance with tracking initiative in combat, this project was a convenient exercise in learning some of the more object-oriented intricacies of JavaScript by building a UI from scratch without a framework. It was incredibly helpful and very enjoyable to code, and it helped pave the way for the TypeScript, Cypress, and Vue work I would later encounter in my career.

Screenshots

The encounter setup screen with party buttons and two added creatures (view full size)
Setting up an encounter: pick party members or add other creatures with their initiative and hit points.
A running encounter sorted by initiative with the active creature highlighted (view full size)
The encounter in progress, sorted by initiative with the active turn highlighted.
The More menu offering move, effect and initiative actions (view full size)
Extra actions for a creature: reorder, add or remove status effects, and edit initiative.

Resources