bronan.dev
Published on June 26, 2024
Confession
If you knew me before this year, you'd probably find it quite strange that I made a website using technologies like React. A younger version of myself considered these technologies to be bloated and not worth using.
However, over the course of this summer, I've had the time to really dip my toes into it and I've found it to be surprisingly enjoyable. React introduces a completely novel and unique way of approaching UI, one that I hadn't considered before.
Humble Beginnings
Some of you may know this site when it was located at https://www.ronanm.me. Thanks for helping me test my email server, by the way. At that time, it was written in pure HTML and CSS. Then, it didn't have much content on it. Some blogs on my projects and that's about it. The coolest thing was the email server.
Perhaps I was correct about the weight of these applications. There's nothing more minimal than pure HTML. That thinking was a little ignorant, considering I never explored Javsascript.
React?
React is honestly kinda epic. The idea that you simply describe the UI and let React handle optimizations was quite foreign to me.
The idea of a frontend framework seemed unnecessary and quite slow. However, coupled with Next.js, I think I've found a great balance. With Next's ability to perform most of the rendering at compile time and server side.
Enough Reminicsing!
Describing Me
As a programmer, I despise repeating myself. The fact that I have to build my resume, put the same information on my personal website, then fill back in that information in forms is quite cumbersome.
So, my first course of action was to write a file that contained everything needed to know about me. It's simply a json file, which has schema sort of like so:
{
"name": "Ronan Maharaj",
"domain": "bronan.dev",
...
"projects": [
{
"name": "bronan.dev",
"favorite": true,
"public": false,
"source": null,
"tags": ["React", "Typescript", "Bun"],
"accomplishments": [
"Developed a responsive personal website using React, Next.js, and Tailwind CSS, showcasing my portfolio, blog, and contact information with a focus on performance and user experience.",
"Implemented server-side rendering and static site generation with Next.js, enhancing SEO and load times for an improved user experience.",
"Customized and optimized UI components with Tailwind CSS, ensuring a clean, modern, and consistent design across all pages and devices."
]
},
],
}
I would use this information to both create a Resume in LaTeX, then put that information in my website! Now, this didn't seem like a lot of work but it was agonizing.
Resume Compiler
I had previously written my resume in LaTeX
. To be honest, I found it quite enjoyable if the code was extremely verbose. Unfortunately, LaTeX doesn't really offer any templating features.
I resorted to converting my existing resume into parts, having Python read the json file, add the appropriate data.
Perhaps, I'll open source this someday. Seeing as the code is so specific to my use case, I doubt many would find it useful though.
Tailwind???
Seemingly completely antithetical to common programming principles like DRY
, Tailwind encourages repeating yourself.
The docs even recommend using editor-specific features. This sounded completely outlandish to me at first. However, over the course of the project, I started to really appreciate the developer's sentiment that the disconnect to HTML and CSS caused by having them in separate files causes confusion.
Tailwind might be a bit overkill but I appreciate that they maintain some sort of semblance with @apply
even though it is a costly feature for them to maintain.
MarkdownX
MarkdownX was the final piece of the puzzle. This page that you're reading was written using MarkdownX! MarkdownX and Next.js seem to have an interesting relationship, from what I understand by reading documentation.
MDX docs seem to suggest that the best way to use it is with Next.js. On the other hand, Next.js mdx clients suggest MarkdownX is overkill. Regardless, it seemed perfect for my usecase.
Other Goodies
Well, there was quite a lot more planned for this website. However, I think I feature creeped myself at the beginning.
Right now, I think I would rather have the chance to explore developing other applications a bit further before continuing work on this project but feel free to check in at a later date!
Reflecting
After finishing the intial deployment of this project, I have quite a lot to say about Next.js which I would have never expected. I honestly really love it. I think I'm going to try using it for my personal projects in the future.
If I had to suggest a moral to this story, perhaps "Don't knock it 'til you've tried it" is appropriate? The contrasting ideas between my initial implementation of my resume, then the complete opposite with Tailwind.
Software developers seem to parade around a couple core values they have. For example, I used to believe "all variables should be one word" and "if your code isn't self documenting, it's not good". While there is some value to those claims, I now understand that they're a bit unrealistic. Of course, those beliefs may be extreme but you should reflect on this yourself.
There's always exceptions to these "tried and true" beliefs. Though, perhaps in software, this is more common.
Regardless, thank you for reading this far and send me an email if you'd like to hear me talk more!