deepanshurajput-2027/portfolio

Purpose and Runtime

This is a client-only React portfolio presented as a macOS-like desktop. Vite provides the development/build runtime and React renders the interactive UI. There is no server, API layer, database, or authentication evident.

Entry points:

• index.html loads the application shell.

• src/main.jsx mounts React.

• src/App.jsx composes the desktop experience and top-level state.

• vite.config.js configures the Vite build.

Application Shell and Lifecycle

src/App.jsx is the central orchestrator. It likely controls startup/loading transition, currently open desktop windows, and composition of navigation, dock, and window content. Global visual styling is centralized in src/app.css.

Startup is represented by:

• src/components/LoadingScreen/LoadingScreen.jsx

• src/components/LoadingScreen/LoadingScreen.css

• public/startup.mp3

The loading screen is an explicit boundary before the interactive desktop is exposed; audio is served as a static public asset.

Desktop Navigation and App Launching

The dock is the primary application launcher:

• src/components/Dock/Dock.jsx

• src/components/Dock/DockIcon.jsx

• src/components/Dock/DockRender.jsx

Its available applications and icon metadata are data-driven through src/data/dockData.js. DockRender.jsx is the dispatch boundary between dock item identity and the corresponding window component. Dock-specific CSS separates interaction/layout from the rest of the desktop.

A secondary top navigation/status region is implemented by:

• src/components/Nav/Nav.jsx

• src/components/Nav/Nav.css

• src/components/DateTime.jsx

Shared Window Framework

All desktop applications are expected to render inside a reusable macOS-style window abstraction:

• src/components/windows/MacWindow/MacWindow.jsx

• src/components/windows/MacWindow/components/WindowHeader.jsx

• src/components/windows/MacWindow/hooks/useWindowAnimations.js

This framework owns the common chrome and animation behavior, while individual application windows own their content. Shared window styling resides in src/components/windows/Window.css. This is the key UI boundary for adding or changing desktop apps without duplicating frame behavior.

Portfolio Content Windows

The dock opens specialized portfolio surfaces, each with isolated markup and styling:

• Resume viewer: src/components/windows/Resume/Resume.jsx, public/Resume.pdf

• Certifications browser: src/components/windows/Certifications/Certifications.jsx, src/data/certifications.json

• GitHub/project display: src/components/windows/Github/Github.jsx, src/assets/github.json

• Command-line portfolio interface: src/components/windows/Cli/Cli.jsx, src/data/cliData.js

Certification documents are static PDFs under public/certification/; the JSON data likely supplies labels, links, or grouping. GitHub content is bundled local JSON rather than fetched from the GitHub API.

Communication and Media Windows

Additional desktop apps provide interactive presentation features:

• Mail/contact UI: src/components/windows/Mail/Mail.jsx, src/components/windows/Mail/components/MailFormFields.jsx, src/components/windows/Mail/components/MailToolbar.jsx

• Notes content: src/components/windows/Note/Note.jsx

• Spotify-themed media UI: src/components/windows/Spotify/Spotify.jsx

No backend or email provider integration is visible in the tree, so the mail window should be treated as client-side UI unless its implementation introduces an external action. Spotify likewise appears to be a local presentation component, not a service integration.

Static Asset Boundary

public/ contains browser-served files referenced directly by the UI: PDFs, certification documents, icon sets, and startup audio. Bundled application data/assets live under src/data/ and src/assets/. This separation matters when adding content: public files are URL-addressable at runtime, while src content participates in the Vite module graph and build.