I built this blog to showcase problems, solutions and thoughts about web development, web design and technology. That being said I did run into a number of problems and their solutions while actually building this site.
In my attempts to make this site as responsive as possible I ran into a few problems, such as the browser caching the webpage dependencies, the scroll effect for the blog posts not being responsive, and having a side navigation turn into a top navigation bar on smaller devices.
I also ran into some problems on the back end such as setting up my virtual private server for hosting, converting my SQLite database to a MySQL database for production, and finally running the website using Nginx.
When I originally designed the site I wanted a side navigation panel that spanned the length of the window, however I realized that this practice did not lend itself to responsive web design which is necessary in this day in age. I figured the easiest way to do this was to use Bootstrap, specifically a horizontal navigation. This didn’t work when I tried to make my own side navigation panel and then switch to the Bootstrap navigation bar for smaller screens. What I ended up doing was changing the Bootstrap navigation bar to the side navigation panel that I wanted, which worked except the links were still in the original top navigation bar position. This was fixed with a simple jQuery class change and some CSS modification.
Once I was done with these issues I then moved on to launching this website for production. This proved more difficult than I thought. I set up a virtual private server with Digital Ocean, and installed all the necessary dependencies until it came time to set up a proxy server and decided to go with Nginx with Passenger. My virtual private server wouldn’t let me set it up at first because there was not enough memory, and I needed to create a swapfile, which is to use hard drive space as RAM. This didn’t work as the commands I gave my swapfile to change the priority proved useless. I gave up for the day and checked back the next and it just worked without even a swapfile.
MySQL is a very powerful database system that I wanted to use for the database for this site. For Ruby on Rails, the gem is called mysql2, however the documentation is not ideal as it doesn’t say how to set up for production. The problem I had was within the database.yml file options. I looked around for the answer and couldn’t find one until I consulted the Agile Web Development with Rails 4, which gave very detailed information on how to setup MySQL for production while still using SQLite for developing and specifically how to edit the database.yml file.
My last issue was with Nginx and how to set up the domain name, specifically how to make it run on port 80 while the Nginx was running on port 80, with a cryptic warning that further configuration was required. Once I figured out what the issue was, it was simply a matter of closing Nginx and starting passenger on port 80 as Nginx was already configured.
In a future update I would like to rewrite the CSS in SASS as I haven’t discovered it until after this site was launched and so far, it looks very organized and intuitive. Stay tuned…