Add CLAUDE.md and add 2015 date to Phoenix Demo card
Torey Heinz
committed Feb 17, 2026
commit 3c716ad5e96e30de052b7ce8c7ef3a80b58ec9e2
Showing 1
changed file with
69 additions
and 0 deletions
CLAUDE.md
+69
-0
| @@ | @@ -0,0 +1,69 @@ |
| + | # CLAUDE.md |
| + | |
| + | This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository. |
| + | |
| + | ## Project Overview |
| + | |
| + | Presentation repository for "Elixir in the Real World: A Practical Introduction" — a ~50-minute talk at the GR Web Dev Meetup, February 23, 2026. Presenter: Torey Heinz (Vianet Management). |
| + | |
| + | **Three parts:** |
| + | 1. `slides/01-intro.html` — Reveal.js slideshow: Why Elixir? |
| + | 2. `02-the-language.livemd` — LiveBook interactive demos (runs live during talk) |
| + | 3. `slides/03-real-world.html` — Reveal.js slideshow: Production code from Vianet |
| + | |
| + | No build step. Open HTML files directly in a browser. Press `S` for speaker notes view. |
| + | |
| + | ## Key Files |
| + | |
| + | - `slides/shared.css` — All shared styles, component classes, color variables |
| + | - `slides/logos/` — Brand logos (SVG/PNG) for Vianet entities and companies |
| + | - `*.livemd` — Source outlines; `02-the-language.livemd` is the actual LiveBook presentation |
| + | - `outline.md` — Detailed narrative structure and timing |
| + | |
| + | ## Reveal.js Conventions |
| + | |
| + | - **CDN:** unpkg, Reveal.js 5.1.0 — no local install needed |
| + | - **Theme:** `white` base + `shared.css` overrides |
| + | - **Plugins:** Highlight (Monokai), Notes, Markdown |
| + | |
| + | ### Slide Structure |
| + | ```html |
| + | <section data-transition="fade"> |
| + | <h2>Title</h2> |
| + | <li class="fragment">Progressive reveal</li> |
| + | <aside class="notes">Speaker notes on every slide</aside> |
| + | </section> |
| + | ``` |
| + | |
| + | - `class="section-divider"` + `data-transition="zoom"` for section breaks |
| + | - `class="fragment"` for progressive reveals |
| + | - `data-line-numbers="1-5|7-8"` for stepped code highlighting |
| + | - `class="small-code"` (0.45em) / `class="tiny-code"` (0.40em) for dense code |
| + | |
| + | ### CSS Variables |
| + | ```css |
| + | --elixir-purple: #48205D; /* Official Elixir brand purple */ |
| + | --elixir-purple-light: #8D8390; /* Official Elixir brand light */ |
| + | ``` |
| + | |
| + | ### Key CSS Classes |
| + | | Class | Purpose | |
| + | |-------|---------| |
| + | | `.section-divider` | Purple gradient section break | |
| + | | `.entity-card` / `.entity-grid` | Vianet company cards (3-col) | |
| + | | `.company-card` / `.company-grid` | External company cards (2-col) | |
| + | | `.small-code` / `.tiny-code` | Smaller code blocks | |
| + | | `.muted` / `.small` / `.smaller` | Text utilities | |
| + | | `.flow-diagram` / `.arch-diagram` | Monospace ASCII diagrams | |
| + | | `.callout` | Highlighted insight box | |
| + | |
| + | ## Audience Context |
| + | |
| + | Mostly JS/Rails developers in West Michigan. Slides use comparisons to familiar tools (Node event loop, Sidekiq, React, Redis pub/sub) to explain Elixir/BEAM concepts. |
| + | |
| + | ## Related Repositories |
| + | |
| + | Production code examples in Part 3 reference these Vianet projects (configured as additional working directories): |
| + | - `/Users/th/ViaNet/vianet-marketing` — Email marketing system |
| + | - `/Users/th/ViaNet/OrbitFour/OrbitFourV2` — Domain registrar |
| + | - `/Users/th/ViaNet/vianet-admin` — Internal admin app |