diff --git a/README.md b/README.md
index 7f226b5..645c211 100644
--- a/README.md
+++ b/README.md
@@ -4,8 +4,8 @@ Created using Preact + Vite
## Getting Started
-- `npm run dev` - Starts a dev server at http://localhost:5173/
+- `bun dev` - Starts a dev server at http://localhost:5173/
-- `npm run build` - Builds for production, emitting to `dist/`. Prerenders all found routes in app to static HTML
+- `bun run build` - Builds for production, emitting to `dist/`. Prerenders all found routes in app to static HTML
-- `npm run preview` - Starts a server at http://localhost:4173/ to test production build locally
+- `bun preview` - Starts a server at http://localhost:4173/ to test production build locally
diff --git a/src/assets/knedita-light.svg b/src/assets/knedita-light.svg
index edb60ba..db05c4d 100644
--- a/src/assets/knedita-light.svg
+++ b/src/assets/knedita-light.svg
@@ -1,9 +1,3 @@
-
-
-
-
-
\ No newline at end of file
+
+
+
diff --git a/src/assets/portfolio.svg b/src/assets/portfolio.svg
new file mode 100644
index 0000000..42a0ba7
--- /dev/null
+++ b/src/assets/portfolio.svg
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 843fe0a..bd48890 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -11,9 +11,9 @@ export function Header() {
return (
-
+
-
+
scroll("home")}
diff --git a/src/components/Icons.ts b/src/components/Icons.ts
index f77eb16..4634c72 100644
--- a/src/components/Icons.ts
+++ b/src/components/Icons.ts
@@ -16,6 +16,8 @@ import MongoDB from "../assets/tech/mongo.svg";
import Postgres from "../assets/tech/postgres.svg";
import Tailwind from "../assets/frameworks/tailwind.svg";
import React from "../assets/frameworks/react.svg";
+import Knedita from "../assets/knedita-light.svg";
+import Portfolio from "../assets/portfolio.svg";
export const Icons = {
languages: { Javascript, Typescript, Rust },
@@ -24,4 +26,5 @@ export const Icons = {
devops: { Docker, Linux, Git, Actions },
docs_tests: { Swagger, Jest },
db_orm: { Prisma, Postgres, MongoDB },
+ projects: { Knedita, Portfolio },
};
diff --git a/src/components/ProjectGrid.tsx b/src/components/ProjectGrid.tsx
new file mode 100644
index 0000000..69c2004
--- /dev/null
+++ b/src/components/ProjectGrid.tsx
@@ -0,0 +1,72 @@
+import { Icons } from "./Icons";
+import { useTranslation } from "react-i18next";
+
+export function ProjectGrid() {
+ const { t } = useTranslation();
+
+ const projects = t("projects.list", { returnObjects: true });
+
+ const fetchIcon = (icon) => {
+ if (icon.startsWith("https")) {
+ return icon;
+ }
+
+ switch (icon) {
+ case "knedita-light":
+ return Icons.projects.Knedita;
+ case "portfolio":
+ return Icons.projects.Portfolio;
+ default:
+ return null;
+ }
+ };
+
+ return (
+
+ {Object.entries(projects).map(([key, project]) => (
+
+
+
+
{project.name}
+
+
+
{project.description}
+
+ {t("projects.license")}: {project.license}
+
+
+ {project.stack && project.stack.length > 0 && (
+
+
+ {t("projects.stack")}
+
+
+ {project.stack.map((item, k) => (
+
+ {item}
+
+ ))}
+
+
+ )}
+
+
+ {t("projects.checkProject")}
+
+
+ ))}
+
+ );
+}
diff --git a/src/index.tsx b/src/index.tsx
index bb66910..6e5a28d 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -15,7 +15,6 @@ import './i18n';
export function App() {
return (
-
diff --git a/src/locale/en.json b/src/locale/en.json
index d62c31e..081d6d9 100644
--- a/src/locale/en.json
+++ b/src/locale/en.json
@@ -9,8 +9,44 @@
"i18n": "Also available in:",
"description": "I started studying programming back in 2017 when I was 11 years old! Since then I've been creating a few projects to improve my skills.",
"technologies": "Technologies",
- "projects": "Projects & Contributions",
- "knedita": "An open-source social media.",
- "biome": "Contributed to the Portuguese translation of the documentation"
+ "projects_contributions": "Projects & Contributions",
+ "projects": {
+ "license": "License",
+ "stack": "Stack",
+ "checkProject": "Check this project",
+ "list": [
+ {
+ "name": "Project Knedita",
+ "description": "An open-source social media",
+ "license": "MIT",
+ "stack": [
+ "Typescript",
+ "Bun",
+ "NestJS",
+ "Prisma",
+ "Kysely",
+ "Postgres",
+ "Redis"
+ ],
+ "icon": "knedita-light",
+ "link": "https://github.com/hknsh/project-knedita"
+ },
+ {
+ "name": "BiomeJS",
+ "description": "Contributed to the Portuguese translation of the documentation",
+ "license": "Apache 2.0 & MIT",
+ "icon": "https://avatars.githubusercontent.com/u/140182603",
+ "link": "https://github.com/biomejs/biome"
+ },
+ {
+ "name": "hknsh's house",
+ "description": "My portfolio",
+ "license": "MIT",
+ "stack": ["Preact", "Vite", "Bun", "shadcn/ui", "Typescript"],
+ "icon": "portfolio",
+ "link": "https://git.hknsh.com/hknsh/hknsh-house"
+ }
+ ]
+ }
}
}
diff --git a/src/locale/ja.json b/src/locale/ja.json
index ac0bb8a..8cb74be 100644
--- a/src/locale/ja.json
+++ b/src/locale/ja.json
@@ -9,8 +9,44 @@
"i18n": "他の言語でも利用できます:",
"description": "2017年、まだ11歳のときにプログラミングの勉強を始めました。それ以来、スキルを磨くためにいくつかのプロジェクトを作ってきました。",
"technologies": "技術",
- "projects": "プロジェクトと貢献",
- "knedita": "オープンソースのSNS。",
- "biome": "ポルトガル語のドキュメント翻訳に貢献しました"
+ "projects_contributions": "プロジェクトと貢献",
+ "projects": {
+ "license": "ライセンス",
+ "stack": "スタック",
+ "checkProject": "このプロジェクトを見て",
+ "list": [
+ {
+ "name": "Project Knedita",
+ "description": "オープンソースのSNS",
+ "license": "MIT",
+ "stack": [
+ "Typescript",
+ "Bun",
+ "NestJS",
+ "Prisma",
+ "Kysely",
+ "Postgres",
+ "Redis"
+ ],
+ "icon": "knedita-light",
+ "link": "https://github.com/hknsh/project-knedita"
+ },
+ {
+ "name": "BiomeJS",
+ "description": "ポルトガル語のドキュメント翻訳に貢献しました",
+ "license": "Apache 2.0 & MIT",
+ "icon": "https://avatars.githubusercontent.com/u/140182603",
+ "link": "https://github.com/biomejs/biome"
+ },
+ {
+ "name": "hknsh's house",
+ "description": "私のポートフォリオ",
+ "license": "MIT",
+ "stack": ["Preact", "Vite", "Bun", "shadcn/ui", "Typescript"],
+ "icon": "portfolio",
+ "link": "https://git.hknsh.com/hknsh/hknsh-house"
+ }
+ ]
+ }
}
}
diff --git a/src/locale/pt.json b/src/locale/pt.json
index 0cc40e7..6b75dbf 100644
--- a/src/locale/pt.json
+++ b/src/locale/pt.json
@@ -9,8 +9,44 @@
"i18n": "Também disponível em:",
"description": "Comecei a estudar programação em 2017, quando eu tinha apenas 11 anos. Desde então venho criando alguns projetos para aprimorar minhas habilidades",
"technologies": "Tecnologias",
- "projects": "Projetos & Contribuições",
- "knedita": "Uma rede social open-source.",
- "biome": "Contribuí na tradução em Português da documentação"
+ "projects_contributions": "Projetos & Contribuições",
+ "projects": {
+ "license": "Licença",
+ "stack": "Tecnologias",
+ "checkProject": "Confira esse projeto!",
+ "list": [
+ {
+ "name": "Project Knedita",
+ "description": "Uma rede social open-source.",
+ "license": "MIT",
+ "stack": [
+ "Typescript",
+ "Bun",
+ "NestJS",
+ "Prisma",
+ "Kysely",
+ "Postgres",
+ "Redis"
+ ],
+ "icon": "knedita-light",
+ "link": "https://github.com/hknsh/project-knedita"
+ },
+ {
+ "name": "BiomeJS",
+ "description": "Contribuí na tradução em Português da documentação",
+ "license": "Apache 2.0 & MIT",
+ "icon": "https://avatars.githubusercontent.com/u/140182603",
+ "link": "https://github.com/biomejs/biome"
+ },
+ {
+ "name": "hknsh's house",
+ "description": "Meu portfolio!",
+ "license": "MIT",
+ "stack": ["Preact", "Vite", "Bun", "shadcn/ui", "Typescript"],
+ "icon": "portfolio",
+ "link": "https://git.hknsh.com/hknsh/hknsh-house"
+ }
+ ]
+ }
}
}
diff --git a/src/pages/Home/index.tsx b/src/pages/Home/index.tsx
index 3812536..6035633 100644
--- a/src/pages/Home/index.tsx
+++ b/src/pages/Home/index.tsx
@@ -1,16 +1,10 @@
import { TechnologiesTab } from "@/components/TechnologiesTab";
-import { Card, CardContent } from "@/components/ui/card";
-import {
- Carousel,
- CarouselContent,
- CarouselItem,
- CarouselNext,
- CarouselPrevious,
-} from "@/components/ui/carousel";
import { Separator } from "@/components/ui/separator";
import { useState } from "preact/hooks";
import { useTranslation } from "react-i18next";
import { useEffect } from "react";
+import { Header } from "@/components/Header";
+import { ProjectGrid } from "@/components/ProjectGrid";
export function Home() {
const {
@@ -33,83 +27,70 @@ export function Home() {
localStorage.setItem("language", lang);
};
return (
-
-
-
-
{t("hello")}
-
{t("introduction")}
-
-
{t("i18n")}
-
-
-
- handleChangeLanguage("en")}
- className="link text"
- >
- English,
-
-
-
- handleChangeLanguage("pt")}
- className="link text"
- >
- Português do Brasil,
-
-
-
- handleChangeLanguage("ja")}
- className="link text"
- >
- 日本語
-
-
-
+ <>
+
+
+
+
+
+
{t("hello")}
+
{t("introduction")}
+
+
{t("i18n")}
+
+
+
+ handleChangeLanguage("en")}
+ className="link text"
+ >
+ English,
+
+
+
+ handleChangeLanguage("pt")}
+ className="link text"
+ >
+ Português do Brasil,
+
+
+
+ handleChangeLanguage("ja")}
+ className="link text"
+ >
+ 日本語
+
+
+
+
+
+
{t("description")}
+
+
+
+
+
+
+
{t("technologies")}
+
-
{t("description")}
-
-
+
-
-
-
{t("technologies")}
-
-
-
-
-
-
-
-
-
{t("projects")}
-
-
-
-
-
-
-
-
- Project Knedita
-
-
-
-
-
-
-
-
-
+
+
+
{t("projects_contributions")}
+
+
-
+ >
);
}
diff --git a/src/pages/_404.tsx b/src/pages/_404.tsx
index 36182c8..04c7d2d 100644
--- a/src/pages/_404.tsx
+++ b/src/pages/_404.tsx
@@ -1,8 +1,11 @@
export function NotFound() {
return (
-
- 404: Not Found
- It's gone :(
+
);
}