Intro
This is the website that really launched me into the world of Web Development. The Dulles Robotics Website was/is the primary website representing the Dulles High School Robotics Club & Teams, and has undergone numerous iterations over the years. I really learned alot about designing and building websites from scratch throughout the project, and also learned important lessons regarding dealing with stakeholders later on in the project.
The Background
The website initially started off as a rudimentary written in Coffeescript. Naturally this presented a few issues from the get go. Firstly, the site looked pretty bad haha. Secondly, and by far the biggest issue was nobody actually knew how to write in Coffeescript. We tried, and struggled, and the results pretty much flopped. Onboarding any other developers would've been impossible as CoffeeScript was already pretty niche at the time and most people already had a focus on other more common languages.
A screenshot of the old CoffeeScript based Website.
Modernisation
Modernisation may be a misnomer. Our focus on the website at that point was getting it as close to presentable, while also using something that is relatively easy to implement. We settled on converting the website to PHP. Through a collaboration with the Computer Science Club, we forked their pre-existing website, and adapted it to our needs. In the beginning, this was just simple text and image file changes, but as time went on, the website went to form a new character of its own.
Once we made the changes to the Computer Science Club, our work actually began. This site was already built using bootstrap, so making changes and adding or modifying components was relatively simple. First we modified the colour scheme. Originally we switched from the light grey scheme to dark grey, but then eventually settled on a deep blue.
Most of the work went into the actual homepage of the site. We converted it into something that looked elegant and unique.
New Homepage.
We went from a simple landing page, to having an information-rich homepage, featuring information about the Club and Teams targeting both students at the school, and potential sponsors. The goal was to make a single source of information, and this was achieved by adding more pages to the site, while having ways to access them directly from the homepage. For example we had information about the Club's history or our Alumni, and this was accessible from a section in the homepage titled About Us. We also had other important information such as links to paying membership dues, or upcoming competition information displayed on the homepage as well.
Lastly, we needed to make sure the design would be consistent across the website. This was simple, as using PHP we would put boilerplate code into other files and utilise templating by using include statements. We then styled the footer to ensure that our sponsors' logos would display across all other pages, alongside any critical pages. Finally we used javascript to highlight the proper navbar link, to ensure the user was aware of what page they are viewing.
Alot of the new site still had its own issues and flaws, and it was eventually superseded with the current Wordpress-based version, however this project gave me alot of the insights I needed in developing a website from scratch, from the styling and writing HTML, all the way to Serverside Rendering, Databases, and building a small CMS system.