Why I chose Nuxt as my Web development framework
Don't make web dev any more painful than it already is!
Learning To Fly
When embracing this new choice in programming, I took some time to evaluate different tools I was going to use to create not only my products, but also my necessary presence on the web. While I had played with HTML and Microsoft's FrontPage when the world was going crazy about the Internet (and: it's no different from the AI craze we are in today), I needed to catch up on what tools I would like to use for my website. You read it here first: Welcome to #YetAnotherRabbitHole, or #YARH. You are welcome to use it as an expletive, or to scare off random people you encounter. Use responsibly!
WTF Is The Web, Anyway...?
We have all used the Web, some of us even consume it, but how does it actually work? What goes on behind that "https://..." sorcery that you are so used to typing, but have never cared learning about? I do have some relevant background here, as I worked for one of the companies on which the Internet was built on, and which is still relevant today: VeriSign, Inc. VeriSign is one of the entities running and managing what is called a "root server", i.e. that pool of "big computers" that translate your typing of funbear.dev in your browser into a website you can see and use.
When I was myself still a new user of the Internet in the '90s, websites were rarely pleasant, some were just tolerable, and the rest were plain dreadful. If anyone remembers what we were being subjected to, beyond the screeching sounds of 19.2K, 33K and 56K modems, I feel you.
Getting back on topic, the World Wide Web was a project started by Sir Tim Berners-Lee at CERN in Geneva, Switzerland in 1990. He devised a "markup" language that would facilitate scientists' communication through electronic means. What was later standardized as HTML, or HyperText Markup Language, became the basis on which websites still operate today.
Side Note
I had the luck of being able to visit that very office at CERN in 2015 (though the NeXT computer was gone!), and it was a moment I, as a profound computer geek, will never forget.
But where were we...? Oh yes, modern tools!
A Plethora Of Choices
When you want to build a website today, be it for your personal blog, or your newly-founded mega-corporation 😄, there are many paths you can choose. For one, you could rely on the very traditional tools of HTML, which would technically still work, but would also just look "off" without any CSS, or Cascading Style Sheets. CSS is often regarded as any web developer's worst nightmare, and I am going to go on record here and state that CSS is NOT a language (and neither is HTML...)! But wait, there's more pain! Since we all like things that are reactive and snappy, because why not...? you must add JavaScript to perform some logic on the content of your website.
While there are a handful of web devs out there that actually do this, "The Market™" has come up with alternative tools that will make your web dev life waaaay more pleasant. Welcome to the modern web development experience! These are services like WordPress or SquareSpace, which provide a simple platform where it's easy to enable non-technical people to create and update the content, while the basic site management is done by a guru webmaster. While WordPress was never an option for me, one other such tool I had a good look at was TYPO3. This tool was created in 1995, and has seen a constant stream of evolution until today, as a Free and Open Source Software (FOSS) platform, and it is currently being maintained by a company in Germany. Yes, there are other options like Drupal and Joomla, and probably most of my points could be transferred, but please understand that I am looking at this from my personal perspective here.
The Woes Of TYPO3
While TYPO3 does have a number of pros, like its focus on security and that it can scale to enterprise level easily, it does come with a (very) steep learning curve. For one, implementing a website requires a functioning HTML/CSS/JS template that ignores the past 20 years, with all the basic functionality already set up and working. Then, it requires the editing of that template, to place all the necessary content markers in your website. For this, think of a page's main content "block", and the sidebar that helps you navigate the content. To make this just a bit more complicated, TYPO3 has its own scripting language, called TypoScript. This is not to be confused with TypeScript, which is a superset of JavaScript that I myself have been learning and using on this same website, but another requirement to connect the static elements of your website (think of a page's title or main content block, for example) with a dynamic element that can also be internationalized, if so required.
As mentioned, TYPO3 is being maintained by a company in Germany, and I have wondered why and how this has somewhat restricted its adoption to the German-speaking part of the world. While some international companies do use it for their web presence, its outreach is very limited, compared to other tools. But I am a native German speaker after all, so what's the problem here? Well, it turns out that there are hardly any tutorials about TYPO3 on YouTube and Udemy. This means I had to turn to the "real guys", i.e. professional instructors selling courses on their own platform, and at a steep premium! After much pondering, I did sign up to a paid course on TYPO3, made by a professional coach in Germany, and who is one of the leading resources about this platform, anywhere. But I had to give up after realizing how much I would have needed to do to make this work for me. While this is definitely not a hard goodbye, I simply need more time to get a grip on actually how this platform works.
I don't mind the requirement of the scripting language to tune things to one's liking, but I do have a problem with the basic HTML, CSS and JavaScript template requirement, that then has to be adjusted to the needs of the specific website, though I am most likely still missing the full picture. As stated above, I will eventually get back into exploring TYPO3, because I understand its features and strengths, but I do not have the time currently to fully understand how all the underpinnings work.
To Be Clear
TYPO3 has some very strong features built in, and I strongly believe this is a CMS that deserves more attention and use. But I also see that there are many other platforms available, and I had to choose one. While React has certainly managed to "win" the market, I wanted to use an independent framework, i.e. not backed by a huge corporation, and my searches led me to Nuxt. Perhaps sometime, when I will employ an army of content creators of my own, I will go back to TYPO3. For now, however, my needs are (fairly) satisfied.
Enter Nuxt
After having spent about two months wrapping my head around TYPO3, I did some further exploring, and also a reassessment of my needs. After all, while I plan on running the Next Big Corporation™, the current requirements for my website are not too complicated, and it just needs to provide a series of pages centered around my business and the projects I am working on. This would indeed all be possible as a very basic HTML, CSS and JavaScript setup, so why am I making this unnecessarily hard on myself? "Have you never heard of WordPress...?!?" (I have, but I don't want to use it.)
During the searches that landed me on TYPO3, I had come across a few videos about Nuxt, and was genuinely curious about it. After I decided to pull the plug on working with TYPO3 for now, I spent more time to understand what it's good for, and saw that it is perfectly capable of doing what I need it to do, at my current requirement level. First, it is based on the Vue.js framework, which is one of the many ways HTML and CSS were "reinvented" to provide a modern take on designing websites, and overcome some of the limitations. Also, Vue is based on a concept of "components", which are exactly what they mean: building-blocks that can be placed and re-used where and whenever needed. Components can be self-contained, meaning they host all the necessary HTML, CSS and JavaScript code in one single file. This makes building a project quite easy, in comparison to the long files I created when learning basic web development, "The Old Way™".
But wait, there's more! 😁 Nuxt also implements TailwindCSS as a first-class citizen in its framework, which makes it unbelievably easy to structure web elements on a page. I will write another post on Tailwind specifically, but for now I will only say that discovering this framework has definitely changed my life for the better. The syntax is fairly easy to remember, and is grouped in a meaningful way, so that mnemonics will usually work. If not, have a look at the docs on their website, which I recommend reading for fellow devs.
That's all I have for now, but I am certain that my web development path will provide much more content to post here. Thanks for getting this far, and I hope to see you again!