Fetch, process, output, style, listen

Category: Blog

Tagged: web dev, html, css, js

Published at:

In a sea of various possibilities for how to build a website, here’s my preferred way.

Fetch

Since forever, there have been systems for managing content where users manage their content. It doesn’t matter if it is a cloud, a database, or a file. The data is stored somewhere, and we need to fetch it somehow. In most cases of static sites, it makes sense to fetch the data and let the website framework consume it.

Process

Sometimes, the fetched data isn’t in the most desirable format. It makes sense to apply some transformations to the data to display it most efficiently.

Output

The prepared data then needs to be displayed. Choosing a templating language is often a way to go.

Style

Once the data is on the screen, it is time to style it. Choose what you’re most comfortable with, but consider maintainability and scalability.

Listen

Finally, adding scripts that respond to users’ actions enables users to interact with the site.

My favorites in 2024

  • Contentful for storing the data
  • Eleventy to fetch and process the data
  • LiquidJS for templating
  • Vanilla CSS for styling
  • Vanilla JS for interactivity

Conclusion

You can go far with simple solutions. Don’t overcomplicate, use proven solutions, and think long-term.