diff --git a/src/pages/events/[...page].astro b/src/pages/events/[...page].astro
new file mode 100644
index 0000000..5d834aa
--- /dev/null
+++ b/src/pages/events/[...page].astro
@@ -0,0 +1,32 @@
+---
+import type { GetStaticPaths } from "astro";
+import { getCollection } from "astro:content";
+import Main from "@/layouts/Main.astro";
+import Layout from "@/layouts/Layout.astro";
+import Header from "@/components/Header.astro";
+import Footer from "@/components/Footer.astro";
+import Card from "@/components/Card.astro";
+import Pagination from "@/components/Pagination.astro";
+import getSortedPosts from "@/utils/getSortedPosts";
+import { SITE } from "@/config";
+
+export const getStaticPaths = (async ({ paginate }) => {
+  const events = await getCollection("events", ({ data }) => !data.draft);
+  return paginate(getSortedPosts(events), { pageSize: SITE.postPerPage });
+}) satisfies GetStaticPaths;
+
+const { page } = Astro.props;
+---
+
+<Layout title={`Events | ${SITE.title}`}>
+  <Header />
+  <Main pageTitle="Events" pageDesc="All upcoming and past events organized by HEC IA.">
+    <ul>
+      {page.data.map(data => <Card {...data} />)}
+    </ul>
+  </Main>
+
+  <Pagination {page} />
+
+  <Footer noMarginTop={page.lastPage > 1} />
+</Layout>
diff --git a/src/pages/events/[...slug]/index.astro b/src/pages/events/[...slug]/index.astro
new file mode 100644
index 0000000..d8241ba
--- /dev/null
+++ b/src/pages/events/[...slug]/index.astro
@@ -0,0 +1,27 @@
+---
+import { type CollectionEntry, getCollection } from "astro:content";
+import PostDetails from "@/layouts/PostDetails.astro";
+import getSortedPosts from "@/utils/getSortedPosts";
+import { getPath } from "@/utils/getPath";
+
+type Props = {
+  post: CollectionEntry<"events">;
+};
+
+export async function getStaticPaths() {
+  const posts = await getCollection("events", ({ data }) => !data.draft);
+  const postResult = posts.map(post => ({
+    params: { slug: getPath(post.id, post.filePath, false) },
+    props: { post },
+  }));
+
+  return postResult;
+}
+
+const { post } = Astro.props;
+
+const posts = await getCollection("events");
+const sortedPosts = getSortedPosts(posts);
+---
+
+<PostDetails post={post} posts={sortedPosts} />
diff --git a/src/pages/news/[...page].astro b/src/pages/news/[...page].astro
new file mode 100644
index 0000000..04eff56
--- /dev/null
+++ b/src/pages/news/[...page].astro
@@ -0,0 +1,32 @@
+---
+import type { GetStaticPaths } from "astro";
+import { getCollection } from "astro:content";
+import Main from "@/layouts/Main.astro";
+import Layout from "@/layouts/Layout.astro";
+import Header from "@/components/Header.astro";
+import Footer from "@/components/Footer.astro";
+import Card from "@/components/Card.astro";
+import Pagination from "@/components/Pagination.astro";
+import getSortedPosts from "@/utils/getSortedPosts";
+import { SITE } from "@/config";
+
+export const getStaticPaths = (async ({ paginate }) => {
+  const news = await getCollection("news", ({ data }) => !data.draft);
+  return paginate(getSortedPosts(news), { pageSize: SITE.postPerPage });
+}) satisfies GetStaticPaths;
+
+const { page } = Astro.props;
+---
+
+<Layout title={`News | ${SITE.title}`}>
+  <Header />
+  <Main pageTitle="News" pageDesc="Latest news and updates from HEC IA.">
+    <ul>
+      {page.data.map(data => <Card {...data} />)}
+    </ul>
+  </Main>
+
+  <Pagination {page} />
+
+  <Footer noMarginTop={page.lastPage > 1} />
+</Layout>
diff --git a/src/pages/news/[...slug]/index.astro b/src/pages/news/[...slug]/index.astro
new file mode 100644
index 0000000..79d36f1
--- /dev/null
+++ b/src/pages/news/[...slug]/index.astro
@@ -0,0 +1,27 @@
+---
+import { type CollectionEntry, getCollection } from "astro:content";
+import PostDetails from "@/layouts/PostDetails.astro";
+import getSortedPosts from "@/utils/getSortedPosts";
+import { getPath } from "@/utils/getPath";
+
+type Props = {
+  post: CollectionEntry<"news">;
+};
+
+export async function getStaticPaths() {
+  const posts = await getCollection("news", ({ data }) => !data.draft);
+  const postResult = posts.map(post => ({
+    params: { slug: getPath(post.id, post.filePath, false) },
+    props: { post },
+  }));
+
+  return postResult;
+}
+
+const { post } = Astro.props;
+
+const posts = await getCollection("news");
+const sortedPosts = getSortedPosts(posts);
+---
+
+<PostDetails post={post} posts={sortedPosts} />
diff --git a/src/pages/technical/[...page].astro b/src/pages/technical/[...page].astro
new file mode 100644
index 0000000..86186c4
--- /dev/null
+++ b/src/pages/technical/[...page].astro
@@ -0,0 +1,32 @@
+---
+import type { GetStaticPaths } from "astro";
+import { getCollection } from "astro:content";
+import Main from "@/layouts/Main.astro";
+import Layout from "@/layouts/Layout.astro";
+import Header from "@/components/Header.astro";
+import Footer from "@/components/Footer.astro";
+import Card from "@/components/Card.astro";
+import Pagination from "@/components/Pagination.astro";
+import getSortedPosts from "@/utils/getSortedPosts";
+import { SITE } from "@/config";
+
+export const getStaticPaths = (async ({ paginate }) => {
+  const technical = await getCollection("technical", ({ data }) => !data.draft);
+  return paginate(getSortedPosts(technical), { pageSize: SITE.postPerPage });
+}) satisfies GetStaticPaths;
+
+const { page } = Astro.props;
+---
+
+<Layout title={`Technical Deep Dives | ${SITE.title}`}>
+  <Header />
+  <Main pageTitle="Technical Deep Dives" pageDesc="In-depth technical articles on AI and machine learning.">
+    <ul>
+      {page.data.map(data => <Card {...data} />)}
+    </ul>
+  </Main>
+
+  <Pagination {page} />
+
+  <Footer noMarginTop={page.lastPage > 1} />
+</Layout>
diff --git a/src/pages/technical/[...slug]/index.astro b/src/pages/technical/[...slug]/index.astro
new file mode 100644
index 0000000..15800c4
--- /dev/null
+++ b/src/pages/technical/[...slug]/index.astro
@@ -0,0 +1,27 @@
+---
+import { type CollectionEntry, getCollection } from "astro:content";
+import PostDetails from "@/layouts/PostDetails.astro";
+import getSortedPosts from "@/utils/getSortedPosts";
+import { getPath } from "@/utils/getPath";
+
+type Props = {
+  post: CollectionEntry<"technical">;
+};
+
+export async function getStaticPaths() {
+  const posts = await getCollection("technical", ({ data }) => !data.draft);
+  const postResult = posts.map(post => ({
+    params: { slug: getPath(post.id, post.filePath, false) },
+    props: { post },
+  }));
+
+  return postResult;
+}
+
+const { post } = Astro.props;
+
+const posts = await getCollection("technical");
+const sortedPosts = getSortedPosts(posts);
+---
+
+<PostDetails post={post} posts={sortedPosts} />
diff --git a/src/pages/workshops/[...page].astro b/src/pages/workshops/[...page].astro
new file mode 100644
index 0000000..669c4f1
--- /dev/null
+++ b/src/pages/workshops/[...page].astro
@@ -0,0 +1,32 @@
+---
+import type { GetStaticPaths } from "astro";
+import { getCollection } from "astro:content";
+import Main from "@/layouts/Main.astro";
+import Layout from "@/layouts/Layout.astro";
+import Header from "@/components/Header.astro";
+import Footer from "@/components/Footer.astro";
+import Card from "@/components/Card.astro";
+import Pagination from "@/components/Pagination.astro";
+import getSortedPosts from "@/utils/getSortedPosts";
+import { SITE } from "@/config";
+
+export const getStaticPaths = (async ({ paginate }) => {
+  const workshops = await getCollection("workshops", ({ data }) => !data.draft);
+  return paginate(getSortedPosts(workshops), { pageSize: SITE.postPerPage });
+}) satisfies GetStaticPaths;
+
+const { page } = Astro.props;
+---
+
+<Layout title={`Workshops | ${SITE.title}`}>
+  <Header />
+  <Main pageTitle="Workshops" pageDesc="Hands-on technical workshops on AI topics.">
+    <ul>
+      {page.data.map(data => <Card {...data} />)}
+    </ul>
+  </Main>
+
+  <Pagination {page} />
+
+  <Footer noMarginTop={page.lastPage > 1} />
+</Layout>
diff --git a/src/pages/workshops/[...slug]/index.astro b/src/pages/workshops/[...slug]/index.astro
new file mode 100644
index 0000000..1f8bd43
--- /dev/null
+++ b/src/pages/workshops/[...slug]/index.astro
@@ -0,0 +1,27 @@
+---
+import { type CollectionEntry, getCollection } from "astro:content";
+import PostDetails from "@/layouts/PostDetails.astro";
+import getSortedPosts from "@/utils/getSortedPosts";
+import { getPath } from "@/utils/getPath";
+
+type Props = {
+  post: CollectionEntry<"workshops">;
+};
+
+export async function getStaticPaths() {
+  const posts = await getCollection("workshops", ({ data }) => !data.draft);
+  const postResult = posts.map(post => ({
+    params: { slug: getPath(post.id, post.filePath, false) },
+    props: { post },
+  }));
+
+  return postResult;
+}
+
+const { post } = Astro.props;
+
+const posts = await getCollection("workshops");
+const sortedPosts = getSortedPosts(posts);
+---
+
+<PostDetails post={post} posts={sortedPosts} />