Fenix

Fenix structures real-time communication by isolating identity, application routing, media transport, and server-side token generation into distinct operational boundaries.

Clerk handles authenticated user identity and session persistence across the application.

Next.js provides the application routing layer, layout structures, and server action infrastructure.

Stream Video manages real-time media transport, peer connections, and participant presence state.

The server generates cryptographically signed Stream tokens using the Stream Node SDK without leaking master API secrets.

React components coordinate device previews, active room controls, dynamic layouts, and participant dialogs.

The system unifies Clerk session identity with the Stream Video React SDK. Rather than embedding credentials in the browser, a custom Stream provider initializes the client with the authenticated Clerk user and a secure token provider. Server actions use the Stream Node SDK to issue short-lived cryptographic tokens, granting authenticated entry to the active meeting room.

Wraps the application tree in StreamVideoProvider, configuring the client only when the Clerk user is fully loaded and verified.

Instantiates StreamClient with secret API credentials on the server to sign user tokens with an expiration timestamp.

Fenix manages the meeting lifecycle through explicit setup and active stages. Calls are initialized with the Stream client, generating unique meeting IDs, shareable meeting URLs, and scheduled start times. Before entering the room, access permissions and device hardware are validated, enabling seamless entry into active call layouts.

Users can toggle on the fly between equal-weight grid tiles and speaker-focused layouts with participant sidebars.

Displays connected users, active speaking indicators, individual mute states, and connection quality indicators.

Surfaces real-time network latency, video bitrate, frame rates, and packet loss metrics directly within the UI.

Real-time collaborative applications require engineering solutions for asynchronous connection states, hardware permission lifecycle, access control, and dynamic multi-participant UI presentation.

The technology stack strictly reflects verified dependencies declared in the Fenix package manifest. Stream Video SDK provides battle-tested real-time media transport, while Next.js App Router and Clerk enforce server/client isolation.

Relies directly on @stream-io/video-react-sdk rather than claiming unverified raw WebRTC transport layers.

Stream API secrets and token signing keys are isolated within server action boundaries (actions/stream.actions.ts).

Meeting controls and modal dialogs leverage Radix UI primitives for keyboard navigation and screen reader support.

Examining how core product requirements were broken down from architectural constraints into concrete implementations within the Fenix codebase.

Key engineering decisions focused on delegating complex infrastructure primitives (identity, real-time media transport) so engineering effort could be directed toward meeting lifecycle management, device controls, and call UX.

The meeting room is modeled as an explicit state machine that steps from authentication verification through call discovery, access validation, and hardware configuration into the active meeting session before exiting cleanly.

The meeting management interface supports four primary home actions (New Meeting, Join Meeting, Schedule Meeting, View Recordings) paired with an active in-call suite of controls.

Generates an immediate call with a unique UUID, initializes Stream state, and routes directly to setup.

Accepts a shareable link or meeting ID input, queries call availability, and checks user authorization.

Configures start time, date, and description, saving the meeting to the user's scheduled dashboard list.

Live camera video preview, device selection, and mic/camera toggle before joining the active call.

Interactive real-time media streams with automatic speaking indicators and active participant tracking.

Toggles live between equal-weight Grid view, Speaker Left view, and Speaker Right view without reconnecting.

Opens a sidebar listing all connected participants with mute indicators and membership status.

Provides network latency, resolution, bitrate, and packet loss diagnostics for technical troubleshooting.

Surfaces past meeting recordings stored via Stream Video for asynchronous review.

Fenix is evaluated on verifiable engineering deliverables rather than fabricated benchmark metrics. The outcomes demonstrate complete real-time capability coverage, device control, and authenticated access.

The Fenix codebase is structured as a modular full-stack application, cleanly separating route handlers, UI components, custom reactive hooks, server actions, and SDK providers rather than overloading single files.

The complete architectural arc of Fenix spans user authentication through Clerk, application state management in Next.js, cryptographic Stream token signing via server actions, and active media coordination across video, audio, and participant streams.