A unique, retro-inspired personal portfolio website that mimics the classic desktop operating systems of the 90s (Windows 95/98). Built with modern web technologies to deliver a nostalgic yet responsive experience.
- Retro Desktop Interface: A fully functional desktop environment with a taskbar, start button, and clock.
- Interactive Icons: Double-click icons to open files, folders, or links.
- Window Management:
- Draggable Windows: Move windows around the desktop.
- Taskbar Integration: Minimized/Active windows appear in the taskbar.
- Multiple Windows: Open multiple folders and text files simultaneously.
- Random Positioning: Windows spawn at slightly random positions to prevent overlap.
- File System Simulation: A structured data approach to managing desktop items (files, folders, links).
- Custom "About Me" Viewer: A retro text editor style viewer for reading bio information.
- Mobile Responsive: Optimized for various screen sizes, ensuring the retro feel works on mobile devices.
- Frontend Framework: React
- Build Tool: Vite
- Styling: Tailwind CSS
- Icons: Custom SVG icons for a crisp, scalable retro look.
- Node.js (v16 or higher recommended)
- npm or yarn
- Clone the repository:
git clone https://github.com/eddyalder/edwardalder.dev.git
- Navigate to the project directory:
cd edwardalder.dev - Install dependencies:
npm install
Start the development server:
npm run devOpen your browser and navigate to http://localhost:5173 (or the port shown in your terminal).
To create an optimized production build:
npm run buildThe output will be in the dist directory.
src/components: React components (Desktop, Window, DesktopIcon, etc.)src/data: Static data files (fileSystem.js)public: Static assets (images, PDFs, favicons)
This project is open source and available under the MIT License.
Built with ❤️ and nostalgia by Edward Alder.