feat: implement internationalization and routing for locale-based pages

- Added RootLayout component to handle locale and message loading.
- Created Home page with header, about info, products, and story sections.
- Developed ProductPage for displaying product categories and products.
- Implemented ProductsPage to list product categories with banners.
- Added Projects page with a grid layout for project display.
- Configured server settings for port and host.
- Established navigation and routing for internationalization.
- Set up request handling for locale and message retrieval.
- Defined routing structure for supported locales.
- Created middleware for locale-based routing.
- Defined layout parameters for locale handling.

src/app/[locale]/about-us/page.tsx

@@ -0,0 +1,30 @@
+import images from '@/assets/images/images';
+import InnerPageBanner from '@/components/layout/innerPages/banner';
+import AboutTopInfo from '@/components/pages/about/TopInfo';
+import { ILayoutLocaleParams } from '@/models/layout';
+import { useTranslations } from 'next-intl';
+import { setRequestLocale } from 'next-intl/server';
+import { getTranslations } from 'next-intl/server';
+
+export default async function AboutUs({
+  params,
+}: Readonly<{
+  params: ILayoutLocaleParams;
+}>) {
+  const { locale } = await params;
+
+  // Enable static rendering
+  setRequestLocale(locale);
+
+  const t = await getTranslations({ locale });
+
+  return (
+    <main className="flex flex-col items-center justify-between">
+      <InnerPageBanner
+        title={t('pages_about_title')}
+        imageSrc={images.aboutBanner.src}
+      />
+      <AboutTopInfo />
+    </main>
+  );
+}