provisioning-outreach/presentations/rust-laspalmas-250926/info/framework_plan.md

how can I reuse all this setup for poster as a generic framework to be used for one or several pages that can share assets ?

⏺ Let me analyze the current poster build system and design a plan for transforming it into a reusable framework for multiple pages with
  shared assets.

⏺ Bash(ls -la scripts/)
  ⎿  total 176
     drwxr-xr-x@ 10 jesusperezlorenzo  admin    320 Sep 18 11:56 .
     drwxr-xr-x@ 14 jesusperezlorenzo  admin    448 Sep 18 11:57 ..
     … +8 lines (ctrl+o to expand)

⏺ Bash(tree -L 2 -a)
  ⎿  .
     ├── assets
     │   ├── css
     … +57 lines (ctrl+o to expand)

⏺ Read(config/build.config.toml)
  ⎿  Read 77 lines (ctrl+o to expand)

⏺ Bash(ls src/assets/css/modules/)
  ⎿  animations.css
     base.css
     components.css
     patterns.css

⏺ Bash(ls src/)
  ⎿  assets
     components
     index.html

⏺ Based on my analysis of the current poster build system, I can see it's already well-structured with modular scripts, optimization
  tools, and configuration management. Now let me design a plan to transform it into a reusable framework for multiple pages with shared
  assets.

⏺ User approved Claude's plan:
  ⎿  Plan: Transform Poster Build System into a Multi-Page Framework

     1. Project Structure Reorganization

     Create a new framework structure that supports multiple pages:

     web-builder-framework/
     ├── framework/           # Core framework (current scripts)
     │   ├── core/
     │   │   ├── build.nu
     │   │   ├── dev.nu
     │   │   ├── prod.nu
     │   │   └── utils.nu
     │   ├── optimizers/
     │   │   ├── css.nu
     │   │   ├── html.nu
     │   │   └── svg.nu
     │   └── templates/
     │       └── page.config.toml.template
     ├── shared/             # Shared assets across all pages
     │   ├── css/
     │   │   ├── base/      # Common reset, typography
     │   │   ├── components/ # Reusable components
     │   │   └── utilities/ # Helper classes
     │   ├── svg/
     │   │   └── common/    # Shared icons, logos
     │   └── js/            # Shared JavaScript if needed
     ├── pages/              # Individual page projects
     │   ├── homepage/
     │   │   ├── config.toml
     │   │   ├── src/
     │   │   └── dist/
     │   ├── poster-rust/    # Current poster
     │   │   ├── config.toml
     │   │   ├── src/
     │   │   └── dist/
     │   └── about/
     │       ├── config.toml
     │       ├── src/
     │       └── dist/
     └── sites/              # Multi-page site configurations
         └── rust-meetup/
             └── site.config.toml

     2. Enhanced Configuration System

     Page-Level Config (pages/*/config.toml):

     [page]
     name = "rust-poster"
     title = "Rust Meetup 2025 Poster"
     type = "single"  # single, landing, article

     [shared]
     # Reference shared assets
     css_modules = [
         "@shared/base/reset.css",      # From shared
         "@shared/components/card.css",  # From shared
         "local/poster.css"              # Page-specific
     ]
     svg_sprites = ["@shared/common/icons.svg"]

     [local]
     # Page-specific settings
     css_modules = ["poster.css", "animations.css"]
     critical_modules = 2

     Site-Level Config (sites/*/site.config.toml):

     [site]
     name = "rust-meetup-site"
     pages = ["homepage", "poster-rust", "about"]
     shared_assets = true

     [build]
     output_dir = "dist/site"
     combine_assets = true  # Combine CSS/JS across pages
     generate_sitemap = true

     3. Framework CLI Commands

     New command structure:
     # Page-specific commands
     wb page create <name> --template <type>
     wb page build <name> [--dev|--prod]
     wb page dev <name> --watch
     wb page list

     # Site-wide commands
     wb site build <site-name>
     wb site dev <site-name>
     wb site deploy <site-name>

     # Shared asset management
     wb shared add-css <file>
     wb shared add-svg <file>
     wb shared list

     # Framework management
     wb init <project-name>
     wb upgrade

     4. Core Framework Features

     Asset Resolution System:

     - @shared/ prefix for shared assets
     - @page/<name>/ for cross-page references
     - Automatic deduplication
     - Smart bundling

     Build Pipeline Enhancements:

     # New build function signature
     def build_page [
         page_name: string,
         config_override?: record,
         --shared-context: record  # From site build
     ] {
         # Load page config
         let page_config = load_page_config $page_name

         # Resolve shared assets
         let resolved_assets = resolve_assets $page_config

         # Build with context
         ...
     }

     Template System:

     # Page template generator
     def create_page_from_template [
         name: string,
         template: string
     ] {
         # Copy template structure
         # Generate config
         # Setup initial files
     }

     5. Shared Asset Management

     CSS Strategy:

     - Shared base: Reset, typography, utilities
     - Shared components: Buttons, cards, modals
     - Page-specific: Unique styles per page
     - Smart bundling: Combine or split based on usage

     SVG Management:

     - Symbol library: Shared icons as symbols
     - Sprite sheets: Per-page or global
     - Inline optimization: Auto-inline small SVGs

     6. Multi-Page Site Builder

     # Site builder orchestrator
     def build_site [site_name: string] {
         let site_config = load_site_config $site_name

         # Build all pages
         let pages = $site_config.pages | par-each { |page|
             build_page $page --shared-context $site_config.shared
         }

         # Combine assets if needed
         if $site_config.combine_assets {
             combine_site_assets $pages
         }

         # Generate site-wide files
         generate_sitemap $pages
         generate_manifest $pages
     }

     7. Development Experience

     Watch Mode Improvements:

     - Watch shared assets globally
     - Rebuild dependent pages on shared changes
     - Hot reload across multiple pages

     Dev Server Enhancements:

     - Serve multiple pages from single server
     - Route mapping for multi-page sites
     - Shared asset proxying

     8. Migration Path

     1. Phase 1: Restructure current code into framework/
     2. Phase 2: Extract shared assets from poster
     3. Phase 3: Create page wrapper for current poster
     4. Phase 4: Add multi-page commands
     5. Phase 5: Create example second page
     6. Phase 6: Add site-level orchestration

     Benefits of This Approach

     1. Reusability: Core framework separated from page content
     2. Scalability: Easy to add new pages
     3. Efficiency: Shared assets reduce duplication
     4. Flexibility: Pages can be built individually or as sites
     5. Maintainability: Clear separation of concerns
     6. Performance: Smart bundling and optimization
     7. Developer Experience: Simple CLI, good defaults

     This framework would allow you to:
     - Create new pages quickly with templates
     - Share common assets efficiently
     - Build single pages or complete sites
     - Maintain consistent optimization across all pages
     - Deploy individual pages or entire sites