More Premium Hugo Themes Premium React Themes

Playground Macos

My portfolio website simulating macOS's GUI, developed with React and UnoCSS.

Playground Macos

My portfolio website simulating macOS's GUI, developed with React and UnoCSS.

Author Avatar Theme by renovamen
Github Stars Github Stars: 3338
Last Commit Last Commit: May 2, 2024 -
First Commit Created: Aug 27, 2024 -
default image

Overview:

The playground-macos is a portfolio website that simulates the graphical user interface (GUI) of macOS. It is powered by React, Zustand, UnoCSS, TypeScript, and Vite. The website offers both light mode and dark mode for user preference.

Features:

  • GUI Simulation: The website replicates the look and feel of macOS’s GUI.
  • React Powered: Built with React for dynamic and interactive components.
  • Light and Dark Mode: Offers both light and dark mode themes for users to choose from.
  • Battery State Simulation: Simulates the device’s actual battery state using the Battery API, showing 100% charge on unsupported browsers.

Installation:

  1. Clone the repository:
    git clone [repository-url]
    
  2. Install dependencies:
    npm install
    
  3. Start the development server with hot reloading:
    npm run dev
    
  4. Build for production with minification to the dist folder:
    npm run build
    

Summary:

The playground-macos portfolio website is a unique project that replicates the macOS GUI using modern web technologies like React, Zustand, UnoCSS, TypeScript, and Vite. With features like battery state simulation and light/dark modes, this website offers an interactive and visually appealing user experience. The clear installation guide makes it easy for users to set up the project and explore its functionalities.