taylor.gl v1

Elixir
Phoenix
TailwindCSS
taylor.gl v1 screenshot

Originally, I created taylor.gl using the Hugo static site generator, but I quickly outgrew that and wanted my own dynamic website, so I created what I consider to be v1 of my website. I was learning Elixir/Phoenix at the time (which I later ended up using for work), so I created my website in Phoenix. It hosted my blog, creative writing, and resume, much like my new site.

Technical Implementation

The website was written in Elixir/Phoenix. A bit overkill for a blog, which I could have statically generated, but it was a learning project.

The project was technically simple, designed using Phoenix's HTML templates and TailwindCSS for styling. I was really happy with the design of the live resume page, which served as my actual resume and got me my first tech job.

My live resume, which also had a PDF version that looked the same, but static.

The blog pages were simple enough, but there was one addition worth mentioning. The blog posts were all in markdown, which would be processed in the backend into HTML. But I wanted to do some things that markdown doesn't normally support, like footnotes or captioned figures.

To accomplish this, I added support for including Phoenix EEx, the Phoenix template engine/syntax, so I could evaluate arbitrary Elixir code and inject the results into the rendered HTML. Then I added Elixir code for creating footnotes etc. This worked pretty well and the experience was similar to using template expressions in EEx.

For v2 of my website, I'm just using the marked-footnote plugin for footnotes. No need to reinvent the wheel again! Figures are a bit trickier — I create a figure with a caption if the image's alt-text starts with Figure:. For example:

![Figure: My live resume, which also had a PDF version that looked the same, but static.](/images/Project_2_2.webm)

Works fine. Is the old approach or the new one better? They both work, so in that sense, neither. But the old approach was overengineered. I probably didn't need to figure out how to get arbitrary EEx working in my markdown if all I was ever going to use it for was footnotes and figures.

Reflection and Version 2

The biggest annoyance for me was honestly the way the site was deployed. I tried to improve it over time, but it was never as simple as commit → push → it works. The deployment was also heavier than I needed. I had to have a Postgres database running on the server. As such, there was always friction whenever I wanted to do anything with the site. Mostly, it didn't change much for a few years.

I also didn't really like that it was implemented as a Phoenix/Elixir site with the front-end handled by Phoenix templates. Phoenix templates are fine. They can even be pretty powerful, especially if you use Phoenix LiveView. But I'd rather be writing my front-end in a JavaScript framework like everyone else (and Typescript, at that). It's just easier to do complicated things that way. My original website was JavaScript Free, which was cool, but it held me back from adding cool things that use JavaScript.

I also just wanted to give my website a fresh coat of paint. I'm not the same developer I was 4 years ago, and I'm not the same person. My personal website should reflect that.

Best Feature

To quote the project Github, "as a convenience feature, images are displayed upside-down for users in Australia".