diff --git a/Frontend/bun.lockb b/Frontend/bun.lockb
index a93198a..bacd45c 100644
Binary files a/Frontend/bun.lockb and b/Frontend/bun.lockb differ
diff --git a/Frontend/package.json b/Frontend/package.json
index 744bbdb..fa92606 100644
--- a/Frontend/package.json
+++ b/Frontend/package.json
@@ -23,6 +23,7 @@
"next-plausible": "^3.12.0",
"next-themes": "^0.3.0",
"react": "^18",
+ "react-countup": "^6.5.3",
"react-dom": "^18",
"react-hook-form": "^7.51.3",
"restfulmc-lib": "^1.1.2",
diff --git a/Frontend/src/app/(pages)/page.tsx b/Frontend/src/app/(pages)/page.tsx
index 72a2237..10f2e0c 100644
--- a/Frontend/src/app/(pages)/page.tsx
+++ b/Frontend/src/app/(pages)/page.tsx
@@ -1,5 +1,6 @@
import FeaturedContent from "@/components/landing/featured-content";
import Hero from "@/components/landing/hero";
+import StatisticCounters from "@/components/landing/statistic-counters";
/**
* The landing page.
@@ -10,6 +11,7 @@ const LandingPage = (): JSX.Element => (
+
);
export default LandingPage;
diff --git a/Frontend/src/app/components/counter.tsx b/Frontend/src/app/components/counter.tsx
new file mode 100644
index 0000000..8ef4d7a
--- /dev/null
+++ b/Frontend/src/app/components/counter.tsx
@@ -0,0 +1,49 @@
+"use client";
+
+import { minecrafter } from "@/font/fonts";
+import { cn } from "@/lib/utils";
+import CountUp from "react-countup";
+
+/**
+ * Props for the counter.
+ */
+type CounterProps = {
+ /**
+ * The name of the counter.
+ */
+ name: string;
+
+ /**
+ * The amount to count up to.
+ */
+ amount: number;
+
+ /**
+ * The optional duration of the count up.
+ *
+ * Uses the default duration if not provided.
+ *
+ */
+ duration?: number | undefined;
+};
+
+/**
+ * A counter component.
+ *
+ * @param amount the amount to count up to
+ * @param duration the optional duration of the count up
+ * @returns the counter jsx
+ */
+const Counter = ({ name, amount, duration }: CounterProps): JSX.Element => (
+
+
+ {name}
+
+
+
+
+
+);
+export default Counter;
diff --git a/Frontend/src/app/components/footer.tsx b/Frontend/src/app/components/footer.tsx
new file mode 100644
index 0000000..58fc364
--- /dev/null
+++ b/Frontend/src/app/components/footer.tsx
@@ -0,0 +1,2 @@
+const Footer = (): JSX.Element => ;
+export default Footer;
diff --git a/Frontend/src/app/components/landing/featured-content.tsx b/Frontend/src/app/components/landing/featured-content.tsx
index 2e2aba7..bb8c5ae 100644
--- a/Frontend/src/app/components/landing/featured-content.tsx
+++ b/Frontend/src/app/components/landing/featured-content.tsx
@@ -10,7 +10,7 @@ import Link from "next/link";
* @returns the featured content jsx
*/
const FeaturedContent = (): JSX.Element => (
-
+
{config.featuredItems.map((item, index) => (
diff --git a/Frontend/src/app/components/landing/hero.tsx b/Frontend/src/app/components/landing/hero.tsx
index 3e56346..47bcb35 100644
--- a/Frontend/src/app/components/landing/hero.tsx
+++ b/Frontend/src/app/components/landing/hero.tsx
@@ -10,11 +10,11 @@ import Link from "next/link";
* @returns the hero jsx
*/
const Hero = (): JSX.Element => (
-
+
{/* Title */}
{config.siteName}
diff --git a/Frontend/src/app/components/landing/statistic-counters.tsx b/Frontend/src/app/components/landing/statistic-counters.tsx
new file mode 100644
index 0000000..e2b3668
--- /dev/null
+++ b/Frontend/src/app/components/landing/statistic-counters.tsx
@@ -0,0 +1,18 @@
+import Counter from "@/components/counter";
+
+/**
+ * The statistic counters component.
+ *
+ * @returns the counters jsx
+ */
+const StatisticCounters = (): JSX.Element => (
+
+);
+export default StatisticCounters;
diff --git a/Frontend/src/app/components/player/player-search.tsx b/Frontend/src/app/components/player/player-search.tsx
index 764e3c3..46e48ea 100644
--- a/Frontend/src/app/components/player/player-search.tsx
+++ b/Frontend/src/app/components/player/player-search.tsx
@@ -25,7 +25,7 @@ const PlayerSearch = ({
action={handleRedirect}
>
-
+
{children}
+