July 8, 2021

Building my new blog using Webflow


As an engineer, I get joy from building projects from scratch, whether it's bootstrapping my startup with React, Redux, Express, GraphQL, MongoDB or building a static site with Gatsby and Netlify. I stayed away from "website builder" tools that help you build a site using drag-n-drop just because:

  1. The quality and user experience for those builders are substantially low and bad
  2. The stigma attached with using a "website builder" as an engineer

But recently, I joined Webflow as a full-time Technical Product Manager and my role here is maintaining infrastructure technology so Webflow can scale and provide more value to its users. When I first explored the tool, I was compelled, but not compelled enough to use it (after all, I am an engineer that can just build things, right?). But as onboard exercise, I had to build a clone of Dribbble using Webflow.

Building Dribble in Webflow

Dribbble is an online community where some of the best brand, visual, and product designers post their work. Essentially, I would have to build a site where you can see top posts by users, click one of the post, show related post by the author, likes, re-bounds, etc. using dynamic content and responsiveness.

Here's how it all turned out:

Home page

Post Page

I didn't spend the time to add the last finishing touches to make it look pretty, but I was able to complete the first version of this within the span of 4 hours. Creating a CMS, creating dynamic data, populating dynamic data on dynamic pages in about 4 hours!!!

That was the first time I truly understood and saw the value that Webflow brought to its users. It's not just about creating a website; it's about democratizing building for the web to anyone.

Using Webflow for my blog

So last week, I wanted to redo my entire blog. Why? Because I hate my blog looks every 1-2 months (I have OCD where I have get tired of how things looks so I re-style things too often).

Previously it was a portfolio using Gatsby for building it and Netlify for continuous deployment. Initially, it took me about 2 to 2.5 hours to get everything up and running, from installing Gatsby as a global dependency to setting up all the `gatsby-node.js` config logic to adding dependencies like styled-components, flow (I like my JavaScript typed) to pushing it to GitHub repo, to connecting it to Netlify, etc. The dev-to-prod time of 2-2.5 hours doesn't seem too bad right? I mean I gotta add these things to make it look pretty, and don't forget responsiveness 🙈

Then, I became a bit curious and tried to build my blog in Webflow. My dev-to-prod time decreased from 2 hours to literally less than 10 minutes, excluding writing this initial blog post. I created a simple Blog Post CMS, added the necessary fields (title, body, thumbnail), styled the homepage, and the blog template, and I was LIVE!

This meant I could focus less on trying to fix a hacky CSS property and focus on writing more and I truly couldn't have been happier with the choice. Now, I can write a blog post using Webflow Editor and click "Publish" to make my changes LIVE.

Me writing this blog with Webflow

Final Thoughts

As an engineer, I have always taken pride in building things all by myself, using all the bleeding edge JavaScript tooling, but this mindset was and has been holding me back from posting more things I write, simply because I am too busy writing busy code that is unnecessary. My blog doesn't have to be built with Webpack 4, Babel 7, React Hooks, Redux, GraphQL, and pass through CI builds — my blog is (and will be) a way for me to express my thoughts and Webflow is the perfect tool to help me achieve that with speed.

But the true true true reason why I chose Webflow is because it's the agile way of doing things.

As the owner of this blog, I want to post more so that I can provide more value and share my thoughts with people who read my blog.

I'm a PM — just let me be 🙃

With Webflow, I can rapidly release incremental value to my end users, and at the end of the day, that's why I have a blog. Using Webflow for my blog seems like an obvious option, but sometimes it's hard to see things when they're right in front of you...that's why you ask your mom.

Thanks for reading! For any questions or corrections, please send me an email.
Made with ❤️ in NYC