Wacintosh

Wacintosh is an interactive 3D recreation of the Macintosh 128k with System 1 OS, built using Three.js and React. It features authentic OS simulation, real-time 3D rendering, and responsive design. The project incorporates custom shaders and drag-and-drop functionality, demonstrating the seamless integration of 2D and 3D elements in modern web applications.

Live Demo

tv-code.github.io/wacintosh

Features

• Authentic Macintosh 128k interface recreation
• Interactive 3D environment
• Real-time rendering with Three.js
• Complex state management for OS simulation
• Drag-and-drop functionality
• Custom GLSL shaders
• Responsive design for all devices

Technologies Used

• React
• Three.js
• React Three Fiber
• DnD Kit
• Custom GLSL Shaders

Getting Started

Prerequisites

• Node.js (version 14 or later recommended)
• Yarn package manager

Installation

1. Clone the repository:

   git clone https://github.com/your-username/wacintosh.git
   

2. Navigate to the project directory:

   cd wacintosh
   

3. Install dependencies using Yarn:

   yarn install
   

Running the Development Server

To start the development server, run:

yarn start

The application will be available at http://localhost:3000.

Building for Production

To build the project for production, run:

yarn build

Deploying

To deploy the project, use:

yarn deploy

Note: If you encounter any issues with Yarn for building or deploying, you may need to use npm commands:

npm run build
npm run deploy

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

This project is licensed under the MIT License.

Acknowledgments

• Inspiration: Apple Macintosh 128k
• system1.css by sakofchit