aboutsummaryrefslogtreecommitdiff
path: root/src/pages
diff options
context:
space:
mode:
authorAriel Costas Guerrero <ariel@costas.dev>2025-04-10 21:42:41 +0200
committerAriel Costas Guerrero <ariel@costas.dev>2025-04-10 21:42:41 +0200
commite3141794b95e534656427fadf0354435c62254d6 (patch)
tree95788249ac51475aea45ad17d7157dffd1564e47 /src/pages
parent3caee506c961ae0e78503164ed6a0f81db3c8c32 (diff)
Fix formatting
Diffstat (limited to 'src/pages')
-rw-r--r--src/pages/blog.xml.ts29
-rw-r--r--src/pages/blog/[id].astro85
-rw-r--r--src/pages/blog/index.astro116
-rw-r--r--src/pages/contact.astro138
-rw-r--r--src/pages/en/contact.astro2
-rw-r--r--src/pages/en/index.astro2
-rw-r--r--src/pages/en/portfolio.astro2
-rw-r--r--src/pages/en/trajectory.astro2
-rw-r--r--src/pages/index.astro2
-rw-r--r--src/pages/portfolio/[id].astro73
-rw-r--r--src/pages/portfolio/index.astro2
11 files changed, 247 insertions, 206 deletions
diff --git a/src/pages/blog.xml.ts b/src/pages/blog.xml.ts
index f165475..44233b3 100644
--- a/src/pages/blog.xml.ts
+++ b/src/pages/blog.xml.ts
@@ -1,19 +1,18 @@
-import rss from '@astrojs/rss';
-import { getCollection } from 'astro:content';
-
+import rss from "@astrojs/rss";
+import { getCollection } from "astro:content";
export async function GET(context: any) {
- const collection = await getCollection('blog');
+ const collection = await getCollection("blog");
- return rss({
- title: "Blog de Ariel Costas",
- description: "Artículos del blog de Ariel Costas",
- site: context.site,
- items: collection.map((post: any) => ({
- title: post.data.title,
- link: `${context.site}blog/${post.slug}`,
- description: post.data.metaDescription,
- pubDate: post.data.publishedAt
- }))
- })
+ return rss({
+ title: "Blog de Ariel Costas",
+ description: "Artículos del blog de Ariel Costas",
+ site: context.site,
+ items: collection.map((post: any) => ({
+ title: post.data.title,
+ link: `${context.site}blog/${post.slug}`,
+ description: post.data.metaDescription,
+ pubDate: post.data.publishedAt,
+ })),
+ });
}
diff --git a/src/pages/blog/[id].astro b/src/pages/blog/[id].astro
index e1b5250..65c8a25 100644
--- a/src/pages/blog/[id].astro
+++ b/src/pages/blog/[id].astro
@@ -4,59 +4,64 @@ import { getCollection, render } from "astro:content";
import { type GetStaticPaths } from "astro";
interface Props {
- entry: any;
+ entry: any;
}
-export const getStaticPaths: GetStaticPaths = (async () => {
- const entries = await getCollection("blog");
- return entries.map((entry: any) => ({
- params: { id: entry.id },
- props: { entry },
- }));
-});
+export const getStaticPaths: GetStaticPaths = async () => {
+ const entries = await getCollection("blog");
+ return entries.map((entry: any) => ({
+ params: { id: entry.id },
+ props: { entry },
+ }));
+};
const { entry } = Astro.props;
const { Content } = await render(entry);
const formattedDate = new Date(entry.data.publishedAt).toLocaleDateString(
- "es-ES",
- {
- year: "numeric",
- month: "long",
- day: "numeric",
- weekday: "long",
- },
+ "es-ES",
+ {
+ year: "numeric",
+ month: "long",
+ day: "numeric",
+ weekday: "long",
+ },
);
const schema = {
- "@context": "https://schema.org",
- "@type": "BlogPosting",
- headline: entry.data.title,
- datePublished: entry.data.publishedAt.toISOString(),
- author: {
- "@type": "Person",
- name: "Ariel Costas Guerrero",
- },
- publisher: {
- "@type": "Person",
- name: "Ariel Costas Guerrero",
- logo: {
- "@type": "ImageObject",
- url: "https://www.costas.dev/favicon.png",
- },
- },
+ "@context": "https://schema.org",
+ "@type": "BlogPosting",
+ headline: entry.data.title,
+ datePublished: entry.data.publishedAt.toISOString(),
+ author: {
+ "@type": "Person",
+ name: "Ariel Costas Guerrero",
+ },
+ publisher: {
+ "@type": "Person",
+ name: "Ariel Costas Guerrero",
+ logo: {
+ "@type": "ImageObject",
+ url: "https://www.costas.dev/favicon.png",
+ },
+ },
};
---
<Layout title={entry.data.title} description={entry.data.metaDescription}>
- <script is:inline type="application/ld+json" slot="head-jsonld" set:html={JSON.stringify(schema)}></script>
+ <script
+ is:inline
+ type="application/ld+json"
+ slot="head-jsonld"
+ set:html={JSON.stringify(schema)}
+ />
- <h1>{entry.data.title}</h1>
- <small>
- Publicado el
- <time datetime={entry.data.publishedAt.toISOString()}>
- {formattedDate}
- </time>
- </small>
+ <h1>{entry.data.title}</h1>
+ <small>
+ Publicado el
+ <time datetime={entry.data.publishedAt.toISOString()}>
+ {formattedDate}
+ </time>
+ </small>
- <Content />
+ <Content />
</Layout>
diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro
index e889706..68ad02e 100644
--- a/src/pages/blog/index.astro
+++ b/src/pages/blog/index.astro
@@ -1,69 +1,81 @@
---
import { getCollection } from "astro:content";
import Layout from "../../layouts/Layout.astro";
+
const blogCollection = (await getCollection("blog")).sort((a, b) => {
- return b.data.publishedAt.getTime() - a.data.publishedAt.getTime();
+ return b.data.publishedAt.getTime() - a.data.publishedAt.getTime();
});
+
const groupedPosts = blogCollection.reduce(
- (acc: Record<string, any[]>, post) => {
- const year = post.data.publishedAt.getFullYear();
- const month = post.data.publishedAt.getMonth() + 1;
- const key = `${year}-${month}`;
- if (!acc[key]) {
- acc[key] = [];
- }
- acc[key].push(post);
- return acc;
- },
- {},
+ (acc: Record<string, any[]>, post) => {
+ const year = post.data.publishedAt.getFullYear();
+ const month = post.data.publishedAt.getMonth() + 1;
+ const key = `${year}-${month}`;
+ if (!acc[key]) {
+ acc[key] = [];
+ }
+ acc[key].push(post);
+ return acc;
+ },
+ {},
);
+
function humaniseDate(date: Date) {
- const result = date.toLocaleDateString("es-ES", {
- month: "long",
- year: "numeric",
- });
- return result.charAt(0).toUpperCase() + result.slice(1);
+ const result = date.toLocaleDateString("es-ES", {
+ month: "long",
+ year: "numeric",
+ });
+ return result.charAt(0).toUpperCase() + result.slice(1);
}
+
const schema = {
- "@context": "https://schema.org",
- "@type": "Blog",
- "headline": "Blog de Ariel Costas",
- "description": "En este blog encontrarás artículos sobre desarrollo, tecnología y otras temáticas que pueda querer compartir. Disclaimer de siempre: las opiniones son mías, y no representan a ninguna empresa o institución.",
- "publisher": {
- "@type": "Person",
- "name": "Ariel Costas",
- },
- "author": {
- "@type": "Person",
- "name": "Ariel Costas",
- }
+ "@context": "https://schema.org",
+ "@type": "Blog",
+ headline: "Blog de Ariel Costas",
+ description:
+ "En este blog encontrarás artículos sobre desarrollo, tecnología y otras temáticas que pueda querer compartir. Disclaimer de siempre: las opiniones son mías, y no representan a ninguna empresa o institución.",
+ publisher: {
+ "@type": "Person",
+ name: "Ariel Costas",
+ },
+ author: {
+ "@type": "Person",
+ name: "Ariel Costas",
+ },
};
-
---
-<Layout title="Blog" description="Artículos sobre desarrollo, tecnología y otras temáticas que pueda querer compartir. Disclaimer de siempre: las opiniones son mías, y no representan a ninguna empresa o institución.">
- <script is:inline type="application/ld+json" slot="head-jsonld" set:html={JSON.stringify(schema)}></script>
+<Layout
+ title="Blog"
+ description="Artículos sobre desarrollo, tecnología y otras temáticas que pueda querer compartir. Disclaimer de siempre: las opiniones son mías, y no representan a ninguna empresa o institución."
+>
+ <script
+ is:inline
+ type="application/ld+json"
+ slot="head-jsonld"
+ set:html={JSON.stringify(schema)}
+ />
- <h1>Blog de Ariel Costas</h1>
+ <h1>Blog de Ariel Costas</h1>
- <p>
- En este blog encontrarás artículos sobre desarrollo, tecnología y otras
- temáticas que pueda querer compartir. Disclaimer de siempre: las
- opiniones son mías, y no representan a ninguna empresa o institución.
- </p>
+ <p>
+ En este blog encontrarás artículos sobre desarrollo, tecnología y otras
+ temáticas que pueda querer compartir. Disclaimer de siempre: las opiniones
+ son mías, y no representan a ninguna empresa o institución.
+ </p>
- {
- Object.entries(groupedPosts).map(([key, posts]) => (
- <section>
- <h2>{humaniseDate(new Date(key))}</h2>
- <ul>
- {posts.map((post) => (
- <li>
- <a href={`/blog/${post.id}`}>{post.data.title}</a>
- </li>
- ))}
- </ul>
- </section>
- ))
- }
+ {
+ Object.entries(groupedPosts).map(([key, posts]) => (
+ <section>
+ <h2>{humaniseDate(new Date(key))}</h2>
+ <ul>
+ {posts.map((post) => (
+ <li>
+ <a href={`/blog/${post.id}`}>{post.data.title}</a>
+ </li>
+ ))}
+ </ul>
+ </section>
+ ))
+ }
</Layout>
diff --git a/src/pages/contact.astro b/src/pages/contact.astro
index 3ca1b97..9cb58a6 100644
--- a/src/pages/contact.astro
+++ b/src/pages/contact.astro
@@ -2,84 +2,98 @@
import Layout from "../layouts/Layout.astro";
const schema = {
- "@context": "https://schema.org",
- "@type": "ContactPage",
- url: "https://www.costas.dev/contact",
- headline: "Ponte en contacto conmigo",
+ "@context": "https://schema.org",
+ "@type": "ContactPage",
+ url: "https://www.costas.dev/contact",
+ headline: "Ponte en contacto conmigo",
};
---
-<Layout title="Contacto" description="Las formas de ponerte en contacto conmigo, ya sea por correo electrónico, teléfono o redes sociales.">
- <script
- is:inline
- type="application/ld+json"
- slot="head-jsonld"
- set:html={JSON.stringify(schema)}
- />
+<Layout
+ title="Contacto"
+ description="Las formas de ponerte en contacto conmigo, ya sea por correo electrónico, teléfono o redes sociales."
+>
+ <script
+ is:inline
+ type="application/ld+json"
+ slot="head-jsonld"
+ set:html={JSON.stringify(schema)}
+ />
- <h1>Contacta conmigo</h1>
+ <h1>Contacta conmigo</h1>
- <p>
- La forma más sencilla de contactar conmigo es a través de mi dirección
- de correo electrónico:
- <a href="#" id="email-addr">ACTIVA JAVASCRIPT PARA VER ESTO</a>. También
- puedes usar <a href="https://wa.me/message/W7T7L4EZAELQI1">WhatsApp</a> con el número de teléfono
- <a href="#" id="phone-number">ACTIVA JAVASCRIPT PARA VER ESTO</a>.
- </p>
+ <p>
+ La forma más sencilla de contactar conmigo es a través de mi dirección de
+ correo electrónico:
+ <a href="#" id="email-addr">ACTIVA JAVASCRIPT PARA VER ESTO</a>. También
+ puedes usar <a href="https://wa.me/message/W7T7L4EZAELQI1">WhatsApp</a> con el
+ número de teléfono
+ <a href="#" id="phone-number">ACTIVA JAVASCRIPT PARA VER ESTO</a>.
+ </p>
- <p>También puedes encontrarme en algunas redes sociales:</p>
+ <p>También puedes encontrarme en algunas redes sociales:</p>
- <dl>
- <dt>GitHub</dt>
- <dd><a href="https://github.com/arielcostas">@arielcostas</a></dd>
- <dt>LinkedIn</dt>
- <dd><a href="https://www.linkedin.com/in/ariel-costas/">/in/ariel-costas</a></dd>
- <dt>BlueSky</dt>
- <dd><a href="https://bsky.app/profile/costas.dev">@costas.dev</a></dd>
- </dl>
+ <dl>
+ <dt>GitHub</dt>
+ <dd><a href="https://github.com/arielcostas">@arielcostas</a></dd>
+ <dt>LinkedIn</dt>
+ <dd>
+ <a href="https://www.linkedin.com/in/ariel-costas/">/in/ariel-costas</a>
+ </dd>
+ <dt>BlueSky</dt>
+ <dd><a href="https://bsky.app/profile/costas.dev">@costas.dev</a></dd>
+ </dl>
</Layout>
<script>
- const encryptedEmail = "LygNLiMmFRo/GlQZaFIWBA==";
- const encryptedPhoneNumber = "ZWlQfX1QT0Z+XgVd";
- const key = "NZdKOfvuLn5jF6sryF0Q";
+ const encryptedEmail = "LygNLiMmFRo/GlQZaFIWBA==";
+ const encryptedPhoneNumber = "ZWlQfX1QT0Z+XgVd";
+ const key = "NZdKOfvuLn5jF6sryF0Q";
- const emailAddrLink = document.getElementById("email-addr") as HTMLAnchorElement;
- const phoneNumberLink = document.getElementById("phone-number") as HTMLAnchorElement;
+ const emailAddrLink = document.getElementById(
+ "email-addr",
+ ) as HTMLAnchorElement;
+ const phoneNumberLink = document.getElementById(
+ "phone-number",
+ ) as HTMLAnchorElement;
- (() => {
- if (emailAddrLink == null || phoneNumberLink == null) {
- return;
- }
+ (() => {
+ if (emailAddrLink == null || phoneNumberLink == null) {
+ return;
+ }
- const emailAddress = xorData(encryptedEmail, key);
- const phoneNumber = xorData(encryptedPhoneNumber, key);
+ const emailAddress = xorData(encryptedEmail, key);
+ const phoneNumber = xorData(encryptedPhoneNumber, key);
- emailAddrLink.href = `mailto:${emailAddress}`;
- emailAddrLink.textContent = emailAddress;
+ emailAddrLink.href = `mailto:${emailAddress}`;
+ emailAddrLink.textContent = emailAddress;
- phoneNumberLink.href = `tel:${phoneNumber}`;
- phoneNumberLink.textContent = phoneNumber;
- })();
+ phoneNumberLink.href = `tel:${phoneNumber}`;
+ phoneNumberLink.textContent = phoneNumber;
+ })();
- function xorData(data: string, key: string): string {
- let actualData = atob(data);
- let actualKey = key;
- const keyLength = key.length;
- const dataLength = actualData.length;
- const result = new Array(dataLength);
-
- // If the key is 12 characters but the data is 30 characters, the key should be repeated 3 times and truncated to 30 characters
- if (keyLength < dataLength) {
- actualKey = key.repeat(Math.ceil(dataLength / keyLength)).substring(0, dataLength);
- } else if (keyLength > dataLength) {
- actualKey = key.substring(0, dataLength);
- }
+ function xorData(data: string, key: string): string {
+ let actualData = atob(data);
+ let actualKey = key;
+ const keyLength = key.length;
+ const dataLength = actualData.length;
+ const result = new Array(dataLength);
- for (let i = 0; i < dataLength; i++) {
- result[i] = String.fromCharCode(actualData.charCodeAt(i) ^ actualKey.charCodeAt(i));
- }
+ // If the key is 12 characters but the data is 30 characters, the key should be repeated 3 times and truncated to 30 characters
+ if (keyLength < dataLength) {
+ actualKey = key
+ .repeat(Math.ceil(dataLength / keyLength))
+ .substring(0, dataLength);
+ } else if (keyLength > dataLength) {
+ actualKey = key.substring(0, dataLength);
+ }
- return result.join("");
- }
+ for (let i = 0; i < dataLength; i++) {
+ result[i] = String.fromCharCode(
+ actualData.charCodeAt(i) ^ actualKey.charCodeAt(i),
+ );
+ }
+
+ return result.join("");
+ }
</script>
diff --git a/src/pages/en/contact.astro b/src/pages/en/contact.astro
index ef69d6e..6ccb15c 100644
--- a/src/pages/en/contact.astro
+++ b/src/pages/en/contact.astro
@@ -2,4 +2,4 @@
import ContactPageLayout from "../../layouts/ContactPageLayout.astro";
---
-<ContactPageLayout /> \ No newline at end of file
+<ContactPageLayout />
diff --git a/src/pages/en/index.astro b/src/pages/en/index.astro
index 8c5945a..a7c9dbf 100644
--- a/src/pages/en/index.astro
+++ b/src/pages/en/index.astro
@@ -2,4 +2,4 @@
import HomePageLayout from "../../layouts/HomePageLayout.astro";
---
-<HomePageLayout /> \ No newline at end of file
+<HomePageLayout />
diff --git a/src/pages/en/portfolio.astro b/src/pages/en/portfolio.astro
index 63840f5..17c4637 100644
--- a/src/pages/en/portfolio.astro
+++ b/src/pages/en/portfolio.astro
@@ -2,4 +2,4 @@
import PortfolioPageLayout from "../../layouts/PortfolioPageLayout.astro";
---
-<PortfolioPageLayout /> \ No newline at end of file
+<PortfolioPageLayout />
diff --git a/src/pages/en/trajectory.astro b/src/pages/en/trajectory.astro
index 3f5ff77..cb5b088 100644
--- a/src/pages/en/trajectory.astro
+++ b/src/pages/en/trajectory.astro
@@ -2,4 +2,4 @@
import TrajectoryPageLayout from "../../layouts/TrajectoryPageLayout.astro";
---
-<TrajectoryPageLayout /> \ No newline at end of file
+<TrajectoryPageLayout />
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 8ac64a6..2dd3973 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -2,4 +2,4 @@
import HomePageLayout from "../layouts/HomePageLayout.astro";
---
-<HomePageLayout /> \ No newline at end of file
+<HomePageLayout />
diff --git a/src/pages/portfolio/[id].astro b/src/pages/portfolio/[id].astro
index 55bac3f..b92ecbd 100644
--- a/src/pages/portfolio/[id].astro
+++ b/src/pages/portfolio/[id].astro
@@ -5,51 +5,62 @@ import { type GetStaticPaths } from "astro";
import TechnologyBadge from "../../partials/TechnologyBadge.astro";
interface Props {
- entry: any;
+ entry: any;
}
-export const getStaticPaths: GetStaticPaths = (async () => {
- const entries = await getCollection("portfolio");
- return entries.map((entry: any) => ({
- params: { id: entry.id },
- props: { entry },
- }));
-});
+export const getStaticPaths: GetStaticPaths = async () => {
+ const entries = await getCollection("portfolio");
+ return entries.map((entry: any) => ({
+ params: { id: entry.id },
+ props: { entry },
+ }));
+};
const { entry } = Astro.props;
const { Content } = await render(entry);
---
<Layout title={entry.data.title} description={entry.data.description}>
- <a id="link-back" href="/portfolio">
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="w-6 h-6 inline-block mr-2">
- <polyline points="15 18 9 12 15 6"></polyline>
- </svg>
- Volver al portfolio
- </a>
+ <a id="link-back" href="/portfolio">
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ viewBox="0 0 24 24"
+ fill="none"
+ stroke="currentColor"
+ stroke-width="2"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ class="w-6 h-6 inline-block mr-2"
+ >
+ <polyline points="15 18 9 12 15 6"></polyline>
+ </svg>
+ Volver al portfolio
+ </a>
- <h1>{entry.data.title}</h1>
+ <h1>{entry.data.title}</h1>
- <Content />
+ <Content />
- <h2>Tecnologías utilizadas</h2>
+ <h2>Tecnologías utilizadas</h2>
- {entry.data.technologies.map((technology: string) => (
- <TechnologyBadge size="small" code={technology} />
- ))}
+ {
+ entry.data.technologies.map((technology: string) => (
+ <TechnologyBadge size="small" code={technology} />
+ ))
+ }
</Layout>
<style>
- a#link-back {
- display: inline-flex;
- align-items: center;
- gap: 0.5rem;
- text-decoration: none;
- text-transform: uppercase;
- transition: color 0.2s ease-in-out;
- }
+ a#link-back {
+ display: inline-flex;
+ align-items: center;
+ gap: 0.5rem;
+ text-decoration: none;
+ text-transform: uppercase;
+ transition: color 0.2s ease-in-out;
+ }
- a#link-back svg {
- height: 1em;
- }
+ a#link-back svg {
+ height: 1em;
+ }
</style>
diff --git a/src/pages/portfolio/index.astro b/src/pages/portfolio/index.astro
index 63840f5..17c4637 100644
--- a/src/pages/portfolio/index.astro
+++ b/src/pages/portfolio/index.astro
@@ -2,4 +2,4 @@
import PortfolioPageLayout from "../../layouts/PortfolioPageLayout.astro";
---
-<PortfolioPageLayout /> \ No newline at end of file
+<PortfolioPageLayout />