About Me

A brief overview of my journey in dev, from my first website to my recent projects.

Hey there! I’m Eamon Gordon, an avid programmer, runner, (and sort of) an enthusiastic student.

My Dev Journey

I wasn’t always an avid programmer, as I mentioned earlier. But I certainly was an avid technologist, and Apple fanboy.

My first serious electronic device was an iPod touch that I received on my fourth birthday. Other than watching Mickey Mouse cartoons, I accidentally stumbled upon the Stocks app and discovered a love for finance too—a story that I can’t stop telling.

The First Website

But the first serious crack I had at programming was to make a website. Specifically one for minerals (not rocks!). Prospector Minerals has information on a number of minerals & mines coupled with a gallery of the photos I’ve taken of my collection.

The first Prospector Minerals The first iteration of Prospector Minerals was built using the Website.com editor, and looked a bit like it was put together by a sixth-grader. (Look at that Search icon!)

Nevertheless, it gave me the ability to do all the basic stuff—add images, text, buttons, and an offer to sign up for a mailing list.

To circumvent the limitations of the editor, I pulled a number of tricks, like using an FAQ element to store profiles of each photo I took, and an ecommerce product page for each mineral that I wrote about.

But, of course, it was a basic drag-and-drop editor, and no matter how you frame it, there is a hard ceiling on any custom functionality. I had to move on.

The New Prospector Minerals

I wasn’t ready to jump into making a website with pure HTML and CSS—where would I start? Programming seemed so overwhelming.

That’s where I found Wix. It was already a very popular platform, and I was constantly bombarded by their YouTube ads touting the benefits.

So I got started, rebuilding each page as it appeared on my old website.

One of the reasons I switched to Wix, however, was for a bit more custom functionality. I wanted to create a page for each mineral that I wrote about, and Wix’s Content Collections allowed me to do that. Still, this could be done without code.

The jump into JS came when I needed a search bar for all of my minerals and photos. I followed along a tutorial accomplishing this in Corvid (now known as Velo), the Wix’s “fullstack” product. With a few hours of copy-and-pasting, and tweaking random variables without any understanding of how the code worked, I had a (somewhat) functional search bar.

Favorites Page Though fairly basic, implementing search bar functionality inspired me to keep pushing on. Next, I wanted to add the ability of users to “Favorite” certain minerals, photos, and mines, and view them later. There wasn’t a tutorial for this; I was on my own.

Favorites Page By watching several more tutorials to achieve similar, but not identical, functionality, I began to grasp how a database works—the concept of querying and relations.

Over the next couple of years, I continued to upgrade the website, coding more and more features into the mix. Pretty soon after, users could cite an article I created, get an API key to query my databases, or set up two-factor auth for their account.

Programming

Although it provided an initially flawless solution, as Prospector Minerals continued to become more sophisticated, the limitations of Wix and Velo became increasingly apparent. I had to use a series of pre-made APIs to interact with elements, and had no control over the CSS of the website.

The real break happened when Wix announced new limits on their compute platform. All of a sudden, I faced strict quotas on reading and writing a database. Hosting was getting more expensive too—and my website was stuck on Wix’s platform. I was in a case of vendor-lock in, stuck at the mercy of Wix.

I knew I needed a change. I wanted my website to be portable. If I didn’t like the pricing or restrictions of a host, I wanted to move my website elsewhere.

It was time to actually code Prospector Minerals—all of it from the front-end to back. I couldn’t code it with HTML, CSS, and Vanilla JS. It wasn’t a static website—it was an app.

I began to look for a new framework for Prospector Minerals, keeping in mind a few constraints.

  • First, it needed to support the Node.js runtime. I had already worked with Node and npm packages through Velo, and wanted to keep the flow going.

  • Second, I also wanted it to use React. I had begun to gain experience with React through my work on Financedu, and it would make the switch much smoother.

What is the most popular fullstack framework that runs off React and Nodejs? Next. So that is what I decided on.

Building Prospector Minerals 3.0

Switching over to Next.js was quite the leap. I was in an uncommon predicament. Through my experience in Velo, I gained a lot of backend JS knowledge, but lacked much prowess in making a user interface with HTML.

Luckily, TailwindCSS saved the day. Using flexboxes and working with margin, padding, and other utility classes was quite intuitive. In a couple of months, I had a wireframe of what I wanted my website to look like.

Of course, I needed to add the backend functionality to make an app. I caught on to the querying schema of Prisma fairly easily, and imported all of my data from Wix—stored in a wrapper of MongoDB, to a couple of Postgres tables.

The New Mineral Database There were some challenges along the way—like implementing pagination and auth, but it was ultimately a successful endeavor. Prospector Minerals runs on an open-source framework, and I can customize almost any aspect that I want to.

Along the Way

Though my most longstanding, Prospector Minerals isn’t my only project.

I have a few more apps built in Next.js, like Codonvert, a simple tool for biology enthusiasts.

My biggest project is Financedu, a large app dedicated to financial education for students, parents, and teachers. It has a sizeable tech stack, coupled with a host of advanced features, but runs with a Node-based backend like Prospector Minerals.

I’ve been experimenting with Svelte and Sveltekit more recently. For those interested, BonesUI is a lean, headless, and accessible UI library for Svelte.

Oh, and by the way, this website is made with yet another framework—Astro. There aren’t too many bells and whistles, but I hope you’ll enjoy taking a peek at my projects & markdown blog.