This application (Practice Session Tracker or PST) is intended for musicians of all kinds as a way to log practice sessions. PST is capable of storing a date, time, time practiced, and notes for any number of a user's practice sessions. Sessions are protected by a login/logout procedure, only allowing a signed in user to view their own practice sessions. PST was created using a custom back end server supported by Ruby on Rails, and its front end was mainly developed using JavaScript.
This file is for the front end of the application.
Link to the front-end application: https://shecking.github.io/client-project2/
Link to the front-end repo: https://github.com/shecking/client-project2
Link to the back-end: https://rails-api-project2.herokuapp.com/ (note: used for testing, HTTP 404 error is expected)
Link to the back-end repo: https://github.com/shecking/rails-api-project2
This front end application, as well as its complementary back end framework, represent my second major project completed as a software engineer, and the first to involve a full stack development process. Building on my prior experience creating a front end application with a supplied back end, I followed a process that was quite similar; learn the structures and behaviors of the languages and programs I was working with, proceed slowly and methodically, and work toward a minimum viable product above all else.
I progressed with the project by closely aligning my work with a provided project schedule outline. This helps guide my thought process, structural planning, coding, and of course troubleshooting and error debugging. Throughout the process, I continually referenced personal notes, prior lessons and examples from my studies, and online documentation for language syntax and best practices. I also turned to fellow students and instructors for any particularly challenging problems to learn from their expertise or their own troubleshooting.
Specifically concerning the front end, the development was largely in areas I had more experience in, having completed a TicTacToe application using many of the same technologies I needed for this project. A new element introduced in this case was Handlebars, which is used for real-time, reactive display of user sessions on a page including editing and deleting. The syntax and use cases for Handlebars were particularly challenging, but the outcome is a cleaner, clearer code base; a extremely helpful feature for any fellow developers.
As a user, I want to be able to create my account. As a user, I want to be able to log in to my account. As a user, I want to be able to change the password of my account. As a user, I want to be able to log out of my account. As a user, I want to be able to log practice sessions with a date and time. As a user, I want to add how long I practiced in a session. As a user, I want to add personal notes to my practice sessions. As a user, I want to reference my past practice sessions. As a user, I want to see a total of time spent in all my sessions.
- HTML/CSS
- JavaScript
- Bootstrap
- jQuery/AJAX
- DOM/APIs
- JSON
- Handlebars
- GitHub
As of this initial version, the application is fully functional, enabling users to store data about multiple practice sessions over time. Improvements to be considered for future versions include modifications to make interfaces display fluidly and create a more engaging, user-friendly application, as well as the ability to track more precise session statistics for a user (i.e. progress on individual pieces of music).