This was a project I built as my final project for the University of Windsor, for COMP-4960. The class spanned two semesters, in which time, I was expected to select a project supervisor, brainstorm an idea, work on it and write a report on it. Inspired by the two Node.js applications I built from a Udemy course the summer prior, I chose to create another Node.js application. This application would be a sheet music project that would allow users to log in to an existing account or sign up for a new one, create a very simple piece of sheet music and display it in the web browser.
Building the entire project from start to finish took about four months to complete. After creating the first few files and getting the Express server up and running, I began connecting the application to a database. I was originally planning on using a MongoDB database, like the two aforementioned Node.js applications I worked on. However, as we were originally planning on pushing the application up to the university's myweb server, and connecting the application to my Atlas account would have created firewall issues on the myweb server, we switched to a MySQL database instead. Like the previous two applications, the views were powered by EJS. Additionally, I also decided to use SCSS instead of vanilla CSS. Client-side JavaScript used on the pages for each individual score are powered by Webpack.
After logging in, a user can view their already-created scores, or press the plus button and create a new one. Then, they are taken to a page where they can enter in some information about their score. Then, they are taken to the newly-created score page with the information entered filled into an empty piece of sheet music and can begin adding notes. A user can click a rest or note and add notes above the score. They can also press the up or down arrow keys to move a note up or down or press the left or right arrow keys to move to the previous or next note. They can press the "Click here to add a new bar" button to create a new bar and press the save button to save their score. All musical notation is displayed using a font called Bravura Text, which contains special characters. Relative and absolute positioning displays each clef, bar line, note, rest, etc. where it should be.
This application does have its limitations. For one thing, only scores in the keys of C major or A major work. There are no sharps, flats or accent marks. A user cannot have a time signature with a number with more than two digits, such as 12/8. Each clef can only have one note at a time. You cannot change the score from public to private or vice versa once it is created. Finally, the score only creates piano scores. There is also no validation to make sure that if a user tries to go into inspect element and add more or fewer notes or rests that fit in a bar, it doesn't save. However, I am satisfied with what I was able to do in the limited time I had to complete the project. I ended up receiving a final mark of 90 in COMP-4960 for this project.