The new Hack Club Toolbox!

Deals for Hack Clubbers—powered by Next.js, Theme UI & MDX.

How do I add a card?

All the cards except for the current ones are stored in manifest.js. If you take a look at it, you'll notice it's in JSON:

exportdefault[{category: 'Perks',color: 'primary',icon: 'bag',items: [{name: 'Zoom Pro Meetings',description: 'Run Zoom Pro meetings for free in your Hack Club',icon: 'welcome',external: false,url: '/zoom.mdx',forUseBy: 'clubbers'},
...
]},
...
]

To add a card to an existing category, you simply add to the cards in the category, like so:

export default [
{
category: 'Perks',
color: 'primary',
icon: 'bag',
items: [
{
name: 'Zoom Pro Meetings',
description: 'Run Zoom Pro meetings for free in your Hack Club',
icon: 'welcome',
external: false,
url: '/zoom.mdx',
forUseBy: 'clubbers'
},
+ {+ name: 'Theme',+ description: "Hack Club's theme, using Theme UI",+ icon: 'grid',+ external: true,+ url: 'https://theme.hackclub.com',+ forUseBy: 'everyone'+ }
]
},

To add a new category, you'll follow a similar pattern at the bottom of the file:

export default [
{
category: 'Perks',
color: 'primary',
icon: 'bag',
items: [
{
name: 'Zoom Pro Meetings',
description: 'Run Zoom Pro meetings for free in your Hack Club',
icon: 'welcome',
external: false,
url: '/zoom.mdx',
forUseBy: 'clubbers'
},
]
},
+ {+ category: '<Category name>',+ color: '<Category color>',+ icon: '<Category icon>'+ items: [+ ...+ ]+ }
]

For color and icon, you can use Hack Club's theme.

When you edit the file to make these changes, you'll be asked to make a pull request.

Let us know if you have any questions (or find any issues) in the #leaders channel on our Slack or email clubs@hackclub.com