What I Learned About ESM vs CommonJS - And Built a Real-Time Task Board

Yesterday I was talking with Claude about the Google CLI tools and wanted to unify it with other Google CLIs I built.

It noticed that one of them was built with ESM and the others with CommonJS. I asked what’s the difference?

The Difference

CommonJS is the old way that only works in Node.js.

ESM (ECMAScript Modules) is the official JavaScript standard that works both in browser and Node.js.

Why ESM is the New Standard

The advantages:

• Many new libraries are only available in ESM
• Shared code between frontend and backend must be ESM

I kept asking until I understood why it’s the new standard and when it matters. I was curious when you must use ESM - what could I build that demonstrates this?

The Project

Meanwhile we converted the CLI to ESM (it’s simple) and unified it with Google Sheets + Docs.

Then we built an example that uses the CLI with a UI that requires ESM: a shared task board that updates in real-time between the UI and CLI.

Including tasks that both of us can add, notes and activity tracking.

What I Learned

I wanted to check something small - I came out with new knowledge and interesting ideas for other projects.

This is what I love about working with AI - not just “do it”, but a conversation that leads to learning, understanding and new ideas.