Why I built this site in Webflow

Welcome to the new and improved OmarAbed.com!

It might look the same, but under the hood, there's a whole world of changes.

I'm a writer in more ways than one. When I'm not writing books, I'm writing code for my day job as a web developer and software engineer. So, I figured it was only fair to dedicate some space to talking about my choice for building my website in Webflow.

If you're just looking for the "Why Webflow" section of this post, jump near the end.

The History of this Site

I first started OmarAbed.com in college, to practice building websites with pure HTML and CSS. There were no interactive components. It was really just a way to showcase my resume and get a portfolio of live web projects started.

When I kicked off my writing career, I wanted to revamp the site. For new writer's, a common question is: "Help! I'm not good with computers. I need a website! How do I build one?" I've heard this question asked plenty in writing communities when discussing marketing channels. A website is a huge help for driving online sales, engaging with readers, and keeping devoted fans updated.

And although I was getting started learning Drupal web development, I was just starting to get comfortable with Drupal and wanted to spin something up quick, so I opted for Wix.

I chose Wix because it seemed intuitive, and (mostly) because I had a coupon code. #CheapLife

I figured, I could ride the 2-year discounted price for 2 years, and then reevaluate. Well, it's now two years later.

And sure, I could've just continued using Wix. So, why didn't I?

Why rebuild a working site?

There were a few things I didn't love about Wix. For one, I thought the price was higher than most sites. (That turned out not to be true. Their prices are comparable.) In fact, when I went to cancel my Wix premium membership a few months ago, one of the last pages before the cancellation gave me a 50% coupon. So, note to all: Don't pay full price. Pretend to cancel first, and see if they'll cough up the discount to keep you.

But aside from price, there were a few reasons I wanted to rebuild my site.

Proving my web dev skills

I'm a web developer. Surely I wanted to prove my skills as such. I usually work on small, isolated parts of various government and non-profit sites, so I was intrigued by a low-stakes project where the timeline was up to me. I could branch out, make mistakes, and learn new concepts. Also, I had never personally launched a Drupal site, despite coding on many public client sites.

Not loving the Wix experience

I faced some issues when editing pages in Wix. For the most part, things went smoothly. But sometimes, I would make a change that wouldn't propagate well to both mobile and desktop. A change on one might affect the display on the other unexpectedly. This wasn't common, but I just never got a strong grasp of the Wix designer interface.

Saving on recurring costs

I try to limit my recurring service expenses. There's already too many recurring bills between utilities, rent, streaming services, phone bills, etc... I wanted to reduce my reliance on yet another third-party service.

Developing in Drupal

So I started building my site on my local computer in Drupal. I had all the technical skills, and the site came along rather nicely. I created a robust system for tracking my books and blog posts. I created a commenting system to engage with readers, and a subscription service. I didn't quite define my design or features up front, so I spent a lot of time iterating on the same features and changing my mind back and forth. When I wanted to make changes to a hero (intro) block on the homepage, I often spent hours making minor CSS tweaks. (I get obsessive when it comes to perfecting CSS.)

Launching the Site

Finally, I was happy with my final product, and ready to launch. I decided to use AWS (Amazon Web Services) because it's an industry leader and I wanted to learn more about how to use their various features.

But there were a few hangups that made me consider changing directions.

Security Release

First, there was a major security patch for Drupal released on the day that I was ready to launch my site. It made me nervous, and made me realize that I'll have to be ready to do those on a moment's notice going forward.

AWS Tools: EC2, RDS, S3, Oh My!

Second, and most importantly, I had a ridiculously tough time with the AWS tools. I followed tutorials and quick start guides, like this one, for spinning up services like EC2, RDS, and S3 separately. I got pretty far with that, but ultimately had issues with setting up the VPC or with services either not starting up or having trouble communicating with each other. As popular as AWS is, their services can be confusing for basic users. I'm getting more familiar with these tools now, which reinforces that this was probably user error, not service errors.

Pricing Concerns

One of my major reasons for moving off of Wix was to lower costs. As I explored all the AWS services that I'd need to launch my Drupal site, I started to realize that costs could quickly get out of hand, especially if I'm able to eventually increase traffic to my site as I hope to do. Additionally, I hesitate to sign myself up for an undefined cost. At least with Wix, I knew my monthly cost. With AWS, I ran the risk of paying more than I expected in any given month as my usage scaled. I wasn't interested in trying to understand the different AWS pricing models for my small, personal site, and risk getting something wrong. I'd like to learn AWS, but I'm also very risk-averse to spending money for personal things.

AWS Lightsail

Eventually, I stumbled upon AWS Lightsail, and gave that a shot. With Lightsail, I was happy to have predefined costs and a one-stop shop for all the services I'd need. I was able to spin up an out-of-the-box Drupal site on Lightsail using the launch guide. But then I ran into other issues. I couldn't find clear guidance for deploying my local Drupal site onto the Lightsail instance. I tried adding my git repo to the Lightsail instance and pulling my repo down to that instance, but it always timed out (maybe because I was on a cheap, lower-end tier of Lightsail?). Also, the main tier of Lightsail didn't include file storage, which is needed for my Drupal site to store images and such. If I wanted to scale up to include file storage, the price exceeded the cost of other options. The cost of a predetermined-pricing solution was still not worth it.

Lightsail launched a basic Drupal instance for $3.50/month, but attaching a DB (a necessity for Drupal) was an extra $10/month, and that didn’t include the file storage system. Webflow would be $16/month.

Enter, Webflow

After a few days of giving AWS a shot, I learned a lot, but was still eager to deploy my site quickly. I decided that I should handle my author career like an author, and my developer career as a developer. If I started to convolute the two, I ran the risk of delaying my writing work because of shortcomings in my developer skills. And I truly want to succeed as a writer, so I made the hard decision to cut my losses and find an alternative solution.

After evaluating Squarespace, Webflow, Wix, Wordpress, and others, I settled on Webflow. To be honest, it wasn't really a fair comparison. I already knew that I was excited by Webflow as a developer from their commercials. I mean, this is spot on:

The ads for Webflow spoke to me. They showed how cumbersome web development can be. They're not an exaggeration.

And the price was comparable to Wix and other options, so hey, why not?

I rebuilt my site in Webflow in a matter of a couple weeks. I actually enjoyed the editing process. And the CMS (Content Management System) aspects around creating content were just what I needed for my simple use case.

What Drupal calls "Content Types", Webflow does with "Collections". They've got Drupal's "Views", but all managed through a UI. And I get to use my basic CSS skills to tweak any styles I want in easily modular ways. Webflow's UI is what I often wish for in Drupal, specifically with Drupal's Views.

Don't get me wrong: Webflow had its own learning curve. I accidentally undid some of my styles when I was using their class tagging system incorrectly. The text editor doesn't have as many options as CKEditor, and is super basic. (Though, it seems there's a way to add third-party libraries, which I may need to investigate.) And there's still a list of high-desired features to be developed (which is why I still have ugly CAPTCHA boxes on my forms). I also couldn't easily add comment sections on my blog posts, which was annoying. But it does sound like a lot of these concerns can be addressed with third-party tools, or are in the pipeline down the road. Overall, the help videos are not just informative, but concise, clear, and subtly funny. I actually enjoy watching them and enjoy tweaking my site in Webflow.

All that said, I feel good about the features that Webflow offers, and feel good about the direction that its moving in long-term.

So, there you have it - the new and improved OmarAbed.com! Questions? Thoughts? Let me hear them!