Internet Architecture

Categories:

• INT

High-Level Architecture Overview

This diagram provides a simplified view of the major components and their interactions.

graph TD
    U[Users] --> WP[Web Presence]
    U --> MA[Mobile App]
    MA --> BE[Backend Services]
    %% Dashed line indicates potential or indirect interaction
    WP -.-> BE

    CM[Code Management] -- Deploys or Builds --> WP
    CM -- Deploys or Builds --> MA
    CM -- Deploys or Builds --> BE

    subgraph Web Presence
        CFP[Cloudflare Pages Sites]
        WPH[WordPress Site]
        ETSY[Etsy Store]
    end

    subgraph Mobile App
        IOS[iOS App]
        AND[Android App]
    end

    subgraph Backend Services
        FB[Firebase/GCP]
        GCS[Cloud Storage]
    end

    subgraph Code Management
        GH[GitHub Repos]
    end

    classDef component fill:#lightblue,stroke:#333,stroke-width:2px;
    class WP,MA,BE,CM component;

Component Details

The following sections provide more detailed diagrams for specific parts of the architecture.

Web Presence: User Access & Platforms

This diagram shows how users access the various web platforms.

graph TD
    subgraph User_Interaction
        U_GEN[Users]
        U_EXT[EXT team]
        U_INT[INT team]
    end

    subgraph Platforms
        subgraph Cloudflare_Pages
            WWW["<a href='https://www.thephenom.app/' target='_blank'>www.thephenom.app</a>"]
            DOCS["<a href='https://docs.thephenom.app/' target='_blank'>docs.thephenom.app</a>"]
            EXT_DOCS["<a href='https://ext-docs.thephenom.app/' target='_blank'>ext-docs.thephenom.app</a>"]
            INT_DOCS["<a href='https://int-docs.thephenom.app/' target='_blank'>int-docs.thephenom.app</a>"]
            NEST["<a href='https://nest.thephenom.app/' target='_blank'>nest.thephenom.app</a>"]
        end
        subgraph WordPress_Hosting
            ECHO_SITE["<a href='https://phenom.earth/' target='_blank'>phenom.earth</a>"]
        end
        subgraph Third_Party
            ETSY["<a href='https://www.etsy.com/shop/phenomenation/' target='_blank'>Etsy Store</a>"]
        end
    end

    %% Management subgraph removed

    %% Connections
    %% General users access main docs
    U_GEN -- Accesses --> DOCS
    U_GEN -- Accesses --> ECHO_SITE
    U_GEN -- Accesses --> ETSY
U_GEN -- Accesses --> WWW
    %% U_EXT -- Accesses --> WWW %% Removed as per feedback
    %% External users access external docs
    U_EXT -- Accesses --> EXT_DOCS
    %% U_EXT -- Accesses --> ECHO_SITE %% Removed as per feedback
    %% U_EXT -- Accesses --> ETSY %% Removed as per feedback
    %% Internal users access internal docs
    U_INT -- Accesses --> INT_DOCS
    U_INT -- Accesses --> NEST

    %% Site Management section removed

    %% Styling
    %% classDef manager removed
    %% class MS removed

    %% Click interactions for hyperlinks
    %% click ECHO_SITE removed, using HTML link in node definition
    %% click ETSY removed, using HTML link in node definition
%% click WWW removed, using HTML link in node definition

Web Presence: Code Management & Deployment

This diagram illustrates the relationship between GitHub repositories, the teams managing them, and where the code is deployed.

graph LR
    %% Changed to LR for better flow
    subgraph Code_Management [GitHub: Phenom-earth]
        subgraph Repositories
            GH_WWW[phenom-www]
            GH_DOCS[phenom-earth-docs]
            GH_ECHO[phenom-echo]
            GH_MERCH[phenom-merch]
            GH_BACKEND[phenom-backend]
            GH_RXN[PhenomRxn]
            GH_BUZZARD_IOS[Buzzard-ios]
            GH_BUZZARD_AND[Buzzard-Android]
        end
        subgraph Teams
            T_MARCOM[Marcom Team]
            T_INT[INT Team]
            T_EXT[EXT Team]
            T_ECHO[ECHO Team]
            T_MERCH[Merch Team]
        end
    end

    subgraph Deployment_Targets
        CFP[Cloudflare Pages]
        WPH[WordPress Hosting]
        AS[Apple App Store]
        PS[Google Play Store]
        EXPO[expo.dev]
        BETA_DEVICES[Beta-Tester Devices]
    end

    %% Team Management & Deployment
    T_MARCOM -- Manages --> GH_WWW
    GH_WWW -- Deploys_to --> CFP

    T_INT -- Manages --> GH_DOCS
    T_INT -- Manages --> GH_BACKEND
    T_INT -- Manages --> GH_RXN

    T_EXT -- Manages --> GH_BUZZARD_IOS
    T_EXT -- Manages --> GH_BUZZARD_AND

    GH_BUZZARD_IOS -- Deploys_to --> AS
    GH_BUZZARD_AND -- Deploys_to --> PS

    GH_DOCS -- Deploys_to --> CFP
    GH_BACKEND -- Deploys_to --> CFP
    GH_RXN -- Deploys_to --> EXPO
    EXPO -- Deploys_to --> BETA_DEVICES

    T_ECHO -- Manages --> GH_ECHO
    GH_ECHO -- Deploys_to --> WPH

    T_MERCH -- Manages --> GH_MERCH
    %% Merchandise repo managed here, deployed elsewhere (see Merchandise Flow)

    %% Styling
    classDef team fill:#f9f,stroke:#333,stroke-width:2px;
    class T_MARCOM,T_INT,T_EXT,T_ECHO,T_MERCH team;

Web Presence: Merchandise Flow

This diagram focuses specifically on the merchandise management and update process.

graph TD
    subgraph Code_Management [GitHub: Phenom-earth]
         GH_MERCH[phenom-merch]
         T_MERCH[Merch Team]
    end

    subgraph Third_Party ["Third Party"]
        ETSY[Etsy Store]
    end

    %% Merchandise Flow
    T_MERCH -- Manages --> GH_MERCH
    T_MERCH -- Updates --> ETSY
    GH_MERCH -- Contains_Assets_for --> ETSY

    %% Styling
    classDef team fill:#f9f,stroke:#333,stroke-width:2px;
    class T_MERCH team;

Mobile App Architecture (Phenom App)

graph TD
    direction LR
    subgraph User_Interaction
        U[Users]
        MA[Mobile App iOS_Android]
    end
    subgraph Backend_Services ["Backend (Firebase/GCP)"]
        FB[Firebase Backend_Auth]
        GCS[Google Cloud Storage User_Content]
    end
    subgraph Distribution
        AS[Apple App Store]
        PS[Google Play Store]
    end
    subgraph Code_Management [GitHub: Phenom-earth]
        GH_BUZZARD_IOS[Buzzard-ios]
        GH_BUZZARD_AND[Buzzard-Android]
        T_EXT[EXT Team]
    end

    U -- Uses --> MA
    MA -- Connects_to --> FB
    MA -- Accesses --> GCS
    FB -- Interacts_with --> GCS
    %% MA -- Distributed_via --> AS %% Replaced by repo deployment
    %% MA -- Distributed_via --> PS %% Replaced by repo deployment

    T_EXT -- Manages --> GH_BUZZARD_IOS
    T_EXT -- Manages --> GH_BUZZARD_AND
    GH_BUZZARD_IOS -- Connects_to --> Backend_Services
    GH_BUZZARD_AND -- Connects_to --> Backend_Services
    GH_BUZZARD_IOS -- Deploys_to --> AS
    GH_BUZZARD_AND -- Deploys_to --> PS
    %% Buzzard is the backend

    %% Styling
    linkStyle default interpolate basis
    classDef team fill:#f9f,stroke:#333,stroke-width:2px;
    class T_EXT team;

(Note: Documentation hosting via CloudFront and Backup Storage (TBD) are omitted from these specific diagrams for clarity but remain relevant to the overall infrastructure.)

Key Components & Services

1. Website Hosting & Email

• Provider: OrangeHost (Managed by Celestino Enterprises)
• Services: Hosts the main phenom.earth website. Handles email for the phenom.earth domain.
• SSL: Provided by Let’s Encrypt, likely managed via OrangeHost control panel or server configuration.

2. Mobile App Backend & Authentication

• Provider: Firebase
• Services: Provides backend services (e.g., Firestore database, Cloud Functions) and handles user authentication for the mobile app.

3. User Content Storage

• Provider: Google Cloud Storage (GCS)
• Purpose: Stores user-generated content uploaded via the mobile app. Accessed by Firebase backend.

4. Documentation Hosting

• Provider: AWS CloudFront (CDN)
• Purpose: Hosts and distributes the static documentation site for performance and availability. Assumes content is stored in an origin like S3.

5. Mobile App Distribution

• Platforms: Apple App Store, Google Play Store
• Purpose: Official channels for users to download and update the The Phenom App mobile application.

6. Code Repositories

• Provider: GitHub
• Purpose: Stores all source code for the website, mobile app, backend services, and documentation.

7. Domain Name System (DNS)

• Provider: Likely managed via OrangeHost or the domain registrar where phenom.earth was purchased.
• Records: Points phenom.earth to OrangeHost, docs.phenom.earth (or similar) to CloudFront, and includes MX records for email delivery to OrangeHost.

8. Backup Storage

• Provider: TBD (To Be Determined)
• Purpose: Securely store backups of critical data (databases, user content, code). Needs definition.

9. Monitoring & Logging

• Tools: TBD (Firebase offers some monitoring, Google Cloud, potentially OrangeHost logs. A dedicated solution might be needed).
• Purpose: Track application performance, errors, and system health.

Security Considerations

• SSL/TLS: Enforced via Let’s Encrypt (OrangeHost) and managed services (Firebase, CloudFront, GCS).
• Firebase Security Rules: Crucial for protecting backend data.
• GCS Bucket Permissions: Restrict access to user content.
• GitHub Security: Branch protection rules, secret scanning.
• OrangeHost Security: Depends on management practices by Celestino Enterprises (Firewalls, updates).
• Regular Audits: Recommended for all components.

(Details based on provided information. Specific configurations for DNS, CloudFront origin, Backup, and Monitoring need further definition.)