My favorite technologies for coding fast - Build in Public #2

By Hugo LassiègeMar 6, 20245 min read

I recently started Bloggr as a side project. It's a static site generator to easily start a personal or team blog using Markdown files.

In 2 weeks, I released :

Considering it's a side project, I think it's pretty good. And that's partly due to the choice of technology. Let's take a look at this stack, which I find super efficient.

A word of disclaimer: originally, I'm more of a backend developer than a frontend developer, with good experience of Java and its ecosystem in general. It's important to keep that in mind as you read on. But, over the last few years, with today's web frameworks, I've found it super simple to work on the front end. And that's what I'm going to talk about.

Nuxt

Nuxt has been part of my favorite stack since 2022. It's a framework that works with Vue.js and allows you to create CSR (client side rendering) and SSR (server side rendering) applications, as well as on edge.

Here, I've used Nuxt for CSR. Obviously, this simplifies things enormously, since there's 0 backend, no databases, authentication etc. It would have taken a lot longer to code. It would have taken a lot longer to code all that. But above all, for a blog engine, it would be pretty useless in my opinion.

I admit that when I see the complexity of a tool like Wordpress and its server consumption, when you're just using it for a blog, I don't understand why it's still the basic choice for most people.

And one of Nuxt's great strengths is its ecosystem.

Nuxt-content

Nuxt-content is one of the modules created by the Nuxt Core team. It's the very heart of Bloggr, since it's the engine that converts all markdown files into web pages. So it's 80/90% of Bloggr. Bloggr takes care of the time-consuming remaining 10/20%: sitemap management, robots.txt, theming, RSS feeds, commenting system, analytics, etc.

The vast majority of what I added came from my personal site: eventuallycoding.com which of course saved me a lot of time.

However, it's hard for me to keep nuxt-content in the front pocket of my everyday toolbox, as it's a tool that's taken out for a very specific use. But it's one of my favourite anyway.

Docus

This was the first time I'd used it, but it allowed me to create the Bloggr doc in 1 hour. Then, it took me 1h to figure out a silly build problem ^^ Docus is also based on nuxt-content, that shows that you can use this framework for another purpose, in this case, to make a pro doc in a very simple way.

Tailwind

Tailwind is a CSS utility framework. It's not a design system like bootstrap, material UI and so on. It's "just" a set of classes for building whatever you want. I know that tailwind isn't universally appreciated because it allows you to put a lot of CSS code in HTML code.

And yet, I love Tailwind.

It's well adopted, so there are loads of examples online to reproduce a huge number of components. I really like the dark: and hover: classes, which simplify the use of CSS pseudo classes.

I'm far from being a good front-end dev, and yet I was able to produce a nice responsive landing page, as well as two accessible, responsive themes in a very short time. And it's all thanks to tailwind.

Netlify

Netlify is the tool I use to deploy static sites. It's VERY easy to use. You give it the github repo, and off you go. Netlify does the build and deployment. I'll skip all the Netlify features, but that's it, and for 0 euros a month. That's 5 online, static sites for nothing at all.

Now I can't hide the fact that when I saw this tweet, I was a little freaked out:

It's about someone who saw an abnormal increase in traffic linked to bots. And it generated a bill of $104k. In this particular case, netlify canceled the bill because it made the buzz. But hey, even 500 bucks would make me sweat.

If you have any alternatives as simple as Netlify, I'd love to hear about them in the comments :)

Midjourney

I mention midjourney in this list, it's a bit surprising but, midjourney allowed me to create Bloggr's logo, the male and female avatar images used in both templates, my own blog's logo and banner.

So of course, it's not an everyday productivity tool, but it saved me a lot of time ^^.

Chatgpt and copilot

I don't think it's necessary to introduce them yet. I have lots of different use cases with these two tools. But to demonstrate one of them, I invite you to read this code. From line 14 onwards, everything was proposed at once by copilot. It's not a difficult code to make. But not writing it saved time. And since it's quite common, the amount of time saved every day is astronomical. For example, chatgpt and copilot are also very good at proposing and correcting CSS layouts with tailwind, even from a screenshot...

That's all there is to this stack. I don't think we always realize how much easier it is to write solo apps than it was several years ago. Frameworks are more powerful. AI makes up for the lack of expertise on the parts we don't master. I'm well aware that I haven't covered the backend here, since I didn't need to. I'll probably dig around later for another idea I have in mind.

a+


Share this:

Written by Hugo Lassiège

Software Engineer with more than 20 years of experience. I love to share about technologies and startups

Copyright © 2024
 Eventuallymaking
  Powered by Bloggrify