Rebooting the Give!Guide website
One of the projects that came along with Grady Britton’s acquisition of OakTree last year was Willamette Week’s Give!Guide. After reviewing the site it was decided it was due for a rebuild. The old site was scrapped and we started fresh - new platform, new design… new everything. The idea was to make things as simple as possible, mobile friendly, attract a younger audience and ultimately meet our goal of getting $2.1MM in donations (spoiler alert: we got $2.4MM!). I wanted to shed a little light on what went into it development-wise. By no means is this an extensive overview, but should provide some insight into what goes into a website (re)build.
Paradoxically, making things simple is hard. The new site made use of modified install of WordPress as a backend. Seven plugins and 42 templates files were created. All-in-all, 348,543 lines of code were written with 393 commits to version control (GIT) and 201 deployments. It took 232 hours to develop the site then there was 73 hours of post-launch maintenance & support. Most of the plugins revolved around the need to insert data that would be difficult to format for the not-so-html-savvy user in the WordPress editor. The bigger ones were were for reporting on donations (both At A Glance and backend) and building out the donation/payment processor. The front-end of the site used Bootstrap for its gridsystem, normalization and various other little ‘enhancements.’ Ultimately any solid css framework would have done the job - Bootstrap was chosen sort of arbitrarily. LESS was used for the CSS and CodeKit was used to reduce image sizes; and compile, concatenate and minimize scripts and stylesheets. Development was done from a local machine and kept in version control. When it was ready for review or testing on a production-like server, it was deployed to the staging server. After successful testing on staging it's then deployed to production. Beanstalk made this easy.
There were two servers running the site. One of them also ran the MariaDB database. 43,928 donation-related records were created - averaging about 780 new records per day. There was about 1,440 database queries per day.
Nothing too fancy here. As mentioned previously, there were two Production Servers - VPS’s from Linode in the Fremont, CA datacenter running Ubuntu 13.10 w/ 8 cores and 4 GB of RAM each. We used 51 GB of bandwidth and only 356 MB of storage. I don’t remember the last time I didn’t recommend CloudFlare, and Give!Guide was no exception. Among many things it reduced server load by about 70%.
Traffic from November 5 to December 31, 2013
- 16,537 unique visitors (27,439 total visitors)
- Max concurrent users on the site: 63
- Visits from 54 countries (!)
- 7,241 Mobile users
- 3,229 Tablet users
- 16,996 Desktop users
- Most popular browser: Google Chrome
- Least popular Browser: Blackberry
Overall, the site was well-received. Willamette Week covered the outcome of the program and had great things to say about it. This coming year's Give!Guide will be an evolution of what was built last year with several small adjustments to improve the overall experience. It was great being able to be a part of such an incredible program and we can't wait to do it again this year.