Guitar Tab Creator Upgrade - Coronavirus Edition

Guitar Tab Creator has been around a long time.  The first instance on the "Wayback Machine" appeared in December of 2007, when the site was written in javascript, and had no ability to save or edit your tabs.  By August 2011, I made the decision to migrate over to the Drupal content management system, which it has been on ever since.  In February of 2016, Drupal 6 had retired, and, although I WANTED to upgrade, Drupal 7 did not make that easy for me, and my work and family life made it even harder, so, the site just stayed the same.  By that time, Drupal 8 had been released, and, in my head, I just assumed it would be a torturous task to migrate all of the content that had been created over to the new platform.  So, while I had ideas for the site, and I understood that using php 5, and Drupal 6 and a legacy version of jQuery presented serious security and update concerns,I never thought I'd be able to migrate the content, nor did I think I'd be able to find the time when I'd be stuck in my home so long that I could spend my weekends working on such a project.  And then, Coronavirus hit. Not wanting to go crazy from boredom, or start to play video games to waste the time away, I decided it would be a good time to learn a new skill, and, while I had many, I decided to see what was up with Drupal 8, and if there was a chance that I could actually move the site to a new version.  The three largest challenges I saw were first, would I be able to migrate the content created in Drupal 6 to Drupal 8, the second was how difficult would it be to upgrade my module to the new standards, and, finally, how much time would it take to convert the javascript code to the latest version of jQuery?  The first task was pretty much the show stopper:  if I could not migrate over 50,000 user accounts, and over 150,000 guitar tabs, with all of the custom paths and linked taxonomy terms over, there was no point in learning custom module development in Drupal 8 or refactoring the javascript code.  The second task and third task sounded like fun to me, I was excited to get back into modern PHP development, and I was excited to take advantage of a newer version of jQuery.

When I started on the migration, in my head I was expecting that I would have to create a custom script that would perform the migration, and that there'd be no help within Drupal.  To my shock and delight, in the core of Drupal 8 was a set of migration modules (Migrate, Migrate Drupal, and Migrate Drupal UI), which allowed for such a task!  In addition to a UI that allowed me to configure the old database to grab content and perform the initial migration, I was able to use a few other slick modules, such as Migrate Plus and Migrate Tools that allowed me to run commands using Drush, and limit those commands to updates and changes.  So, I was able to get a production copy of all the content and users into my development environment, as well as have a way to incrementally update content without having to perform the migration in it's entirety. With this hurdle out of the way, it was time to start learning about Drupal 8.

Some of my major goals when moving to Drupal 8 were to create a custom module that contained all the functionality I needed, without having to write a custom theme or blocks. I wanted the site to be more efficient and capable of using more cloud features that would lower my costs, but provide a faster and more reliable experience. I wanted to be able to have more options with themes, and be able to use tools to help me create custom pages so that I could offer a better user experience.  Luckily, Drupal has come a long way from when I started to use it, with several modules merged into it's core (like views), a new way of configuring it with composer, and an entirely new way of building modules.  I was under the impression that many of the custom modules I used would not exist any more, and was equally excited to be able to use the latest versions of certain modules, like recaptcha, so that I could reduce the likelihood of spambots that were ever present in the older version.  

All of the goals I had set out to learn and accomplish were met in the rewrite.  The guitar tab creator module takes advantage of custom blocks plugins, hook_theme, and twig templates to give me total control of the content.  Additionally, using the libraries yaml in conjunction with my block plugins allowed me to break apart my javascript and css into logical components that would be easier to maintain, and aggregate together with the advanced aggregate module.  I also took advantage of event subscriptions to handle some logic for authenticated users, and move the circle of fifths backend service as a Rest Resource.  I used the Page Manager to allow me to easily create page overrides that used my modules, advanced aggregator and CDN to compress and minify the CSS that now gets served by  amazon's cloudfront service, and contexts in views to make some awesome blocks that show relevant content.

My last major challenge was rewriting the javascript that performs all of the tablature writing and editing.  There were three parts to this, the first was to get my code to work in the new drupal behaviors style, and secondly remove a bunch of legacy jQuery code that had been depreciated, and finally, organize the javascript into files that could work with my module's libraries.yml file.  The changes to drupal behaviors was quite simple.  The major difference for guitar tab creator was to extract the single behavior I previously used into separate behaviors for each component.  Other than some scoping issues, there were a few depreciated functions (namely .live function), that I needed to replace.  I was able to take advantage of some new jQuery functions that made positioning easier, as well as reduced some lines of code.

In terms of hosting the site, I am continuing to host the site using the AWS cloud platform.  Some great enhancements for the site's ability to scale were to upgrade the EC2 instances to the new T3 platform, continue to use the Memcached servers, use the Elastic File system to store shared files such as the compressed outputs of the advanced aggregator module, and Cloudfront to store images, JS and CSS files.   All of these changes have increased the performance, scale better,  while slightly reducing my costs.

Ultimately, I spent about 8 weekends working on this upgrade, with nothing to do but shelter in place, I was able to spend almost all of my weekend days focusing on the upgrade, which was nice to keep my mind busy and off of the pandemic.  In addition to the personal growth, I am happy to provide the people using the site a better experience.  One thing that motivated me was the amount of growth the site experienced as the pandemic began to take shape and lockdowns began.  People from around the world found the site, and, while being locked down took time to write down their musical thoughts.  I saw a huge increase in usage from Italy, France, Spain, Germany and the United States.  I was happy that people found value in my site, and that it helped them deal with the pandemic.