feat: add start component

public/locales/en-US.json

@@ -5,23 +5,22 @@
 			"description": "Get to know me and explore my projects!"
 		}
 	},
-	"Pages": {
-		"Home": {}
-	},
 	"Theme": {
-		"Toggle": "Toggle theme",
 		"Dark": "Dark",
 		"Light": "Light"
 	},
 	"Copy": "Copy",
 	"Reload": "Click here to back to main page",
-	"Hello": "Hello, World!",
+	"Start": {
+		"Hello": "Hello, World!",
+		"Name": "My name is Miguel",
+		"Details": "Your next Back-end Developer"
+	},
 	"ErrorToast": {
 		"Title": "Error copied!",
 		"Description": "Error code has copied to clipboard"
 	},
 	"Languages": {
-		"Change": "Change Language",
 		"pt-BR": "Portuguese",
 		"en-US": "English"
 	}

public/locales/pt-BR.json

@@ -5,23 +5,22 @@
 			"description": "Me conheça melhor e visualize meus projetos!"
 		}
 	},
-	"Pages": {
-		"Home": {}
-	},
 	"Theme": {
-		"Toggle": "Mudar tema",
 		"Dark": "Escuro",
 		"Light": "Claro"
 	},
 	"Copy": "Copiar",
 	"Reload": "Clique aqui para voltar para a página principal",
-	"Hello": "Olá, Mundo!",
+	"Start": {
+		"Hello": "Olá, Mundo!",
+		"Name": "Meu nome é Miguel",
+		"Details": "Seu próximo Desenvolvedor Back-end"
+	},
 	"ErrorToast": {
 		"Title": "Erro copiado!",
 		"Description": "Código de erro copiado para a area de transferência"
 	},
 	"Languages": {
-		"Change": "Mudar Idioma",
 		"pt-BR": "Português",
 		"en-US": "Inglês"
 	}

src/app/[locale]/page.tsx

@@ -5,12 +5,14 @@ import {
 	Footer,
 	Header,
 	Projects,
+	Start,
 } from "@/components";
 
 export default function Home() {
 	return (
 		<main>
 			<Header />
+			<Start />
 			<About />
 			<Competencies />
 			<Projects />

src/components/index.ts

@@ -6,5 +6,6 @@ export * from "./footer"
 export * from "./header"
 export * from "./main-container"
 export * from "./projects"
+export * from "./start"
 export * from "./theme/theme-provider"
 export * from "./theme/toggle-theme"

src/components/start.tsx

@@ -0,0 +1,16 @@
+import { useTranslations } from "next-intl";
+
+export function Start() {
+	const t = useTranslations("Start");
+
+	return (
+		<section
+			id="start"
+			className="h-screen--100px bg-zinc-600 flex flex-col items-center justify-center text-center space-y-2"
+		>
+			<div className="text-3xl">{t("Hello")}</div>
+			<div className="text-6xl">{t("Name")}</div>
+			<div className="text-2xl">{t("Details")}</div>
+		</section>
+	);
+}