diff --git a/apps/react-app/src/App.tsx b/apps/react-app/src/App.tsx
index d837a9b1..8bd85d7e 100644
--- a/apps/react-app/src/App.tsx
+++ b/apps/react-app/src/App.tsx
@@ -1,20 +1,17 @@
-import { Grid } from "@mui/material";
-
 import { HomePage } from "./components/Page";
-import { PageContainer } from "./components/Page/LoginPage/LoginPage.styles";
+import { PostPage } from "./components/Page";
+import { CategoriesPage } from "./components/Page";
+import LoginPage from "./components/Page/LoginPage";
+
 
 function App() {
   return (
     <>
       <HomePage />
-      {/* ACT 1 - Render PostPage, and CategoriesPage components */}
-      {/* ACT 2 - Move the following content to a new component called LoginPage and render it*/}
-      <PageContainer container>
-        Login Page
-        <Grid item md={4} xs={4} lg={4}>
-          Form
-        </Grid>
-      </PageContainer>
+      <PostPage />
+      <CategoriesPage />
+      
+      <LoginPage />
     </>
   );
 }
diff --git a/apps/react-app/src/components/Page/LoginPage/LoginPage.tsx b/apps/react-app/src/components/Page/LoginPage/LoginPage.tsx
new file mode 100644
index 00000000..f640ca83
--- /dev/null
+++ b/apps/react-app/src/components/Page/LoginPage/LoginPage.tsx
@@ -0,0 +1,16 @@
+import { PageContainer } from "./LoginPage.styles"
+import { Grid } from "@mui/material";
+
+function LoginPage() {
+    return (
+        <PageContainer container>
+            Login Page
+            <Grid item md={4} xs={4} lg={4}>
+                Form
+            </Grid>
+        </PageContainer>
+    )
+}
+
+export default LoginPage;
+
diff --git a/apps/react-app/src/components/Page/LoginPage/index.ts b/apps/react-app/src/components/Page/LoginPage/index.ts
index a22c8b67..cc666cfa 100644
--- a/apps/react-app/src/components/Page/LoginPage/index.ts
+++ b/apps/react-app/src/components/Page/LoginPage/index.ts
@@ -1 +1,2 @@
  // ACT 2 - Export LoginPage component
+export { default } from './LoginPage';
\ No newline at end of file