Not Everything Appears as It Seems – Lessons on Computing from an ex-Strategy Consultant

How to confuse a spouse new to programming!  A two-step guide!

My wife looks over my shoulder a bit confused.  I’m working on a final project for my Node.js class (7th iteration) and she’s been watching since the first iteration.  This is what she sees:

She asks me calmly!

“Why does it seem like every time I look at your Taskitty application [Task tracking App] it seems to look the same or occasionally looks worse?  I feel like you are procrastinating.  Maybe stop playing video games or watching TV.”

I’m a bit stunned.  I’ve been putting a ton of work in the class.  Easily a dozen or so hours per week on top of my typical work schedule.  Then I realize something spectacular.  1. The entire class is iterative and 2. the professor doesn’t care how it looks in the browser (front-end web development).  He wants us to focus on learning different frameworks and is fine with us replicating the same overall and feel.

The best analogy.  Imagine talking to a neighbor and finding out he’s put a ton of work into his house recently.  You look at the exterior and think “It looks like it’s actually deteriorating a bit.  A little bit of the siding is coming off and some of the wood seems a bit rotten”.  He than mentions that all his time has been focused on interior design and a kitchen remodel.  It’s that aha moment.

My wife was watching the exterior of the website, but was clueless that the kitchen and bathroom had been remodeled.  In fact, in my case the entire internals had been replaced without her even noticing.

The house before remodeling!

In the above cases, both version 4 and the final version of Taskitty are quiet large.  The first version uses a framework called Express that uses routers and templates to create the presentation.  The best way to describe it is the diagram below:

Your browser requests a web page from my server.  The server uses a router to find a template for the web page.  It fills in the blank parts of the template using information from a database and also cookies/session information.

Two important things to note:

  1. Everything happens on  my server, each web page has it’s own template with it’s own fill in the blank variables.
  2. When my server is done it sends the entire newly formed html document to your browser via the internet.
  3. Every web page requires you to contact my server first and all the processing happens on my server.

What changed inside the house!

The final version looks similar on the surface, but how it arrives to the same conclusion is completely different.  Here is the diagram of how it works:

In the above case, the browser requests a page from my server.  My server sends a single web page bundled with a ton of components and JavaScriptThe single page application (SPA) sets up a router on your browser using JavaScript, which than selectively picks and chooses components to create a web page.  It can also independently call the database for more information.  Once the router has finished picking the components and getting data from the database it modifies the single HTML web page that was sent and renders it for you in your web browser.  You can than use the router to reconfigure the web page as many times as you desire.

There are some huge implications here:

  1. When you first contact my server, you have to download not just a web page, but all the components and logic of the website.  That can be a very large initial download.  So the first connection is a bit slow.
  2. Once the web page and website logic exists on your browser, the only time you have to reach out to my server is to contact the database.  You can almost run the application without an internet connection.  That can really speed up the experience since internet connections are slow compared to your computers resources (usually).
  3. By shipping components, I can re-use them across web pages.  This safes a lot of time.

The house walls are still an ugly Green!

My wife of course doesn’t have access to the code or knows how the internals work by looking at what the website generated.  She just sees the same old web page unchanged iteration after iteration.  The only thing she might notice is that the later web page feels faster and seems to function smoothly.  She can easily take this for granted, because both sites are relatively fast.

I think this is one way a developer’s experience can be divorced from an end user.  Sometimes we make huge changes, but things that are visible don’t change drastically.  So it appears no work has happened.

The “SQL” strikes back!

About 3 months after the class, my wife decides to be ambitious and start a class on Excel, SQL and Tableau.  One day, I watch her getting frustrated.  She tells me:

“I keep trying out these SQL commands in this database.  Every single time it tells me the function doesn’t exist.  I’ve tried different things and googled the message for the last 4 hours.  Nothing seems to solve it.”

Trying to be a helping hand and having done SQL for almost a decade.  I decide to look into the issue for her.  The first thing I ask is what SQL database she is running.  She tells me the class is in PostgreSQL.

She types SQL into a web page.  Runs it.  It works.  She opens up a SQL client on her computer.  Types the same thing in.  It tells her the function doesn’t exist.

My first gut reaction is she’s running an older version of the database.  So I tell her to type: select version().  That should tell me what version of postgreSQL she is running.

Version() doesn’t exist!

Yes, the database tells me even the Version() function doesn’t exist.  Now, I’m on high alert.  It’s either a very old database from several decades back, which is nonsensical.  The firm she’s taking the course from is less than a decade old.  Alternatively, she’s using another database.

I google the error message by itself.  The first thing that pops up on Google.  SQLite.  So I ask my wife to try:

select sqlite_version();

She tells me it works!  What does it mean?

My wife’s website was in PostgreSQL and the one on her laptop was SQLite.  Postgres and SQLite have different functions for the same tasks.  So the SQL from postgres will often error out in SQLite.  The same is true in reverse.

Mystery solved!

Except, my wife is now more confused than ever.

  1.  She now realizes there are different SQL databases.
  2. She doesn’t understand why they would teach Postgres and give a SQLite test database for practice.

I don’t blame her.  It’s very confusing.

Possible reasoning?

Having spent a lot of time in Postgres and having taken a few dozen courses/tutorials in Python.  I realized I might know the answer.  SQLite is a database with a small footprint often used in IOT devices.  You can easily download it as a single file.  Postgres on the other hand requires an installer, setting up a database/users and creating tables.  You can definitely bundle it up and ship it as a single file if you are clever about it (docker etc), but it’s much more complicated.

The problem in this courses case is communication.  They should have made it clear that the databases weren’t the same.  That the reason they use SQLite for practice is it’s much easier to set up.  The only thing the students would have to do is google SQLite functions when using it.

Two things, both different, both look similar!

Here ends the tale of two confusingly superficially similar things, which are actually completely different.  Lesson things that look the same might be completely different.  Communicating those differences can have a huge impact on user experience and prevent you from looking like a couch potato.

Leave a Reply

Your email address will not be published. Required fields are marked *