Skip to content
All projects

08Portfolio

Rank badges — ranks and badges for NodeBB forums

A plugin for NodeBB 4 forums that shows a member’s rank or team badge next to their name in every post. It runs on the wirelab forum with shark and hedgehog badges, and it is available as an open-source package on npm and GitHub.

By the numbers

Rank levels in the default ladder
6
Audit fixes in version 1.1.0
27
Automated tests
33
01

Problem

On a technical forum it helps to see straight away who is writing: a newcomer, a regular or a moderator. NodeBB 4 has nothing built in for this, and the existing add-ons either do not work with version 4 or need changes to the theme’s templates. The wirelab forum is also bilingual, so a rank’s name has to appear in the reader’s language, not in the forum’s default one.

02

Approach

I wrote a plugin in which a rank is earned through post count, reputation or both at once. By default there are six levels, from ‘New at the bench’ to ‘Builder’, and administrators, moderators and any chosen groups get a badge of their own instead of a rank. Everything is set up in the admin panel, in English or Polish: names in each language, thresholds, colours and images. The panel checks the settings before saving and warns about things like a rank nobody can reach or a group that does not exist. The rank’s name stays in the reader’s language even when the forum loads more posts without a page reload or a new reply arrives live. Text typed into the panel cannot slip any code onto the page, and images are only accepted from safe addresses. To keep the forum fast, finished badges are kept in memory and group membership is checked once for the whole page rather than separately for every post.

03

Outcome

The plugin runs on forum.wirelab.pl, where every rank has a shark or hedgehog image. I released it under the MIT licence on npm and GitHub as nodebb-plugin-rank-badges. Before version 1.1.0 it went through an audit that found 27 things to fix, from the rules for awarding ranks to small bugs in the panel. I fixed all of them, and 33 automated tests now cover the rank rules, the settings checks and the security measures.

How it works

  1. 01

    Ranks for activity

    A rank grows with post count, reputation or both. On the wirelab forum every level has its own shark or hedgehog badge, and instead of an image the plugin can show a level bar with the name.

    Ranks for activity
  2. 02

    Team badges

    Administrators, moderators and members of chosen groups get a badge instead of a rank. The order is fixed, so a category moderator always gets the moderator badge, even if they also belong to another group. Membership of hidden groups stays hidden, just as it does in NodeBB itself.

    Team badges
  3. 03

    In the reader’s language

    The Polish and English versions of the forum show rank names in the reader’s language. That includes replies that arrive live and posts loaded as you scroll.

  4. 04

    Settings that check themselves

    Invalid values, such as a threshold written as a fraction or a rank without a name, are rejected in the browser and again on the server. If the panel cannot read the stored settings, it blocks saving so the defaults cannot overwrite them.

Write