Back to Work
Enterprise UI

Enterprise Web File Explorer

Microsoft-style file management interface with folders, uploads, metadata, previews, permissions, and scalable UI state.

Role

Frontend / Full Stack Engineer

Timeline

2023

Type

Enterprise UI

Next.jsReactTypeScriptMUINestJSPostgreSQLVirtual Lists

Summary

A desktop-grade file management UI for web applications. Supports nested folder navigation, multi-file uploads with progress, permission-based access, preview panels, and virtualized rendering for large directories.

The Hard Part

Maintaining a coherent nested folder tree state, handling concurrent uploads with progress tracking, and rendering large file lists without performance degradation.

Visual Proof

Protected enterprise system. Screenshots and architecture are sanitized. Sensitive implementation details, credentials, and internal endpoints are omitted for security.

younesattaoui.dev
File Explorer — Light Mode — Full file explorer interface in light mode with folder tree, file list, and metadata panel.

File Explorer — Light Mode

Full file explorer interface in light mode with folder tree, file list, and metadata panel.

younesattaoui.dev
File Explorer Overview — Main file management view with folder navigation, file grid, and action toolbar.

File Explorer Overview

Main file management view with folder navigation, file grid, and action toolbar.

younesattaoui.dev
File List View — Virtualized file list handling thousands of entries without performance degradation.

File List View

Virtualized file list handling thousands of entries without performance degradation.

younesattaoui.dev
Upload Panel — Multi-file upload panel with per-file progress, error handling, and retry support.

Upload Panel

Multi-file upload panel with per-file progress, error handling, and retry support.

younesattaoui.dev
Folder Navigator — Nested folder tree with expand/collapse, breadcrumb trail, and keyboard navigation.

Folder Navigator

Nested folder tree with expand/collapse, breadcrumb trail, and keyboard navigation.

younesattaoui.dev
Metadata Panel — Right-side metadata panel showing file properties, permissions, and preview.

Metadata Panel

Right-side metadata panel showing file properties, permissions, and preview.

younesattaoui.dev
Permission Controls — Permission-based access control UI for managing folder and file visibility per role.

Permission Controls

Permission-based access control UI for managing folder and file visibility per role.

younesattaoui.dev
Search & Filter — Full-text search across file names, metadata, and tags with instant filter results.

Search & Filter

Full-text search across file names, metadata, and tags with instant filter results.

Full case study in progress.

Interested?

Let's talk about what I can build for you.

Open to senior full-stack roles, founding engineer positions, and contract engagements. Remote only.