Building the Perfect Website

Every perfection has room for improvement.

It has been many, many years since I've had a website of my own. I've been a victim of “the cobbler's children have no shoes” syndrome for quite a long time. I've always had time to build websites for other companies and never for myself. I started the process of building this website at the beginning of 2019, and I've finally reached a milestone that allows me to show my work. While the website is far from finished -- and will likely never be finished -- I think it's important to share my progress and process. I will continue to update this post as I hone the site, so for now I'm going to give you an idea of the working parts.

Hosting Environment

I've been using Digital Ocean as my host for quite awhile. It's affordable and well-built. I currently have two Droplets (servers) created -- one for production and one for development. My production environment is a 4GB/80GB configuration, while my development environment is a 2GB/50GB configuration. The two Droplets cost about $25/month, and with my current site traffic these servers fit the bill.

Repository

I recently switched from Bitbucket to Github. The reason for switching was originally because Bitbucket doesn't have the same analytics tools that Github has. I wanted to be able to see how many commits I've been making and when these commits were being made. In addition, I wanted everyone else to be able to see my stats. I was quite surprised to learn that Bitbucket does not have the same reporting stats as Github, and considering I made a bazillion commits over the past years this was an issue. I feel like Github is the social network for development geeks, and it's important to show that you're an active developer if you want to get more work. When I initially signed up for Github, you could not make private repositories for free. It was a disappointment because Bitbucket has had a free private repo plan forever. I sucked it up and paid the monthly fee to Github. But in my second month with Github, they changed the pricing plan and they now offer free private repos! I immediately switched the free plan, and now I'm paying $0 for source control.

Server & Code Deployment

I started out looking for an easier way to deploy (push and pull) my code from my Git repo. While I'm perfectly comfortable (but not in love with) with the command line, I prefer a visual tool. I discovered Laravel Forge. Laravel Forge is a tool for deploying and configuring unlimited PHP applications on DigitalOcean, Linode, AWS, and more. It was developed by the makers of the Laravel framework, but it can be used to automate the deployment of any web application that uses a PHP server. The features which really appeal to me are:

  • Creation and management of Digital Ocean servers directly from Laravel Forge. The servers are deployed with Ngnix web server.
  • Creation of databases and database users on my Digital Ocean server. You can choose your flavor, but I choose MariaDB.
  • Easy addition of new Sites on a server. No more mucking around with manually adding vhosts in Apache.
  • Easy addition of free LetsEncrypt certificates to your sites.
  • Editing of environment files (.env), Ngnix configuration files, PHP configuration files and more directly through the Forge control panel.
  • Auto-deployment of your Git master branch to your server. You can disable auto-deployment if you like, but I prefer to let Forge do the work.
  • Management of SSH public certificates. This is big because as you probably know, adding your SSH certificate to a server allows you to do away with constantly needing to enter your server credentials when you need to SSH. Finding the server location for these certificates is something I never commit to memory, so I appreciate no longer needing to remember.

I'm currently using Laravel Forge's "Growth" plan which costs $19/month or $199/year if you prefer to save a few bucks. I've opted for the monthly plan to keep my initial costs low.

Asset Management

I use Amazon Web Services to manage my assets. Things like images and videos require a fast delivery platform and AWS S3 buckets do the trick. As I'll talk about a little later, there's a first-party plugin for CraftCMS that allows you to easily tie in to your S3 buckets. There's also a Craft plugin for Digital Ocean, but by the time I discovered it I was already setup with Amazon. Anyway, my forecasted cost for Amazon is $.37 in March. This cost will increase as I continue to add assets, but the storage is affordable.

Content Management System

I've never been a fan of point-and-click solutions like Wordpress. Every site I've ever built has required a high level of customization and Wordpress seems to cater to website developers who want to create sites quickly with very little customization. I know that Wordpress can be configured, don't get me wrong, but I feel like the core is built with too many assumptions about what a website is. In the past I used ExpressionEngine (EE) because it was built with no assumptions -- a clean slate. There are no templates or code of any kind included with the installation. Unfortunately, it seems that ExpressionEngine has been in a slow car crash over the past years. I have more issues with EE than I care to discuss, but suffice to say that I needed to find a new CMS.

Enter CraftCMS! CraftCMS was built from ground up by one of EE's best third-party developers, Brandon Kelly. Craft is everything that EE (and a CMS) should be. It's fast, modern, well-maintained and more. I don't want to gush too much, but it will change the way you deal with content management. CraftCMS solo version is free, and it's what I used to build this site. If you need to build an environment with multiple users and groups (for a larger organization), you'll need the pro version which is $299.

Tools

This is a list of the tools I use for design, development, and photography:

  • iMac - Retina 5K, 27-inch, Late 2015, processor 3.2GHz Intel Core i5, 16GB DDR3 memory
  • Macbook Pro - 13-inch, 2017, four Thunderbolt ports, 3.1GHz Intel Core i5, 8GB LPDDR3 memory
  • iPad Pro - 12.9-inch
  • iPhone XR - 128GB in blue
  • VSCode - I've used SublimeText, TextWrangler, Atom and more. I prefer VSCode because it's no-nonsense and free! It's made for both Mac and PC and it's maintained by Microsoft.
  • Tower - Tower is a Git client with a GUI for the Mac.
  • Adobe Creative Cloud - Photoshop, Illustrator, XD, Premiere Pro and more. It's the full suite!
  • Nikon D850 - full frame, 45.7 megapixels

Professional Photography Services

I'm more than just a developer and a designer -- I'm also a photographer. Need a good head shot or product photo?

Contact Me

I will continue to update this post as I work through the website. The plan is to give more details on how I've built all of the components you see on this page.