KDE.org migrated to Hugo | Hacker News Reader

KDE.org migrated to Hugo

carlschwan.eu

191 pointsognarb80 comments

I used Hugo some years ago[1] and my memory of it was mostly negative in terms of usability. I revisited it again this year for another project and it drove me so mad that I ended up switching to Zola[2].

My issue with Hugo was that it just wasn't reliable with what was in the cache so I could never trust whether what I saw was actually the state of the site and causing me to push a broken state to the remote server. Hugo is great if it works but I found it a nightmare to deal with when it doesn't.

There are countless options in Hugo (yes I understand it's powerful but I rather it just had half the option and they work as advertised), some of which at times are contradictory so searching for solutions took me ages. I have no affiliation with the zola project and am not even big on Rust. Zola just worked for me and seems a lot less "hacky" than hugo thanks to the Tera templating system.

The Author of Zola writes on his github:

> [hugo] personally drives me insane, to the point of writing my own template engine and static site generator.

a sentiment that I share very much.

[1] https://web.archive.org/web/20180714043311/https://iotdarwin...

[2] https://github.com/getzola/zola

[3] https://github.com/getzola/after-dark

>it just wasn't reliable with what was in the cache so I could never trust whether what I saw was actually the state of the site and causing me to push a broken state to the remote server

Can you explain this a bit further? Why would what is/isn't in the cache cause issues? I must be missing something here. I have used Hugo before but not sure what this means exactly.

Similar story for me. Another point I find challenging with Hugo is that they very frequently release breaking changes. I want to upgrade because of features or speed, but there are only a few patches per version before there are also breaking changes. These happen so frequently it's hard to keep up.

Zola is less powerful, but does the job and feels much more stable.

Yeah, I had some issues with that. Simplest sites getting broken on updates. Nothing in the changelogs about breaking changes and no fucks given when reported. Still a good generator though.

what are you doing about images? all these generators seen to leave you in the dark about optimizing images.

I was doing image optimization manually but then there weren't much images in my case so that was doable by optimizing sizes/ resolution using Gimp. There are meanwhile better options but it's theme dependent. In hugo this is what I wanted:

https://after-dark.habd.as/

but IIRC not all of its image features were available in the theme's zola port https://github.com/getzola/after-dark

Hugo has integrated image processing: https://gohugo.io/content-management/image-processing/

According to the README, Zola has image processing support. Not sure exactly what that means though.

This is (unsurpisingly) a difficult problem to solve. I've been trying to help my colleague at Gatsby (a React based framework that uses static site generation) with improvements to the image optimization API Gatsby includes with its image plugins.

Just when you think you've handled every edge case, you have to account for screen pixel densities, better ways to infer sizes and srcSet attributes on picture tags, browsers with or without modern features for loading images in better.. it's no small task!

(I'm obviously biased but I think Gatsby's solution is pretty good now)

I originally preferred Jekyll to Hugo and this explains why most of the 20 KDE websites are using Jekyll, but I recently fell in love with Hugo.

Hugo was a lot harder to learn, the template engine from Hugo felt very strange for myself coming from Django, Twig and the Jekyll template engines. The template lookup order is complex and for small website this complexity is unnecessary.

When building a large website (kde.org has more than 1400 pages) all these features make sense. I can organize my template in directories, enjoy fast generation time, separating the templating part from the content, create SCSS files for each pages that needs a special layout. There is also a (fast) JS bundler integrated into Hugo. Afaik Zola also doesn't support i18n and Jekyll has a few plugins for that but this is not a build-in functionality.

Yep, internationalization in Zola is WIP: https://github.com/getzola/zola/pull/1148

There is i18n support already, just not as good as it would be with this PR (Fluent support etc).

Same story here. I was looking for a static site gen that was a bit more comfortable than my previous shell scripts around pandoc approach.

I settled on Hugo because it ticked all the boxes and even had org mode support.

The next three nights were horrible. I'm a professional web dev, full stack, I've used dozens of langs, frameworks, probably hundreds of tools. It took me three nights to set up a basic home page for an academic CV and some publication lists. Nothing more. And even then the whole thing was wonky and super unreliable for inscrutable reasons. Big red flag.

I was angry and frustrated, and I started doubting myself. So I pulled the plug. Tried Zola, I was done in 1.5hrs. Start to finish, just done. Zola is great.

I had the exact experience, but I'm not a web developer. Hugo was one of the more frustrating things I ever tried, I converted to Zola in about 2h and it was simple and it simply works.

Similar story for me (I also do full stack web dev professionally aswell), but with hugo->Jekyll.

Hours and days struggling with getting Hugo to do what I wanted until I gave up and had a Jekyll site up and running exactly how I wanted it within a few hours.

Who cares about saving 5 seconds site generation time when you lose days pulling your hair out just trying to get the damn thing to do what you want?

I've never felt that site generation time has been a problem for me, although I've only worked on things with 10s-100s of pages, not thousands... But then part of me wonders who it is out there who is doing site-wide updates to x,000 page sites who needs it to happen in 2 seconds? What kind of workflow on a site of that scale can't wait 30 seconds?

My home page (a few hundred pages, lots of images) took over one minute to build with Jekyll and around a second with Hugo. Waiting for a minute for every tiny change I make trying to figure out things makes it completely unusable.

That said, Hugo is the only piece of software I remember that makes me feel stupid.

It must be a awesome if you use it frequently, but I only make changes to my sites maybe once per year. I often struggle for hours to make simple changes or to figure out why it's not working. Two examples:

https://discourse.gohugo.io/t/raw-html-getting-omitted-in-0-... https://discourse.gohugo.io/t/comprehensive-hugo-tutorial-fo...

Sharing the feeling of others in this thread and happy to discover Zola! :)

You know what I did? I just wrote my own site generator in Go in under 200 LOC. I spent 2 hours writing it. It's very basic and does not do many things that these frameworks offer. I currently can create blog posts and pages from markdown. The nice thing about this is that I can just extend my go code as needed without having to (re)learn these frameworks; which is my biggest issue with any frameworks in general.

See https://vilkeliskis.com/static/build.go

I looked into moving a static sites from Hugo to Zola a while back, but decided against it because the Zola creator feels very strongly that URLs should never include dates -- to the point that they will not include the option of doing so in Zola [0].

[0]: https://github.com/getzola/zola/issues/635#issuecomment-5245...

Why is the world so full of static generators which are annoyingly limited like this? Just let us drop down to something (python?) if we want.

Then use an unopinionated, hackable/pluggable static site generator like Jekyll (written in Ruby).

One thing that's nice about having dozens of actively-developed static site generators is that if you don't like one you'll probably like a different one.

My experience (and maybe I'm not good enough at ruby) is extending is still annoying, in particular I can't put code in the site, I need to write (and to share easily, even publish) an extension.

Hey, it’s omakase :D

Pelican is an older system which allows you to do just that. https://blog.getpelican.com/

It's already got lots of plugins, but it's fairly easy to add your own as well. It's in the mature / complete category of projects in my opinion (although there's still some development happening)

Agreed. After writing my own static site generator in Python, I went back and was impressed with all the options available in Pelican. Lots of things I wished I had built were included.

I'm using my own hacked-together very basic system in Python right now, and am pretty happy with it. No doubt I might find myself wanting more features soon, but here's hoping I can stick with it, it's the first moderately interesting side project I've worked on.

Thanks for saving me from trying Zola. Dates in URLs are a must. I'm on Hugo and complexity is daunting for a personal site, but at least I have dates.

> My issue with Hugo was that it just wasn't reliable with what was in the cache so I could never trust whether what I saw was actually the state of the site and causing me to push a broken state to the remote server

Did you report these bugs anywhere? Can you be more specific? What were you caching?

If you're caching partials for example, you need to make sure you provide correct caching keys so are you sure it wasn't misuse?

Hugo was just too complicated for me. Felt like I was credentializing in something like Drupal all over again.

Trying to get everything on my Mac, GitHub and domain working with Jekyll and Hugo was harder than spinning up Wordpress. Caching is a solved problem on WP, not grokking the love for static site generators.

I have a positive view about Hugo, I have deployed it many times successfully and even taught classes using it.

The “disable fast renderer” option (for local development) is indeed a must have, or weird things happen indeed.

My students also found the documentation difficult to grasp in particular regarding the content types and related features (section, bundles, archetypes, ...).

I actually like go templates, so it was never an issue for me.

Funny, just spent this morning working on a Hugo project for the first time in a while, because I just discovered https://netlifycms.org.

I love Hugo and how fast it generates my business site (https://sunboxlabs.com), but having just hired a first (non-technical) writer I had a classic dilemma: either teach them the Hugo command line/markdown or switch to something like Forestry/ButterCMS/Wordpress for a non-technical CMS.

Then I found https://NetlifyCMS.org: You just add an /static/admin/ folder with two files in it and BOOM: non-technical users can create and edit posts with a Wordpress like dashboard (saves as Markdown to Git still). Strongly recommended.

What's your workflow for letting your writer preview the generated styled pages?

Great question. We basically set every article as a draft, and because they can write in WYSIWIG writer now (no markdown) and the netlifycms admin dashboard allows them to see a fully-rendered preview that gets us 80% of the way.

At that point (once we've checked the links and typos, etc) we flip the draft boolean to false and check the article looks as expected on production.

Not perfect – we'd probably have a staging server if we were bigger – but we're still small :)

Thanks, I was just thinking about how this works vs something like WordPress where you can preview how the actual edited page will look before you publish. Netlify CMS lets you view the Markdown, but the non-tech editor would have to understand there's a build delay to the page going live and the final page might need reviewing.

Nothing's perfect though, I just find most static site stories don't address the above so any thoughts are appreciated!

If I remember correctly you can have Netlify CMS commit changes to a branch that is auto-deployed, so you can see the fully rendered preview.

Yep, but how do you explain that to a non-tech person (e.g. URL to visit, how long to wait for the build to finish)?

It's all reflected in the UI, with a "View Live" button that appears when the build is done. It's quite user friendly. I recommend you test it yourself: https://cms-demo.netlify.com/

Hugo is amazing and I hope that it gets a huge amount of contributors to help improve it—but I wish they would take a couple development cycles to focus on basic functionality like SSL support in the server (for testing PWAs locally on your network), adding a tidy function (has a minify, why not tidy?), and building logic to use directories and files as titles automatically (as well as fixing the weird _index.md requirement) for nested directories.

There is a draft PR for tidying: https://github.com/gohugoio/hugo/pull/7825

Thank you for sharing that, I wasn't aware that it was being worked on finally. Looking forward to this one very much. Hopefully SSL support in the server will be next since it is the easiest to implement, then I hope the nested directories thing is resolved. That would make Hugo much more powerful.

If the author is here, could you please link to kde.org in the post? I read this post and had to type it on the browser address bar to check it out.

Also, has the entire kde.org website migrated to Hugo or is it only the Announcements section? The RSS feed linked in the post is for the announcements section alone. More clarity on this in this blog post would be good.

Thanks, I now added a direct link to kde.org in the blog post and I also added a link to the Capacity framework that was used previously.

The entire kde.org website migrated to Hugo. Previously only a very small part was using it (< 10 pages) and this was quite helpful to test if everything worked before porting the rest of the website.

Coincidentally, I just converted a small personal site from Hugo to Jekyll (a custom home page and a handful of blog posts). Took about 3 hours to make the full transition.

Build times went from 10 seconds to 0.2s.

I don't love the template language but once we've coded blog post pagination, head tags, image optimisation etc. it's rare you need much more.

The speed up feels amazing when you're developing, I love that it's a single binary as you know it'll build without issues when you return to it in a few months, and it has enough built in (Sass, minifying, JavaScript bundler, image optimisation) that you just focus on site content rather than procrastinating with your build chain.

> I just converted a small personal site from Hugo to Jekyll

Did you mean "from Jekyll to Hugo" instead?

Yep! Doh.

> A french, ukrainian, catalan, Dutch, and a few more languages are already available.

Why is it only Dutch which is capitalized? I'm genuinely curious (my English is not perfect, perhaps there is a rule behind this I don't know).

In American English, all of those should be capitalized. I assume this was just an editing error.

Huge fan of Hugo here. My personal site (https://ado.xyz) runs on Hugo and I've deployed a number of others.

For purely static sites, there is nothing better than Hugo imo. Next.js comes in at a close second, and is really handy when you need more than just a static site, but man I can't say enough good things about Hugo.

I use Hugo + org-mode for my blog. It’s native org rendering is very good and works well for posts with inline code using org-babel. I agree with what others have said that Hugo can be a pain to configure. My experience is that it’s dependent on the quality of the site template you start with.

When deciding a few months ago to update my Video Hub App website from hand-edited static template I used I wanted to find a good approach.

I needed i18n (internationalization) with unique per-language routes (as is described in this article). I tested Hugo but ended up going with Gatsby. I'm happy with the result - adding a new language now is just adding another .json file.

public: https://videohubapp.com/en/

GitHub: https://github.com/whyboris/video-hub-app-gatsby-website

Somewhat OT, but is the repeated use of "internalization" in the article instead of "internationalization" a common shortening of the term? I've seen i18n before, but it isn't really in my wheelhouse to know.

More likely just a typo due to a similar looking shorter word.

Looks like an autocorrector failure. Internalization is an existing word with a completely different meaning and similar grammatical function... The kind of replacement autocorrectors do.

It's not a common shortening. I'm not a native English speaker and I made an error. I corrected it, thank you.

Ah, thank you. I've been learning about internationalization recently and wanted to make sure I understood the lingo. Much appreciated.

Whoever you are that feels responsible, please add a note to the repo which hugo version you've used (or are currently using for the official build) or this might bite you a few years (months?) down the line, it has happened for most people I know who have used hugo.

We like it, but there breaking changes from time to time - especially if you only have a small team building the site, I was using a 4y old version until I did an upgrade in one go.

A few years ago, I made the switch from Jekyll to Hugo for various sites I've been developing. It was the best decision I ever made for that side web-dev career I'm entertaining.

Jekyll, to me, is a DIY tool; it's clunky and obscure and you only make it happen with your pliers and your hammer -- you can achieve nice little projects quite fast, but once you go for a more elaborate structure your work starts falling apart. Hugo is more like a construction company with very-well organized architects. Its logic is relentless, yet it is an incredible powerful tool once you master it -- and honestly the video tutorials by Mike Dane and documentation at gohugo.io are really well-made and if you're switching to Hugo, you should dedicate one day to watch the courses and RTFM.

The quality of the template from which you start might indeed be very determining of future success/frustration. Just don't rush it, you'll get there.

I've used Hugo for my very small, rarely updated, personal blog, and I really like it. Not sure how it works for larger scale websites.

Now, I'm surprised Markdown is often chosen over Asciidoc. Especially for larger website like KDE.org; it seems you'd want to use a markup language that is more standardized than MD.

> There is also now an RSS feed with all the latest announcements.

Good to see RSS is still being added to websites in 2020!

KDE loves RSS, we have 2 RSS readers, a Qt library for parsing RSS feed and a Planet (planet.kde.org) with a lot of post each week. Planet build with Jekyll.

Definitely a bit off topic, so feel free to vote me into oblivion.

Does anyone else get an almost visceral feeling of disgust most applications (or even words) that use K instead of C, or add a K just to fit the KDE motif?

I really want to like KDE, but there is something stylistic about it that drives me up the wall. I'm asking not to insult anyone, but to see if anyone has an explanation of why I react this way. Maybe it will remain an unexplained idiosyncrasy.

Do you feel the same when Apple named everything with an "i" like iPod, iTunes, iPhone, iBook, iMac, etc?

No, the K bothers me more. The G in GNU projects bothers me a bit.

I guess you're not German then ;). The k looks very normal to me, but that's because many of the words spelled with c in english are spelled with k in German. I suspect this is also where it comes from (KDE originated in Germany IIRC)

I agree with this, including GNU software that starts with "g". Actually to bringing this kinda into topic, Hugo itself is named (albeit, subtly) by the fact that it uses Go. I'm reminded of Rob Pike's polite reminder: https://twitter.com/rob_pike/status/618357610287226880

Note this is mostly a historic concern. KDE largely stopped doggedly naming new projects K-something over a decade ago. Yes, there's examples to the contrary, and of course there are major projects sensibly sticking by their already-established brands, but plenty of core projects don't follow this scheme anymore (obviously Plasma, for one).

It's largely a relic of a time before interoperability-enabling standardization via freedesktop.org specs, when "k = will work well with your desktop" had much more utility to users. The Gnome crowd did the more or less the same thing with g, and also stopped.

As others mentioned, plenty of other tech orgs have pulled branding moves like this, be it iSomething or "My Foo", and arguably those provided less actual utility. I would argue this should affect the relative levels of irksomeness. :-)

This is the old naming scheme, it is now hard to rename applications after they build their own reputation. Now KDE apps are trying to avoid Kname and either putting the k in a more elegant way or just avoid putting a k in the name. For example Elisa, KDE's new music player (https://elisa.kde.org), don't use a K in its name.

Which of the hundreds of kde.org websites exactly? The ones I inspected from https://invent.kde.org/websites had something else.

Ah, found it. This one: https://invent.kde.org/websites/kde-org

What are your thoughts on expanding hugo using Python?

I have similar python scripts as the OP, that handle generation and pre-processing of markdown files which then get used by Hugo. It feels hacky and something extra to ship.

Is there a way to extend Hugo or build add-ons to include custom functionality?

AFAIK there is no way to extends the Hugo with custom functionalities, like generating pages at run time. The only thing that is allowed is to add hooks when generating links, images and heading.

I used it to generated link to the API documentation directly from the Doxygen tags files: https://invent.kde.org/documentation/develop-kde-org/-/blob/.... This is quite verbose but in the end it allows me to do things like this: `[Action](docs:kirigami2;Action)`. This is visible on develop.kde.org, the other big Hugo project in KDE.

I'm a blogdown user that doesn't know a lick about html or css. I love hugo!

For those fighting with this and similar frameworks, you might consider simplifying with post-commit/recieve hooks, which is how I deploy some websites.

Can you explain a bit further please?

So, git hooks are basically executable scripts (of whatever language you have available, I use bash) placed in the .git/hooks dir, whcih are then executed at whichever event is designated (by the name of the script itself) For me, it's post-recieve. After initial setup, a push automatically triggers the post-recieve hook that does something like the following from my git dir:

    GIT_WORK_TREE=..../example.com git checkout -f

and voila, pushes are insta-live, but commits can be pulled and worked on in the meantime.

Learned from a few sources (shout out to Dreamhost for my original intro to this idea), but here are some relevant readings:

https://www.ibm.com/developerworks/library/wa-git/

https://opensource.com/life/16/8/how-construct-your-own-git-...

That was very helpful. Thank you.

Why not use vuepress? I love its search Feature

> KDE.org now uses the Hugo.

But in the footer there is "Powered by Jekyll with Type Theme". Hm...

The article site is powered by Jekyll. The actual KDE.org site is Hugo

The website of the blog post describing kde.org has the "Powered by Jekyll..." footer. The actual kde.org website that the blog post is talking about, does not.

See this comment: https://news.ycombinator.com/item?id=24945745

Reply on news.ycombinator.com