Awesome

noten-lernen

Learn to read sheet music.

<a href="https://play.google.com/store/apps/details?id=de.melvil.noten"> <img src="https://play.google.com/intl/en_us/badges/static/images/badges/en_badge_web_generic.png" alt="Get it on Google Play" title="Get it on Google Play" width="200"> </a> <a href="https://apt.izzysoft.de/fdroid/index/apk/de.melvil.noten"> <img src="https://gitlab.com/IzzyOnDroid/repo/-/raw/master/assets/IzzyOnDroid.png" alt="Get it on IzzyOnDroid" title="Get it on IzzyOnDroid" width="200"> </a>

Demo

You can see the current status of the app on Netlify:

prod
dev

Screenshots

<p float="left"> <img src="https://raw.githubusercontent.com/MelvilQ/noten-lernen/master/screenshots/screenshot1.png" width="200"> <img src="https://raw.githubusercontent.com/MelvilQ/noten-lernen/master/screenshots/screenshot2.png" width="200"> <img src="https://raw.githubusercontent.com/MelvilQ/noten-lernen/master/screenshots/screenshot3.png" width="200"> <img src="https://raw.githubusercontent.com/MelvilQ/noten-lernen/master/screenshots/screenshot4.png" width="200"> </p>

Technologies

PWA (it has a manifest.json and a service worker which caches all necessary files for offline use)
Cordova (to package the app and put it on Google Play)
Frontend-Framework: Vue
Rendering music with JavaScript: abc.js
Statistics line chart: chartist.js
Multilinguality Plugin: vue-i18n
WebMIDI, for MIDI keyboard input: webmidi

Development Setup

Web App

Install node.js if you don't already have it
Clone the repo
Run npm i in the command line to install the dependencies
Start the dev server with the command npm start

Android App

To run the app locally on Android, make sure you have Cordova and Android Developer Tools installed
cd cordova followed by npm i to install the Cordova dependencies
Connect your Android device and run npm run mobile
Release build: npm run build in the cordova directory (only possible with keystore)