Homebrewery πŸΊπŸ§™β€β™‚οΈ

I'm Scott

  • Developer for over 20 years
  • Primarily build for the web
  • Founder / early-stage for most of my jobs

Oh, hello

  • Love automation and solution design

What is Homebrewery?

A site that allows you to create beautiful homebrew D&D content with just Markdown

D&D?
Dungeons and Dragons - Shared story telling and improv game

Β 

Markdown?
Human friend text that turns into HTMLΒ 

Brief project timeline

V1

  • Weekend project

  • Just Editor and PDF exporting

  • Launched on Heroku

  • Weekend project

  • Just Editor and PDF exporting

  • Launched on Heroku

  • Shared to smaller subreddit

  • Lots of positive feedback

  • Tons of suggestions

Result?

V2

  • Lots of positive feedback

  • Added DB (still no accounts)

  • Dual key system for editing and viewing

  • Expanded the markdown parser

  • Improved Styling

  • Allowed HTML

  • Huge usage uptick

  • Shared to main subreddit

  • Lots and lots of bugs/issues

Result?

V3(ish?)

  • Added accounts (no email! 😭)

  • Added main site (bad idea)

  • Expanding Markdown syntax even more

  • Trolling/hacking

  • Backwards compatibility issues

  • Community issues: Legal, reddit mods, support

Result?

How it Works

Editor + Preview

  • Codemirror as editor + custom syntax highlighter
  • Very custom CSS styling for the D&D look
  • React.js as UI framework
  • Fontawesome for icons
  • Less for styling, no style frameworks
  • Partial Page rendering
  • Use of print media queries

Hosting and Infrastructure

  • Heroku for server
  • Autodeploys from Github master to staging
  • Manual promotion to production
  • MongoDB for database. Two table system.
  • Logging via Papertrail (lots of trail and error)
  • Heroku handled traffic spikes

Frontend Tooling

  • Vitreum: a react.js build system we developed at Thalmic Labs.
  • Uses Browserify, React, and LiveReload
  • React component => Bundle.js + HTML
  • Allows for custom transforms such as css and images
  • LiveReload built in, watches project + hotreloads changed files via websockets

Backend Tooling

  • Express.js for server
  • Simple scripts for compiling Less styling
  • Salted hashed passwords

Thanks!

Homebrewery πŸΊπŸ§™β€β™‚οΈ

By Scott Tolksdorf

Homebrewery πŸΊπŸ§™β€β™‚οΈ

  • 26