feat: add more tech | move projects to another file and update them

public/locales/en-US.json

@@ -96,7 +96,6 @@
   "Projects": {
     "Title": "Projects",
     "N-D-B": {
-      "Title": "N-D-B",
       "Description": "N-D-B is a Discord bot developed using DiscordJS and Necord an library for NestJS. It is a multipurpose bot that has several features, such as moderation, music, and fun commands. The bot is designed to be easy to use and has a simple and intuitive interface. It is constantly being updated with new features and improvements."
     }
   },

public/locales/pt-BR.json

@@ -96,7 +96,6 @@
   "Projects": {
     "Title": "Projetos",
     "N-D-B": {
-      "Title": "N-D-B",
       "Description": "N-D-B é um bot do Discord desenvolvido usando DiscordJS e Necord uma biblioteca para o NestJS. É um bot multipropósito que possui várias funcionalidades, como moderação, música e comandos divertidos. O bot é projetado para ser fácil de usar e possui uma interface simples e intuitiva. Ele está sendo constantemente atualizado com novos recursos e melhorias."
     }
   },

src/@types/index.d.ts

@@ -1,8 +1,12 @@
 export type Techs =
+  | "BiomeJS"
   | "CSS3"
   | "DiscordJS"
+  | "Docker"
+  | "ESLint"
   | "HTML5"
   | "JavaScript"
+  | "MongoDB"
   | "Necord"
   | "NestJS"
   | "NextJS"
@@ -15,8 +19,28 @@ export type Techs =
   | "Vercel"
   | "Yarn";
 
+export type SkillCategory =
+  | "Frontend"
+  | "Backend"
+  | "Database"
+  | "DevOps"
+  | "Tools"
+  | "Library"
+  | "Framework"
+  | "ProgrammingLanguage";
+
 export type SkillData = {
   name: string;
   description: string;
+  categories: SkillCategory[];
   url: string;
 };
+
+export type ProjectCategories = "";
+
+export type Project = {
+  name: string;
+  description: string;
+  techs: Techs[];
+  categories: ProjectCategories[];
+};

src/components/projects/projects.tsx

@@ -1,26 +1,18 @@
 import { useTranslations } from "next-intl";
 import { ProjectsSmallCard } from "./small-card";
-import { Techs } from "@/@types";
+import { projects } from "@/constants/projects";
 
 export function ProjectsSection() {
   const t = useTranslations("Projects");
 
-  const projects: { name: string, description: string, techs: Techs[]}[] = [
-    {
-      name: t("N-D-B.Title"),
-      description: t("N-D-B.Description"),
-      techs: ["Necord", "NestJS", "TypeScript", "NodeJS", "DiscordJS", "Prisma", "Yarn", "PostgreSQL"],
-    },
-  ]
-
 	return (
     <section id="projects" className="grid justify-center h-screen text-white">
       <div className="mt-8 flex justify-center items-center text-4xl">
         {t("Title")}
       </div>
       <div>
         {projects.map((project) => (
-          <ProjectsSmallCard key={project.name} name={project.name} description={project.description} techs={project.techs} />
+          <ProjectsSmallCard key={project.name} name={project.name} description={t(project.description)} techs={project.techs} />
         ))}
       </div>
     </section>

src/constants/projects.ts

@@ -0,0 +1,21 @@
+import { Project } from "@/@types";
+
+export const projects: Project[] = [
+  {
+    name: "N-D-B",
+    description: "N-D-B.Description",
+    categories: [],
+    techs: [
+      "NodeJS",
+      "TypeScript",
+      "NestJS",
+      "DiscordJS",
+      "Necord",
+      "Prisma",
+      "PostgreSQL",
+      "Yarn",
+      "BiomeJS",
+      "Docker",
+    ],
+  },
+];

src/constants/skills.ts

@@ -4,106 +4,127 @@ export const skills: SkillData[] = [
   {
     name: "BeekeeperStudio",
     description: "BeekeeperStudio.Description",
+    categories: ["Database", "Tools"],
     url: "https://www.beekeeperstudio.io/",
   },
   {
     name: "BiomeJS",
     description: "BiomeJS.Description",
+    categories: ["Tools"],
     url: "https://biomejs.com/",
   },
   {
     name: "CSS3",
     description: "CSS3.Description",
+    categories: ["Frontend"],
     url: "https://developer.mozilla.org/en-US/docs/Web/CSS",
   },
   {
     name: "DiscordJS",
     description: "DiscordJS.Description",
+    categories: ["Library"],
     url: "https://discord.js.org/",
   },
   {
     name: "Docker",
     description: "Docker.Description",
+    categories: ["DevOps", "Tools"],
     url: "https://www.docker.com/",
   },
   {
     name: "ESLint",
     description: "ESLint.Description",
+    categories: ["Tools"],
     url: "https://eslint.org/",
   },
   {
     name: "HTML5",
     description: "HTML5.Description",
+    categories: ["Frontend"],
     url: "https://developer.mozilla.org/en-US/docs/Web/HTML",
   },
   {
     name: "JavaScript",
     description: "JavaScript.Description",
+    categories: ["Frontend", "Backend"],
     url: "https://developer.mozilla.org/en-US/docs/Web/JavaScript",
   },
   {
     name: "MongoDB",
     description: "MongoDB.Description",
+    categories: ["Database"],
     url: "https://www.mongodb.com/",
   },
   {
     name: "Necord",
     description: "Necord.Description",
+    categories: ["Library"],
     url: "https://necord.org/",
   },
   {
     name: "NestJS",
     description: "NestJS.Description",
+    categories: ["Backend"],
     url: "https://nestjs.com/",
   },
   {
     name: "NextJS",
     description: "NextJS.Description",
+    categories: ["Frontend", "Backend"],
     url: "https://nextjs.org/",
   },
   {
     name: "NodeJS",
     description: "NodeJS.Description",
+    categories: ["Backend", "Frontend"],
     url: "https://nodejs.org/",
   },
   {
     name: "PostgreSQL",
     description: "PostgreSQL.Description",
+    categories: ["Database"],
     url: "https://www.postgresql.org/",
   },
   {
     name: "Postman",
     description: "Postman.Description",
+    categories: ["Tools"],
     url: "https://www.postman.com/",
   },
   {
     name: "Prisma",
     description: "Prisma.Description",
+    categories: ["Database", "Tools"],
     url: "https://www.prisma.io/",
   },
   {
     name: "ReactJS",
     description: "ReactJS.Description",
+    categories: ["Frontend"],
     url: "https://reactjs.org/",
   },
   {
     name: "TailwindCSS",
     description: "TailwindCSS.Description",
+    categories: ["Frontend"],
     url: "https://tailwindcss.com/",
   },
   {
     name: "TypeScript",
     description: "TypeScript.Description",
+    categories: ["Frontend", "Backend"],
     url: "https://www.typescriptlang.org/",
   },
   {
     name: "Vercel",
     description: "Vercel.Description",
+    categories: ["DevOps", "Tools"],
     url: "https://vercel.com/",
   },
   {
     name: "Yarn",
     description: "Yarn.Description",
+    categories: ["Tools"],
     url: "https://yarnpkg.com/",
   },
 ];