diff --git a/package-lock.json b/package-lock.json
index 18d0d747..19e1b664 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,7 +12,8 @@
         "packages/*"
       ],
       "dependencies": {
-        "@edx/openedx-atlas": "^0.7.0"
+        "@edx/openedx-atlas": "^0.7.0",
+        "react-helmet": "^6.1.0"
       },
       "devDependencies": {
         "@edx/browserslist-config": "^1.5.0",
@@ -14579,7 +14580,6 @@
       "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
       "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "js-tokens": "^3.0.0 || ^4.0.0"
       },
@@ -15261,7 +15261,6 @@
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
       "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -16978,7 +16977,6 @@
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
       "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "loose-envify": "^1.4.0",
         "object-assign": "^4.1.1",
@@ -17010,8 +17008,7 @@
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
       "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/proxy-addr": {
       "version": "2.0.7",
@@ -17680,8 +17677,7 @@
       "version": "3.2.2",
       "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.2.tgz",
       "integrity": "sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/react-focus-lock": {
       "version": "2.13.7",
@@ -17734,6 +17730,21 @@
         }
       }
     },
+    "node_modules/react-helmet": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/react-helmet/-/react-helmet-6.1.0.tgz",
+      "integrity": "sha512-4uMzEY9nlDlgxr61NL3XbKRy1hEkXmKNXhjbAIOVw5vcFrsdYbH2FEwcNyWvWinl103nXgzYNlns9ca+8kFiWw==",
+      "license": "MIT",
+      "dependencies": {
+        "object-assign": "^4.1.1",
+        "prop-types": "^15.7.2",
+        "react-fast-compare": "^3.1.1",
+        "react-side-effect": "^2.1.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.3.0"
+      }
+    },
     "node_modules/react-imask": {
       "version": "7.6.1",
       "resolved": "https://registry.npmjs.org/react-imask/-/react-imask-7.6.1.tgz",
@@ -18026,6 +18037,15 @@
         "react-dom": ">=16.8"
       }
     },
+    "node_modules/react-side-effect": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/react-side-effect/-/react-side-effect-2.1.2.tgz",
+      "integrity": "sha512-PVjOcvVOyIILrYoyGEpDN3vmYNLdy1CajSFNt4TDsVQC5KpTijDvWVoR+/7Rz2xT978D8/ZtFceXxzsPwZEDvw==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^16.3.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
     "node_modules/react-style-singleton": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/react-style-singleton/-/react-style-singleton-2.2.3.tgz",
diff --git a/package.json b/package.json
index 3bd8cda6..7ad71f64 100644
--- a/package.json
+++ b/package.json
@@ -56,7 +56,8 @@
     "url": "https://github.com/openedx/frontend-template-application/issues"
   },
   "dependencies": {
-    "@edx/openedx-atlas": "^0.7.0"
+    "@edx/openedx-atlas": "^0.7.0",
+    "react-helmet": "^6.1.0"
   },
   "devDependencies": {
     "@edx/browserslist-config": "^1.5.0",
diff --git a/src/Main.test.tsx b/src/Main.test.tsx
new file mode 100644
index 00000000..04fcf6aa
--- /dev/null
+++ b/src/Main.test.tsx
@@ -0,0 +1,19 @@
+import { render, waitFor } from '@testing-library/react';
+import { BrowserRouter } from 'react-router-dom';
+import { IntlProvider } from '@openedx/frontend-base';
+import Main from './Main';
+
+describe('Main', () => {
+  it('sets the document title from the page-title message and site name', async () => {
+    render(
+      <IntlProvider locale="en" messages={{}}>
+        <BrowserRouter>
+          <Main />
+        </BrowserRouter>
+      </IntlProvider>
+    );
+    await waitFor(() => {
+      expect(document.title).toBe('Template | Template Test Site');
+    });
+  });
+});
diff --git a/src/Main.tsx b/src/Main.tsx
index 98e124db..fee014af 100644
--- a/src/Main.tsx
+++ b/src/Main.tsx
@@ -1,15 +1,27 @@
-import { CurrentAppProvider } from '@openedx/frontend-base';
+import { CurrentAppProvider, getSiteConfig, useIntl } from '@openedx/frontend-base';
+import { Helmet } from 'react-helmet';
 import { Outlet } from 'react-router-dom';
 import { appId } from './constants';
+import messages from './messages';
 
 import './style.scss';
 
-const Main = () => (
-  <CurrentAppProvider appId={appId}>
-    <main className="d-flex flex-column flex-grow-1">
-      <Outlet />
-    </main>
-  </CurrentAppProvider>
-);
+const Main = () => {
+  const { formatMessage } = useIntl();
+  return (
+    <CurrentAppProvider appId={appId}>
+      <Helmet>
+        <title>
+          {formatMessage(messages['template.page.title'], {
+            siteName: getSiteConfig().siteName,
+          })}
+        </title>
+      </Helmet>
+      <main className="d-flex flex-column flex-grow-1">
+        <Outlet />
+      </main>
+    </CurrentAppProvider>
+  );
+};
 
 export default Main;
diff --git a/src/messages.ts b/src/messages.ts
new file mode 100644
index 00000000..91288543
--- /dev/null
+++ b/src/messages.ts
@@ -0,0 +1,11 @@
+import { defineMessages } from '@openedx/frontend-base';
+
+const messages = defineMessages({
+  'template.page.title': {
+    id: 'template.page.title',
+    defaultMessage: 'Template | {siteName}',
+    description: 'Document title for the template app',
+  },
+});
+
+export default messages;