perf!: monorepo setup + fully static + webp images

BREAKING CHANGE: minimum supported Node.js >= 22.0.0 and pnpm >= 9.5.0

apps/website/app/[locale]/[...rest]/page.tsx

@@ -0,0 +1,7 @@
+import { notFound } from "next/navigation"
+
+const CatchAllPage: React.FC = () => {
+  return notFound()
+}
+
+export default CatchAllPage

apps/website/app/[locale]/blog/[slug]/page.tsx

@@ -0,0 +1,58 @@
+import type { Metadata } from "next"
+import { notFound } from "next/navigation"
+
+import { getBlogPostBySlug, getBlogPosts } from "@repo/blog"
+import { BlogPostUI } from "@repo/blog/BlogPostUI"
+
+interface BlogPostPageProps {
+  params: {
+    slug: string
+  }
+}
+
+export const generateMetadata = async (
+  props: BlogPostPageProps,
+): Promise<Metadata> => {
+  const blogPost = await getBlogPostBySlug(props.params.slug)
+  if (blogPost == null) {
+    return notFound()
+  }
+  const title = `${blogPost.frontmatter.title} | Théo LUDWIG`
+  const description = blogPost.frontmatter.description
+  return {
+    title,
+    description,
+    openGraph: {
+      title,
+      description,
+    },
+    twitter: {
+      title,
+      description,
+    },
+  }
+}
+
+export const generateStaticParams = async (): Promise<
+  Array<{ slug: string }>
+> => {
+  const posts = await getBlogPosts()
+  return posts.map((post) => {
+    return {
+      slug: post.slug,
+    }
+  })
+}
+
+const BlogPostPage: React.FC<BlogPostPageProps> = async (props) => {
+  const { params } = props
+
+  const blogPost = await getBlogPostBySlug(params.slug)
+  if (blogPost == null) {
+    return notFound()
+  }
+
+  return <BlogPostUI blogPost={blogPost} />
+}
+
+export default BlogPostPage

apps/website/app/[locale]/blog/page.tsx

@@ -0,0 +1,55 @@
+import { getBlogPosts } from "@repo/blog"
+import { BlogPosts } from "@repo/blog/BlogPosts"
+import { LOCALE_DEFAULT, type LocaleProps } from "@repo/i18n/config"
+import {
+  Section,
+  SectionDescription,
+  SectionTitle,
+} from "@repo/ui/design/Section"
+import { MainLayout } from "@repo/ui/MainLayout"
+import type { Metadata } from "next"
+import { unstable_setRequestLocale } from "next-intl/server"
+
+const title = "Blog | Théo LUDWIG"
+const description =
+  "The latest news about my journey of learning computer science."
+
+export const generateMetadata = async (): Promise<Metadata> => {
+  return {
+    title,
+    description,
+    openGraph: {
+      title,
+      description,
+      locale: LOCALE_DEFAULT,
+    },
+    twitter: {
+      title,
+      description,
+    },
+  }
+}
+
+interface BlogPageProps extends LocaleProps {}
+
+const BlogPage: React.FC<BlogPageProps> = async (props) => {
+  const { params } = props
+
+  // Enable static rendering
+  unstable_setRequestLocale(params.locale)
+
+  const posts = await getBlogPosts()
+
+  return (
+    <MainLayout>
+      <Section verticalSpacing horizontalSpacing>
+        <SectionTitle>Blog</SectionTitle>
+        <SectionDescription>{description}</SectionDescription>
+
+        <BlogPosts posts={posts} />
+      </Section>
+    </MainLayout>
+  )
+}
+
+export default BlogPage

apps/website/app/[locale]/error.tsx

@@ -0,0 +1,10 @@
+"use client"
+
+import type { ErrorServerProps } from "@repo/ui/Errors/ErrorServer"
+import { ErrorServer } from "@repo/ui/Errors/ErrorServer"
+
+const ErrorBoundaryPage: React.FC<ErrorServerProps> = (props) => {
+  return <ErrorServer {...props} />
+}
+
+export default ErrorBoundaryPage

apps/website/app/[locale]/layout.tsx

@@ -0,0 +1,91 @@
+import "@repo/config-tailwind/styles.css"
+import type { Locale, LocaleProps } from "@repo/i18n/config"
+import { LOCALES } from "@repo/i18n/config"
+import { Footer } from "@repo/ui/Footer"
+import { Header } from "@repo/ui/Header"
+import { ThemeProvider } from "@repo/ui/Header/SwitchTheme"
+import { VERSION } from "@repo/utils/constants"
+import type { Metadata } from "next"
+import { NextIntlClientProvider } from "next-intl"
+import {
+  getMessages,
+  getTranslations,
+  unstable_setRequestLocale,
+} from "next-intl/server"
+
+export const generateMetadata = async ({
+  params,
+}: LocaleProps): Promise<Metadata> => {
+  const t = await getTranslations({ locale: params.locale })
+  const title = t("meta.title")
+  const description = `${title} - ${t("meta.description")}`
+  const image = "/images/logo.webp"
+  const url = new URL("https://theoludwig.fr")
+  const locale = LOCALES.join(", ")
+
+  return {
+    title,
+    description,
+    metadataBase: url,
+    openGraph: {
+      title,
+      description,
+      url,
+      siteName: title,
+      images: [
+        {
+          url: image,
+          width: 96,
+          height: 96,
+        },
+      ],
+      locale,
+      type: "website",
+    },
+    twitter: {
+      card: "summary",
+      title,
+      description,
+      images: [image],
+    },
+  }
+}
+
+export const generateStaticParams = (): Array<{ locale: Locale }> => {
+  return LOCALES.map((locale) => {
+    return {
+      locale,
+    }
+  })
+}
+
+interface LocaleLayoutProps extends React.PropsWithChildren {
+  params: {
+    locale: Locale
+  }
+}
+
+const LocaleLayout: React.FC<LocaleLayoutProps> = async (props) => {
+  const { children, params } = props
+
+  // Enable static rendering
+  unstable_setRequestLocale(params.locale)
+
+  const messages = await getMessages()
+
+  return (
+    <html lang={params.locale} suppressHydrationWarning>
+      <body>
+        <ThemeProvider>
+          <NextIntlClientProvider messages={messages}>
+            <Header />
+            {children}
+            <Footer version={VERSION} />
+          </NextIntlClientProvider>
+        </ThemeProvider>
+      </body>
+    </html>
+  )
+}
+
+export default LocaleLayout

apps/website/app/[locale]/loading.tsx

@@ -0,0 +1,12 @@
+import { MainLayout } from "@repo/ui/MainLayout"
+import { Spinner } from "@repo/ui/design/Spinner"
+
+const Loading: React.FC = () => {
+  return (
+    <MainLayout center>
+      <Spinner size={50} />
+    </MainLayout>
+  )
+}
+
+export default Loading

apps/website/app/[locale]/not-found.tsx

@@ -0,0 +1,10 @@
+import { ErrorNotFound } from "@repo/ui/Errors/ErrorNotFound"
+
+/**
+ * Note that `app/[locale]/[...rest]/page.tsx` is necessary for this page to render.
+ */
+const NotFound: React.FC = () => {
+  return <ErrorNotFound />
+}
+
+export default NotFound

apps/website/app/[locale]/page.tsx

@@ -0,0 +1,42 @@
+import type { LocaleProps } from "@repo/i18n/config"
+import { About } from "@repo/ui/About"
+import { RevealFade } from "@repo/ui/design/Section"
+import { Interests } from "@repo/ui/Interests"
+import { MainLayout } from "@repo/ui/MainLayout"
+import { OpenSource } from "@repo/ui/OpenSource"
+import { Portfolio } from "@repo/ui/Portfolio"
+import { Skills } from "@repo/ui/Skills"
+import { unstable_setRequestLocale } from "next-intl/server"
+
+interface HomePageProps extends LocaleProps {}
+
+const HomePage: React.FC<HomePageProps> = (props) => {
+  const { params } = props
+
+  // Enable static rendering
+  unstable_setRequestLocale(params.locale)
+
+  return (
+    <MainLayout>
+      <About />
+
+      <RevealFade>
+        <Interests />
+      </RevealFade>
+
+      <RevealFade>
+        <Skills />
+      </RevealFade>
+
+      <RevealFade>
+        <Portfolio />
+      </RevealFade>
+
+      <RevealFade>
+        <OpenSource />
+      </RevealFade>
+    </MainLayout>
+  )
+}
+
+export default HomePage