diff --git a/src/features/slides/slides.ts b/src/features/slides/slides.ts new file mode 100644 index 0000000..6229036 --- /dev/null +++ b/src/features/slides/slides.ts @@ -0,0 +1,229 @@ +import type { Slide } from './types' + +import TitleSlide from '@/components/slides/TitleSlide.vue' +import BulletsSlide from '@/components/slides/BulletsSlide.vue' +import KeysSlide from '@/components/slides/KeysSlide.vue' +import EventAnatomySlide from '@/components/slides/EventAnatomySlide.vue' +import ProtocolCompareSlide from '@/components/slides/ProtocolCompareSlide.vue' +import ProtocolTableSlide from '@/components/slides/ProtocolTableSlide.vue' +import OutboxSlide from '@/components/slides/OutboxSlide.vue' +import RelayCategoriesSlide from '@/components/slides/RelayCategoriesSlide.vue' +import RelayAccessSlide from '@/components/slides/RelayAccessSlide.vue' +import ZapSlide from '@/components/slides/ZapSlide.vue' +import ResourcesSlide from '@/components/slides/ResourcesSlide.vue' + +/** + * Ordered deck. Each entry maps an id (used for the URL hash) to a layout + * component + its props. Text slides reuse BulletsSlide; the three hard + * concepts (protocol model, outbox, relay categories) get bespoke components. + */ +export const slides: Slide[] = [ + { + id: 'intro', + label: 'Welcome', + component: TitleSlide, + props: { + title: 'Getting on Nostr', + subtitle: 'A decentralized social protocol you actually own — in about 10 minutes.', + tagline: 'Notes and Other Stuff Transmitted by Relays', + }, + }, + { + id: 'what', + label: 'What is Nostr?', + component: BulletsSlide, + props: { + kicker: 'The 30-second version', + title: 'What is Nostr?', + bullets: [ + { lead: 'A protocol, not an app.', text: 'Like email — many apps, one open network.' }, + { lead: 'No signup.', text: 'No email, no phone number, no company approving you.' }, + { lead: 'You own your identity.', text: 'A key pair you carry between apps.' }, + { lead: 'Censorship-resistant.', text: 'No single server can erase you.' }, + ], + }, + }, + { + id: 'vs-http', + label: 'Nostr vs HTTP', + component: ProtocolCompareSlide, + }, + { + id: 'vs-http-table', + label: 'HTTP vs Nostr table', + component: ProtocolTableSlide, + }, + { + id: 'keys', + label: 'Your keys', + component: KeysSlide, + }, + { + id: 'guard-nsec', + label: 'Guard your nsec', + component: BulletsSlide, + props: { + kicker: 'Rule #1', + title: 'Protect your nsec', + bullets: [ + { lead: 'It can’t be reset.', text: 'Lose it and the account is gone forever.' }, + { lead: 'It’s total control.', text: 'Anyone with it can post as you and read your DMs.' }, + { lead: 'Never paste it into websites.', text: 'Legit apps never ask you to.' }, + { lead: 'Use a signer app.', text: 'On Android, Amber holds the key and approves actions for you.' }, + ], + footnote: 'Back it up offline — write it on paper or store it in a password manager.', + }, + }, + { + id: 'signing', + label: 'Signing', + component: BulletsSlide, + props: { + kicker: 'How you log in', + title: 'Every action is signed', + bullets: [ + { lead: 'No password server.', text: 'You prove who you are with a cryptographic signature.' }, + { lead: 'Each post, like & follow', text: 'is signed by your key before it goes out.' }, + { lead: 'Anyone can verify it', text: 'came from your npub — math, not trust.' }, + { lead: 'A signer (Amber) does this', text: 'so your nsec never touches individual apps.' }, + ], + }, + }, + { + id: 'event', + label: 'Anatomy of an event', + component: EventAnatomySlide, + }, + { + id: 'amethyst', + label: 'Get Amethyst', + component: BulletsSlide, + props: { + kicker: 'Hands-on · Android', + title: 'Get started with Amethyst', + bullets: [ + { lead: '1. Install Amethyst', text: 'from the Play Store, Zap.store, or F-Droid (Obtainium).' }, + { lead: '2. Install Amber', text: 'the companion signer — keeps your nsec out of every app.' }, + { lead: '3. Create your key', text: 'Amber generates your npub / nsec pair.' }, + { lead: '4. Back up the nsec', text: 'before you do anything else.' }, + ], + footnote: 'iOS or web instead? Primal, Damus (iOS) and Nos work the same way — concepts carry over.', + }, + }, + { + id: 'profile', + label: 'Your profile', + component: BulletsSlide, + props: { + kicker: 'Make it yours', + title: 'Set up your profile', + bullets: [ + { lead: 'Display name & picture', text: 'so people recognize you.' }, + { lead: 'A short bio', text: 'tell folks what you’re into.' }, + { lead: 'NIP-05 (optional)', text: 'a name@domain handle that verifies you — like a checkmark you control.' }, + ], + }, + }, + { + id: 'follow', + label: 'Find people', + component: BulletsSlide, + props: { + kicker: 'Fill your feed', + title: 'Find people to follow', + bullets: [ + { lead: 'Search a known npub', text: 'paste a friend’s public key.' }, + { lead: 'Follow packs', text: 'Amethyst suggests curated starter lists.' }, + { lead: 'nostr.directory & #nostr', text: 'find people who’ve linked their accounts.' }, + { lead: 'Follow ~20 people', text: 'a fuller feed makes everything click.' }, + ], + }, + }, + { + id: 'relays-what', + label: 'What are relays?', + component: BulletsSlide, + props: { + kicker: 'The infrastructure', + title: 'What is a relay?', + bullets: [ + { lead: 'A dumb server', text: 'that stores notes and rebroadcasts them to whoever asks.' }, + { lead: 'Anyone can run one', text: 'there are thousands; most are free.' }, + { lead: 'You connect to several', text: 'for redundancy — if one goes down, your notes live on the others.' }, + { lead: 'Relays don’t know each other', text: 'your app is what ties them together.' }, + ], + footnote: 'Feed feels slow or empty? It’s almost always your relay choice — not the app.', + }, + }, + { + id: 'outbox', + label: 'Outbox model', + component: OutboxSlide, + }, + { + id: 'relay-categories', + label: 'Relay categories', + component: RelayCategoriesSlide, + }, + { + id: 'relay-access', + label: 'Why the sets differ', + component: RelayAccessSlide, + }, + { + id: 'paid-relays', + label: 'Paid vs free', + component: BulletsSlide, + props: { + kicker: 'Choosing relays', + title: 'Free, paid & where to look', + bullets: [ + { lead: 'Most relays are free', text: 'great to start — just add a few big, reliable ones.' }, + { lead: 'Open relays double up', text: 'a free, openly-readable/writable relay (nos.lol) can sit in several lists at once.' }, + { lead: 'Paid relays stay in their lane', text: 'nostr.wine & co. restrict access — keep them category-specific (e.g. DMs), never your public inbox.' }, + { lead: 'Browse & health-check', text: 'nostr.watch shows which relays are up, fast, free vs. paid, and reputable.' }, + ], + }, + }, + { + id: 'first-actions', + label: 'First actions', + component: BulletsSlide, + props: { + kicker: 'You’re on', + title: 'Post your first note — and zaps', + bullets: [ + { lead: 'Just start typing', text: 'hit post; it goes to your outbox relays and out to the world.' }, + { lead: 'Reply, like, repost', text: 'same as any social app — but portable.' }, + { lead: 'Zaps ⚡', text: 'send real Bitcoin tips over Lightning by tapping the zap icon.' }, + { lead: 'Add a wallet later', text: 'connect a Lightning wallet to send and receive zaps.' }, + ], + }, + }, + { + id: 'zap', + label: 'How a zap works', + component: ZapSlide, + }, + { + id: 'recap', + label: 'Recap', + component: ResourcesSlide, + props: { + kicker: 'You made it', + title: 'Recap & resources', + takeaways: [ + 'Your keys are your identity — guard the nsec.', + 'You publish to relays you choose; followers read from them (outbox).', + 'Set ~3 outbox, ~3 inbox, ~3 DM relays and you’re sorted.', + 'No server owns you — move apps and relays freely.', + ], + links: [ + { label: 'nostr.how — get started', url: 'https://nostr.how/en/get-started' }, + { label: 'Vitor Pamplona — Relay Setup 101', url: 'https://vitor.npub.pro/post/relay-setup/' }, + { label: 'nostr.watch — browse relays', url: 'https://nostr.watch' }, + { label: 'Amethyst on GitHub', url: 'https://github.com/vitorpamplona/amethyst' }, + ], + }, + }, +]