Historic Firsts – a daily game about ranking firsts in history

jeremyfrancis871 pts0 comments

Daily History Timeline Game - Historic Firsts

The Daily First

How To Play

A reader's guide to Historic Firsts

Six historic firsts land in your deck each day. Arrange them along the timeline from the earliest to the most recent.

Editor's Note

A “first” is a landmark invention, discovery, or milestone.

Rules of the Game

Drag a card from your deck into a timeline slot. From oldest #1, to newest #6

Flip the card to learn more about it.

Press Submit to lock in your order.

Three wrong submissions and the edition closes until tomorrow.

A fresh edition is published every day.

— 30 —

const localDate = () => {<br>const now = new Date()<br>const pad = (value) => String(value).padStart(2, '0')

return `${now.getFullYear()}-${pad(now.getMonth() + 1)}-${pad(now.getDate())}`

const completedToday = () => {<br>if (document.querySelector('[data-game-completed-for-day="true"]')) {<br>return true

try {<br>const progress = JSON.parse(localStorage.getItem(`historic-firsts.progress.${localDate()}`) || 'null')

return Boolean(progress?.gameOver || progress?.submitted)<br>} catch (error) {<br>return false

const maybeOpenGuide = () => {<br>try {<br>const key = 'historic-firsts.guide-auto-open-count'<br>const count = Number.parseInt(localStorage.getItem(key) || '0', 10)

if (! completedToday() && count

Deck

Deck empty — submit when you're ready.

Tries

Submit

Timeline · Oldest

Newest

openTimelineCard(timeline[0]), 160) }"<br>x-bind:class="{<br>'is-flipped': timelineFlips[timeline[0].id],<br>'opacity-0': (timelineDrag.moved && timelineDrag.cardId === Number(timeline[0].id)) || (placingFromDeck && placingFromDeck.slotIndex === 0 && placingFromDeck.cardId === Number(timeline[0].id)),<br>}"<br>class="flip-card absolute inset-0 w-full h-full touch-none cursor-grab active:cursor-grabbing select-none">

openTimelineCard(timeline[1]), 160) }"<br>x-bind:class="{<br>'is-flipped': timelineFlips[timeline[1].id],<br>'opacity-0': (timelineDrag.moved && timelineDrag.cardId === Number(timeline[1].id)) || (placingFromDeck && placingFromDeck.slotIndex === 1 && placingFromDeck.cardId === Number(timeline[1].id)),<br>}"<br>class="flip-card absolute inset-0 w-full h-full touch-none cursor-grab active:cursor-grabbing select-none">

openTimelineCard(timeline[2]), 160) }"<br>x-bind:class="{<br>'is-flipped': timelineFlips[timeline[2].id],<br>'opacity-0': (timelineDrag.moved && timelineDrag.cardId === Number(timeline[2].id)) || (placingFromDeck && placingFromDeck.slotIndex === 2 && placingFromDeck.cardId === Number(timeline[2].id)),<br>}"<br>class="flip-card absolute inset-0 w-full h-full touch-none cursor-grab active:cursor-grabbing select-none">

openTimelineCard(timeline[3]), 160) }"<br>x-bind:class="{<br>'is-flipped': timelineFlips[timeline[3].id],<br>'opacity-0': (timelineDrag.moved && timelineDrag.cardId === Number(timeline[3].id)) || (placingFromDeck && placingFromDeck.slotIndex === 3 && placingFromDeck.cardId === Number(timeline[3].id)),<br>}"<br>class="flip-card absolute inset-0 w-full h-full touch-none cursor-grab active:cursor-grabbing select-none">

openTimelineCard(timeline[4]), 160) }"<br>x-bind:class="{<br>'is-flipped': timelineFlips[timeline[4].id],<br>'opacity-0': (timelineDrag.moved && timelineDrag.cardId === Number(timeline[4].id)) || (placingFromDeck && placingFromDeck.slotIndex === 4 && placingFromDeck.cardId === Number(timeline[4].id)),<br>}"<br>class="flip-card absolute inset-0 w-full h-full touch-none cursor-grab active:cursor-grabbing select-none">

openTimelineCard(timeline[5]), 160) }"<br>x-bind:class="{<br>'is-flipped': timelineFlips[timeline[5].id],<br>'opacity-0': (timelineDrag.moved && timelineDrag.cardId === Number(timeline[5].id)) || (placingFromDeck && placingFromDeck.slotIndex === 5 && placingFromDeck.cardId === Number(timeline[5].id)),<br>}"<br>class="flip-card absolute inset-0 w-full h-full touch-none cursor-grab active:cursor-grabbing select-none">

A daily history timeline game

Historic Firsts gives you a fresh set of inventions, discoveries, breakthroughs, and milestones every day. Sort each card from earliest to latest, protect your streak, and learn the moments that changed history.

The Colophon

Published Daily &middot; Est. MMXXVI &middot; Price: Free to All Readers

Questions or corrections?<br>[email protected]

— 30 —

&copy; 2026 Historic Firsts — set in Playfair Display & Instrument Sans

timeline placingfromdeck number class timelinedrag cardid

Related Articles