Files
Michilis 76210db03d first commit
Made-with: Cursor
2026-04-01 02:46:53 +00:00

9.5 KiB

Belgian Bitcoin Embassy Website

1. Overview

The Belgian Bitcoin Embassy (BBE) website is a community-driven, Nostr-powered platform centered around a monthly Bitcoin meetup in Belgium.

It is not a corporate site or institutional platform. It is a lightweight, curated Nostr client that:

  • showcases the next meetup
  • connects users to the community
  • displays curated Bitcoin content
  • allows users to interact via Nostr (likes, comments)

The platform combines a simple public website with a role-based admin/moderation system.


2. Core Goals

The website must:

  • clearly present the next monthly meetup
  • grow the Belgian Bitcoin community
  • aggregate and curate Nostr content
  • allow social interaction via Nostr
  • remain simple, fast, and easy to maintain

3. Tech Direction

Frontend:

  • Next.js (App Router recommended)
  • Component-based architecture
  • Tailwind CSS (based on design system)

Backend:

  • Lightweight API (Node.js / Go)
  • Nostr integration layer
  • Caching layer for events and posts

Auth:

  • Nostr extension login (NIP-07 or signer)

4. Public Website Structure

Routes

  • / → Onepage homepage
  • /blog → Blog overview
  • /blog/[slug] → Blog post page
  • /admin → Dashboard (role-based)

5. Homepage (Onepage)

5.1 Hero

  • Headline: Biggest Bitcoin community in Belgium
  • Subtext: Monthly meetup + community
  • CTA:
    • Join Meetup
    • Join Telegram
    • Follow on Nostr

5.2 Next Meetup

Critical section.

Fields:

  • title
  • date
  • time
  • city
  • venue
  • description
  • link

Actions:

  • Attend / RSVP

5.3 About

Short explanation:

  • what BBE is
  • community-driven
  • beginner friendly

5.4 Why Join

  • meet local Bitcoiners
  • learn Bitcoin
  • discover events
  • connect with community

Platforms:

  • Telegram
  • Nostr
  • X
  • YouTube
  • Discord
  • LinkedIn

Each includes:

  • icon
  • short description
  • link

5.6 Blog Preview

  • featured posts
  • latest posts
  • categories

5.7 FAQ

  • beginner friendly?
  • do I need bitcoin?
  • cost?
  • location?

5.8 Final CTA

  • join meetup
  • follow community

6. Blog System (Nostr-Based)

Source

  • Nostr longform events
  • imported manually by admins

Flow

  1. Admin inputs event id or naddr
  2. Backend fetches from relays
  3. Event is parsed and cached
  4. Admin edits metadata
  5. Post is published

Blog Page /blog

  • list of posts
  • category filters
  • featured post

Blog Post /blog/[slug]

  • title
  • content
  • categories
  • author
  • Nostr interactions:
    • likes
    • comments

7. Nostr Interaction Layer

Users can:

  • login with Nostr
  • like posts (reactions)
  • comment (replies)
  • interact with events

Backend:

  • fetch events from relays
  • cache data
  • apply local moderation

Important:

  • no deletion on Nostr
  • moderation is local only

8. Roles & Auth

Auth

  • Nostr login (extension)
  • signature verification
  • session/JWT

Roles

Defined by pubkeys.

Admins:

  • set in .env

Moderators:

  • assigned by admins

9. Admin Dashboard

Route: /admin

Admins have full control.

Tabs

9.1 Overview

  • meetup summary
  • latest posts
  • quick actions

9.2 Events

  • create/edit meetups
  • mark upcoming/past
  • manage event content
  • moderate comments

9.3 Blog

  • import Nostr posts
  • edit metadata
  • assign categories
  • publish/unpublish
  • feature posts

9.4 Moderation

  • view comments
  • filter by post/event
  • hide content
  • block pubkeys (local)

9.5 Users

  • list users (pubkeys)
  • promote to moderator
  • remove moderator
  • block users

9.6 Categories

  • create/edit/delete
  • reorder

9.7 Relays

  • add/remove relays
  • set priority
  • test connectivity

9.8 Settings

  • site title
  • tagline
  • social links
  • feature toggles

9.9 Nostr Tools

  • manual fetch
  • cache refresh
  • debug events

10. Moderator Dashboard

Moderators have content-only control.

Tabs

10.1 Moderation

  • comment stream
  • hide spam
  • filter content

10.2 Events

  • view meetups
  • moderate comments
  • minor edits

10.3 Blog

  • edit metadata
  • assign categories
  • publish/unpublish

10.4 Reports (optional)

  • flagged content
  • moderation actions

11. Data Models

Meetup

  • title
  • description
  • date
  • location
  • link
  • status

Blog Post

  • nostr_event_id
  • title
  • slug
  • content
  • excerpt
  • categories
  • featured
  • visible

Category

  • name
  • slug

User

  • pubkey
  • role

12. Component Structure

Public:

  • HeroSection
  • NextMeetupCard
  • AboutSection
  • CommunityLinks
  • BlogPreview
  • FAQSection

Admin:

  • AdminSidebar
  • MeetupEditor
  • PostManager
  • CategoryManager
  • SettingsPanel

13. Design Principles

  • dark theme
  • Bitcoin orange accent
  • large whitespace
  • no borders (use spacing)
  • layered surfaces
  • minimal animation

14. MVP Scope

Build first:

  • homepage
  • blog
  • blog post page
  • Nostr login
  • admin dashboard
  • moderator dashboard
  • meetup system
  • Nostr blog import

15. Key Principle

This is not a CMS.

This is a curated Nostr client for a Bitcoin meetup community.

Keep it simple, fast, and focused on:

  • meetup
  • community
  • content

pages.md

1. Routing Overview

Public routes:

  • / → Homepage (onepage)
  • /blog → Blog listing
  • /blog/[slug] → Blog detail

Auth / Dashboard routes:

  • /admin → Dashboard entry (role-based)
  • /admin/overview
  • /admin/events
  • /admin/blog
  • /admin/moderation
  • /admin/users (admin only)
  • /admin/categories
  • /admin/relays (admin only)
  • /admin/settings (admin only)
  • /admin/nostr (admin only tools)

System routes (optional):

  • /api/* → Backend endpoints
  • /health → Health check

All /admin/* routes require Nostr authentication.


2. Layouts

2.1 Public Layout

Used by / and /blog*

Structure:

  • Top Navigation
  • Page Content
  • Footer

Top Navigation:

  • Logo (BBE)
  • Links (scroll or anchor):
    • Meetup
    • About
    • Community
    • Blog
  • CTA button: Join Meetup

Footer:

  • Logo
  • Links: Privacy, Terms, Contact
  • Social links

2.2 Admin Layout

Used by /admin/*

Structure:

  • Sidebar (left)
  • Content area (right)
  • Top bar (optional)

Sidebar:

  • Overview
  • Events
  • Blog
  • Moderation
  • Categories
  • (Admins only)
    • Users
    • Relays
    • Settings
    • Nostr Tools

Role-based rendering:

  • Moderator sees limited menu
  • Admin sees full menu

3. Homepage /

Single page composed of sections.

Sections (top to bottom)

3.1 HeroSection

Content:

  • headline
  • subtext
  • CTA buttons:
    • Join Meetup
    • Join Telegram
    • Follow on Nostr

3.2 NextMeetupSection

Data source: Meetup API

Content:

  • date
  • time
  • city
  • venue
  • description
  • CTA: Attend Meetup

3.3 AboutSection

Static/admin-editable content.

3.4 WhyJoinSection

Static list of benefits.

Dynamic from settings:

  • Telegram
  • Nostr
  • X
  • YouTube
  • Discord
  • LinkedIn

3.6 BlogPreviewSection

Data source: Blog API

Content:

  • featured post
  • latest posts

3.7 FAQSection

Static/admin-editable.

3.8 FinalCTASection

  • Join Meetup
  • Follow Community

4. Blog Listing /blog

Layout

  • Header (title + description)
  • Category filter
  • Post grid/list

Features

  • filter by category
  • highlight featured post
  • pagination or infinite scroll

Data

From cached Nostr posts.


5. Blog Detail /blog/[slug]

Layout

  • Title
  • Metadata (date, author)
  • Content
  • Categories
  • Interaction section
  • Related posts

Interaction

If user logged in (Nostr):

  • Like button
  • Comment input

Display:

  • likes count
  • comments (Nostr replies)

6. Admin Entry /admin

Behavior

  • if not logged in → show Nostr login screen
  • if logged in → redirect to /admin/overview

Login Screen

  • button: Login with Nostr extension
  • explanation text

7. Admin Pages

7.1 /admin/overview

Dashboard summary:

  • next meetup
  • recent posts
  • recent activity
  • quick actions

7.2 /admin/events

Meetup management.

Views:

  • list of meetups
  • create/edit form

Fields:

  • title
  • description
  • date/time
  • location
  • link

Actions:

  • create
  • edit
  • delete
  • mark featured

Moderation:

  • view comments
  • hide comments

7.3 /admin/blog

Blog management.

Views:

  • list of posts
  • import tool

Import flow:

  • paste event id or naddr
  • fetch preview
  • confirm import

Post editing:

  • title
  • excerpt
  • slug
  • categories
  • featured toggle
  • visibility toggle

7.4 /admin/moderation

Moderation center.

Views:

  • comment stream
  • filters:
    • by post
    • by event
    • by user

Actions:

  • hide comment
  • mark spam
  • block pubkey (local)

7.5 /admin/users (admin only)

User management.

Views:

  • list of pubkeys

Actions:

  • promote to moderator
  • remove moderator
  • block user

7.6 /admin/categories

Category management.

Actions:

  • create
  • edit
  • delete
  • reorder

7.7 /admin/relays (admin only)

Relay configuration.

Actions:

  • add relay
  • remove relay
  • set priority
  • test connection

7.8 /admin/settings (admin only)

Global settings.

Fields:

  • site title
  • tagline
  • social links
  • feature toggles

7.9 /admin/nostr (admin only)

Advanced tools.

Features:

  • manual event fetch
  • cache refresh
  • debug viewer

8. Access Control

  • /admin/* requires Nostr auth
  • roles checked server-side
  • UI adapts based on role

9. Error Pages

  • /404
  • /500

Simple, minimal, same design style.


10. Key Principles

  • keep routes minimal
  • keep pages focused
  • no unnecessary nesting
  • everything role-based

The structure must stay simple and predictable for developers.