A dynamic, interactive music sight-reading application that helps you practice piano by connecting your MIDI keyboard.
- Interactive MIDI Feedback: Real-time highlighting of the current beat and visual feedback for correct/incorrect notes.
- Dynamic Music Generation: Randomly generates music based on your selected settings (staff type, key, range, rhythm).
- Customizable Layout: Adjust measures per line and total lines to fit your screen.
- Full Piano Range Support: Configure note ranges from A0 to C8 (88 keys).
- Key Signature & Chromatic Support: Practice in any major key or with random chromaticism.
- Windows X86: Download v1.0.0
- Intel Mac: Download v1.0.0
- Apple Silicon (M1/M2/M3) Mac: Download v1.0.0
For more information on how to use the application and its features, see the User Guide.
https://github.com/0xfe/vexflow/wiki
- Vexflo is responsible for the music and staff rendering.
- It renders music to screen extremely well.
- All I did was add some logic and tests to exploit this library.
- In a single afternoon!
To run the project locally on your machine, ensure you have Node.js installed.
- Clone the repository (if you haven't already).
- Install dependencies:
npm install
- Run the development server:
Or use the npm script:
./run.sh
npm run dev
- Open your browser at the address provided by Vite (usually
http://localhost:5173).
The project can be run as a cross-platform desktop application using Electron.
-
Run in Desktop Mode:
npm run dev
(This starts the Vite server and opens the Electron window automatically)
-
Build Desktop Executables:
npm run build
The packaged application will be available in the
release/directory for your current platform.
To deploy the application to a server, you need to build the optimized assets first.
-
Build the project:
./build_prod.sh
Or use the npm script:
npm run build
-
Deploy: The optimized files will be in the
dist/directory. You can serve this directory using any static web server (e.g., Nginx, Apache, or a service like Vercel/Netlify). -
Preview locally: To test the production build locally:
npm run preview
The project includes a comprehensive test suite.
- Run all tests with informative output:
./test_all.sh
- Run tests using Vitest:
npm run test
To understand how to configure the application and explore its full feature set, check out the USER_GUIDE.md.