Files
zulu0echo 93b8c10f68 Update zk-id.ts
updated links
2025-05-23 09:21:12 +08:00
..
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-01-30 21:24:18 +00:00
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-05-19 15:38:31 -05:00
2025-04-09 06:35:30 +01:00
2024-12-18 23:54:11 +00:00
2025-05-21 14:24:24 +02:00
2024-11-06 23:35:58 +01:00
2025-03-24 14:26:18 +01:00
2025-03-25 15:01:49 +00:00
2025-04-17 14:13:18 +02:00
2025-05-19 10:11:06 -05:00
2025-04-22 14:33:48 +01:00
2025-04-09 06:35:30 +01:00
2025-05-12 11:41:32 +01:00
2025-05-12 18:27:42 +01:00
2024-11-06 23:35:58 +01:00
2025-05-21 14:24:24 +02:00
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-05-12 11:41:32 +01:00
2025-04-09 06:35:30 +01:00
2024-11-06 23:35:58 +01:00
2025-04-09 06:35:30 +01:00
2025-04-09 06:35:30 +01:00
2025-04-10 15:18:33 +02:00
2024-11-06 23:35:58 +01:00
2025-04-09 06:35:30 +01:00
2025-05-12 11:41:32 +01:00
2024-12-17 00:09:37 +01:00
2025-04-09 06:35:30 +01:00
2025-05-23 09:21:12 +08:00
2024-11-06 23:35:58 +01:00
2025-04-09 06:35:30 +01:00
2025-01-27 12:59:42 -03:00
2025-04-09 06:35:30 +01:00
2025-04-10 00:21:52 +01:00
2025-04-09 06:35:30 +01:00

How to Add a New Project to the Projects List

1. Create a New Project File:

  • Go to the ../data/projects folder in your project.
  • Create a new file named [project-name].ts

2. Add Project Details:

  • Open the newly created [project-name].ts file.
  • Use the ProjectInterface template to add the necessary details. Here's a basic example (please copy this for a quick start):
import { ProjectInterface, ProjectStatus } from "@/lib/types"

export const projectName: ProjectInterface = {
  id: "project-name",
  image: "",
  name: "Project Example",
  section: "pse",
  projectStatus: ProjectStatus.ACTIVE,
  content: {
    en: {
      tldr: "Short description",
      description: `
## Heading

Sample project description goes here. You can also use **Markdown** for formatting.
        `,
    },
  },
  tags: {
    keywords: [],
    themes: [],
    types: [],
    builtWith: [],
  },
}

Note: Make sure to add all the necessary language versions (locales) under content to support every language you need. Markdown is supported, so feel free to format accordingly.

3. Register the New Project:

  • Open the [...]/data/projects.ts file where all projects are listed.
  • Add your new project to the projects array to make it visible:
import { projectName } from './projects/[project-name].ts';

const projects: ProjectInterface[] = [
  // other projects
  projectName,
];

That's it! Your new project will now be visible. Here is Overview example

Project overview

To add extra link to projects we need to add extraLinks for the projects we are going to add links for. Make sure that for every "themes" value there is a specific "extraLinks" object will all the links.

import { ProjectCategory, ProjectInterface, ProjectStatus } from '@/lib/types'

export const example: ProjectInterface = {
  id: "example",
  image: "",
  name: "This is an example of the project",
  category: ProjectCategory.RESEARCH, // 'APPLICATIONS', 'RESEARCH' or  'DEVTOOLS'
  section: "pse", // 'pse', 'grant', 'collaboration', 'archived'
  projectStatus: ProjectStatus.ACTIVE,
  tags: {
    themes: ["play", "buildWith"],
    keywords: ["Anonymity/privacy", "Voting/governance"],
    types: ["Lego sets/toolkits", "Infrastructure/protocol"],
    builtWith: ["p0tion", "JubjubLib"],
  },
  extraLinks: {
    buildWith: [
      {
        label: "Link to get started",
        url: 'https://google.it"',
      },
    ],
    play: [
      {
        label: "Link to get started",
        url: 'https://google.it"',
      },
    ],
  },
}

This is the result

Project links

Adding YouTube Videos to a Project

Add YouTube videos to your project by including a youtubeLinks array:

export const projectName: ProjectInterface = {
  // other properties...
  youtubeLinks: [
    "https://www.youtube.com/watch?v=XXXXXXXXXXX",
    "https://youtu.be/XXXXXXXXXXX",
    "XXXXXXXXXXX" // Just the YouTube video ID
  ],
}

The videos will appear as clickable thumbnails with titles on the project page:

YouTube Videos

Adding Team Members to a Project

Add team members to your project using the team array:

export const projectName: ProjectInterface = {
  // other properties...
  team: [
    {
      name: "John Doe",
      role: "Lead Developer",
      image: "/team/john-doe.jpg", // Optional
      email: "john.doe@example.com", // Optional
      links: { // Optional
        github: "https://github.com/johndoe",
        twitter: "https://twitter.com/johndoe"
      }
    }
  ],
}

Supported link types: github, website, discord, twitter, youtube, telegram

Project Team Members

Project detail now supports markdown

Please note the keyword and theme is curated by the comms & design team. If you wish to change, please create a PR.