feat(Content): Add content for "about me" in en/es

public/locales/en/about-me.md

@@ -0,0 +1,32 @@
+Curious and self-taught by nature, my history with computing began in the late
+2000s, tinkering with the family PC (sometimes with disastrous results). This
+led me to always try to answer the "how does it work...?", "how can I do...?",
+or "how can I fix...?", leading me to self-investigation and
+exploration in various mediums that provide me with the knowledge to
+**fix**, **create**, and **build** projects.
+
+The area I like the most is **web programming** as a **fullstack
+developer**, but it is not the only thing I can do, as I'm also good in creating
+**terminal applications** and **scripts**. I can work to solve any problem in a
+conventional way or invent new solutions.
+
+My love for video games has played an important role in my life, not only in
+enjoying playing them, but going beyond to understand how they work
+under the hood in their different areas: game mechanics, narratives, level
+design, music, art, among others. I find it fascinating to see how developers
+overcome difficulties and invent innovative solutions to provide the best
+experience for the players.
+
+My philosophy is based on **always trying to improve**, though studies,
+research and updates that have provided me with knowledge of various
+technologies, such as: Javascript, Python, Rust, Lua, React, SASS, Bootstrap,
+Flask, ExpressJS, SQL, NoSQL, among others. Because of this, I am always in an
+infinite cycle of improvement and learning.
+
+My love for computer science has led me to explore and investigate other areas
+and interests, of which I can mention:
+
+- Being an enthusiast of **Linux** operating systems, using it both on my personal computers and on servers.
+- Special interest in maintaining my development environment **personalized and updated**, allowing me to develop in a comfortable, ergonomic and effective way.
+- Being part of the **selfhost** community, managing a variety of applications for personal use on **small personal servers**.
+- Being **passionate about video games**.

public/locales/es/about-me.md

@@ -0,0 +1,34 @@
+Curioso y autodidacta por naturaleza, mi historia con la computación parte a
+finales de los 2000, jugueteando con la PC familiar (a veces con resultados
+desastrosos). Esto me llevó a siempre tratar de responder el _"¿cómo
+funciona…?"_, _"¿cómo puedo hacer…?"_, o _¿cómo puedo solucionar…?_, llevándome
+a la auto-investigación y exploración en diversos medios que me entreguen el
+conocimiento para poder **resolver**, **crear** y **construir** proyectos.
+
+Lo que más me apasiona es la **programación web** como un **desarrollador
+fullstack**, pero no es lo único que puedo realizar, ya que también me
+desenvuelvo bien en la creación de **aplicaciones de terminal** y **scripts**.
+Puedo trabajar buscando resolver cualquier problema de forma convencional o
+inventar soluciones nuevas.
+
+Mi amor por los videojuegos ha jugado un rol importante en mi, lo cuál no se
+refiere tan solo disfrutar jugarlos, sino ir más allá, para lograr ver como
+funcionan por dentro en sus distintas disciplinas: mecánicas de juego,
+narrativas, diseño de niveles, música, arte, entre otros. Encuentro fascinate
+ver como los desarrolladores logran sortear dificultades he inventar soluciones
+innovadoras para lograr dar la mejor experiencia al jugador.
+
+Mi filosofía se basa en **siempre intentar mejorar**, realizando
+estudios, investigaciones y actualizaciones que me han proporcionado el
+conocimiento de diversas tecnologías, tales como: Javascript, Python, Rust,
+Lua, React, SASS, Bootstrap, Flask, ExpressJS, SQL, NoSQL, entre
+otros. Debido a esto siempre estoy en un infinito ciclo de mejora y
+aprendizaje.
+
+Mi amor por la informática me ha llevado a extender he investigar otras areas e
+intereses, de los cuales puedo nombrar:
+
+- Ser un entusiasta de los sistemas operativos **linux**, usándolo tanto en mis computadores personales como en servidores.
+- Interés especial en mantener mi **ambiente de desarrollo personalizado y actualizado**, permitiendome desarrollar de una manera cómoda, ergonómica y eficaz.
+- Ser parte de la comunidad **selfhost**, administrando varias aplicaciones para uso personal en **pequeños servidores propios**.
+- Ser **apasionado de los videojuegos**.

public/locales/es/translation.json

@@ -1,7 +1,7 @@
 {
   "titles": {
     "featuredWork": "Trabajo Destacado"
-  }
+  },
   "home": {
     "brief": "I like to code stuff, then watch my creations come to life and do things for me!"
   }

src/_locales/en/about-me.md

@@ -0,0 +1,32 @@
+Curious and self-taught by nature, my history with computing began in the late
+2000s, tinkering with the family PC (sometimes with disastrous results). This
+led me to always try to answer the "how does it work...?", "how can I do...?",
+or "how can I fix...?", leading me to self-investigation and
+exploration in various mediums that provide me with the knowledge to
+**fix**, **create**, and **build** projects.
+
+The area I like the most is **web programming** as a **fullstack
+developer**, but it is not the only thing I can do, as I'm also good in creating
+**terminal applications** and **scripts**. I can work to solve any problem in a
+conventional way or invent new solutions.
+
+My love for video games has played an important role in my life, not only in
+enjoying playing them, but going beyond to understand how they work
+under the hood in their different areas: game mechanics, narratives, level
+design, music, art, among others. I find it fascinating to see how developers
+overcome difficulties and invent innovative solutions to provide the best
+experience for the players.
+
+My philosophy is based on **always trying to improve**, though studies,
+research and updates that have provided me with knowledge of various
+technologies, such as: Javascript, Python, Rust, Lua, React, SASS, Bootstrap,
+Flask, ExpressJS, SQL, NoSQL, among others. Because of this, I am always in an
+infinite cycle of improvement and learning.
+
+My love for computer science has led me to explore and investigate other areas
+and interests, of which I can mention:
+
+- Being an enthusiast of **Linux** operating systems, using it both on my personal computers and on servers.
+- Special interest in maintaining my development environment **personalized and updated**, allowing me to develop in a comfortable, ergonomic and effective way.
+- Being part of the **selfhost** community, managing a variety of applications for personal use on **small personal servers**.
+- Being **passionate about video games**.

src/_locales/en/translation.json

@@ -0,0 +1,8 @@
+{
+  "titles": {
+    "featuredWork": "Featured Work"
+  },
+  "home": {
+    "brief": "I'm a software developer from Chile.\nI like to code stuff for the web, for the terminal or whatever seems fun!\nI enjoy problem solving and creating solutions, then watch my creations come to life and do things for me!"
+  }
+}

src/_locales/es/about-me.md

@@ -0,0 +1,34 @@
+Curioso y autodidacta por naturaleza, mi historia con la computación parte a
+finales de los 2000, jugueteando con la PC familiar (a veces con resultados
+desastrosos). Esto me llevó a siempre tratar de responder el _"¿cómo
+funciona…?"_, _"¿cómo puedo hacer…?"_, o _¿cómo puedo solucionar…?_, llevándome
+a la auto-investigación y exploración en diversos medios que me entreguen el
+conocimiento para poder **resolver**, **crear** y **construir** proyectos.
+
+Lo que más me apasiona es la **programación web** como un **desarrollador
+fullstack**, pero no es lo único que puedo realizar, ya que también me
+desenvuelvo bien en la creación de **aplicaciones de terminal** y **scripts**.
+Puedo trabajar buscando resolver cualquier problema de forma convencional o
+inventar soluciones nuevas.
+
+Mi amor por los videojuegos ha jugado un rol importante en mi, lo cuál no se
+refiere tan solo disfrutar jugarlos, sino ir más allá, para lograr ver como
+funcionan por dentro en sus distintas disciplinas: mecánicas de juego,
+narrativas, diseño de niveles, música, arte, entre otros. Encuentro fascinate
+ver como los desarrolladores logran sortear dificultades he inventar soluciones
+innovadoras para lograr dar la mejor experiencia al jugador.
+
+Mi filosofía se basa en **siempre intentar mejorar**, realizando
+estudios, investigaciones y actualizaciones que me han proporcionado el
+conocimiento de diversas tecnologías, tales como: Javascript, Python, Rust,
+Lua, React, SASS, Bootstrap, Flask, ExpressJS, SQL, NoSQL, entre
+otros. Debido a esto siempre estoy en un infinito ciclo de mejora y
+aprendizaje.
+
+Mi amor por la informática me ha llevado a extender he investigar otras areas e
+intereses, de los cuales puedo nombrar:
+
+- Ser un entusiasta de los sistemas operativos **linux**, usándolo tanto en mis computadores personales como en servidores.
+- Interés especial en mantener mi **ambiente de desarrollo personalizado y actualizado**, permitiendome desarrollar de una manera cómoda, ergonómica y eficaz.
+- Ser parte de la comunidad **selfhost**, administrando varias aplicaciones para uso personal en **pequeños servidores propios**.
+- Ser **apasionado de los videojuegos**.

src/_locales/es/translation.json

@@ -0,0 +1,8 @@
+{
+  "titles": {
+    "featuredWork": "Trabajo Destacado"
+  },
+  "home": {
+    "brief": "I like to code stuff, then watch my creations come to life and do things for me!"
+  }
+}

src/components/LocalizedMarkdown.astro

@@ -0,0 +1,31 @@
+---
+import i18next from 'i18next';
+import config from '../../astro-i18next.config.mjs';
+
+export interface Props {
+  path: string;
+}
+
+const { path } = Astro.props;
+
+const pages = await Astro.glob('../../public/locales/**/*.md');
+let markdown;
+
+markdown = pages.find((page) =>
+  page.file.includes(`locales/${i18next.language}/${path}`),
+);
+
+if (!markdown) {
+  markdown = pages.find((page) =>
+    page.file.includes(`locales/${config.defaultLocale}/${path}`),
+  );
+}
+
+if (!markdown) {
+  throw Error(`The file: "${path}" was not found.`);
+}
+
+const { Content } = markdown;
+---
+
+<Content />

src/components/Navbar.astro

@@ -45,6 +45,9 @@ const links = [
               </li>
             ))
           }
+          <li class="nav-item mb-3">
+            <LangSelector />
+          </li>
         </ul>
       </nav>
     </OffCanvas>

src/pages/es/index.astro

@@ -3,6 +3,7 @@ import { getCollection, getEntry } from "astro:content";
 import { t, changeLanguage } from "i18next";
 import Layout from "../../layouts/Layout.astro";
 import Card from "../../components/Card.astro";
+import LocalizedMarkdown from "@components/LocalizedMarkdown.astro";
 import Button from "../../components/Button/Button.astro";
 import { Image } from "astro:assets";
 import portrait from "../../assets/images/portrait.jpg";
@@ -158,16 +159,7 @@ const portafolio = [
     <h2 class="text-center">Who am I?</h2>
 
     <p class="w-95 w-lg-70 mx-auto text-justify">
-      Lorem ipsum dolor sit amet, officia excepteur ex fugiat reprehenderit enim
-      labore culpa sint ad nisi Lorem pariatur mollit ex esse exercitation amet.
-      Nisi anim cupidatat excepteur officia. Reprehenderit nostrud nostrud ipsum
-      Lorem est aliquip amet voluptate voluptate dolor minim nulla est proident.
-      Nostrud officia pariatur ut officia. Sit irure elit esse ea nulla sunt ex
-      occaecat reprehenderit commodo officia dolor Lorem duis laboris cupidatat
-      officia voluptate. Culpa proident adipisicing id nulla nisi laboris ex in
-      Lorem sunt duis officia eiusmod. Aliqua reprehenderit commodo ex non
-      excepteur duis sunt velit enim. Voluptate laboris sint cupidatat ullamco
-      ut ea consectetur et est culpa et culpa duis.
+      <LocalizedMarkdown path="about-me.md" />
     </p>
 
     <div class="text-center fs-4 mb-0">
@@ -258,3 +250,4 @@ const portafolio = [
     }
   </style>
 </Layout>
+

src/pages/index.astro

@@ -3,6 +3,7 @@ import { getCollection, getEntry } from "astro:content";
 import { t, changeLanguage } from "i18next";
 import Layout from "../layouts/Layout.astro";
 import Card from "../components/Card.astro";
+import LocalizedMarkdown from "@components/LocalizedMarkdown.astro";
 import Button from "../components/Button/Button.astro";
 import { Image } from "astro:assets";
 import portrait from "../assets/images/portrait.jpg";
@@ -158,16 +159,7 @@ const portafolio = [
     <h2 class="text-center">Who am I?</h2>
 
     <p class="w-95 w-lg-70 mx-auto text-justify">
-      Lorem ipsum dolor sit amet, officia excepteur ex fugiat reprehenderit enim
-      labore culpa sint ad nisi Lorem pariatur mollit ex esse exercitation amet.
-      Nisi anim cupidatat excepteur officia. Reprehenderit nostrud nostrud ipsum
-      Lorem est aliquip amet voluptate voluptate dolor minim nulla est proident.
-      Nostrud officia pariatur ut officia. Sit irure elit esse ea nulla sunt ex
-      occaecat reprehenderit commodo officia dolor Lorem duis laboris cupidatat
-      officia voluptate. Culpa proident adipisicing id nulla nisi laboris ex in
-      Lorem sunt duis officia eiusmod. Aliqua reprehenderit commodo ex non
-      excepteur duis sunt velit enim. Voluptate laboris sint cupidatat ullamco
-      ut ea consectetur et est culpa et culpa duis.
+      <LocalizedMarkdown path="about-me.md" />
     </p>
 
     <div class="text-center fs-4 mb-0">
@@ -258,3 +250,4 @@ const portafolio = [
     }
   </style>
 </Layout>
+

tsconfig.json

@@ -8,7 +8,8 @@
     "paths": {
       "@components/*": ["src/components/*"],
       "@layouts/*": ["src/layouts/*"],
-      "@assets/*": ["src/assets/*"]
+      "@assets/*": ["src/assets/*"],
+      "@locales/*": ["public/locales/*"]
     },
     "plugins": [
       {