A little learning goes a long way.

Define a small win

Turn a meaningful moment into your first achievement.

The best achievements celebrate a real step forward. Start with a moment your users already care about: finishing a lesson, completing onboarding, or shipping a task.

The builder connects a metric to an award in a readable chain. When firstLessonCompleted becomes true, the engine unlocks First spark. Keep the built definitions in one shared module so your UI and server use the same rules.

Use readable titles and explain what the user did. The engine handles evaluation; your application decides which actions should count.

import { AchievementBuilder } from 'react-achievements';

export const achievements = AchievementBuilder
  .createBooleanAchievement('firstLessonCompleted')
  .withAward({
    title: 'First spark',
    description: 'Finish your first lesson.',
    icon: '✦',
  })
  .toConfig()