diff --git a/src/app/components/AppFooter.tsx b/src/app/components/AppFooter.tsx
new file mode 100644
index 0000000..2b041ce
--- /dev/null
+++ b/src/app/components/AppFooter.tsx
@@ -0,0 +1,9 @@
+export function AppFooter() {
+  return (
+    <footer style={{ padding: 12, borderTop: "1px solid #eee", marginTop: 24 }}>
+      © msg App
+    </footer>
+  );
+}
+
+
diff --git a/src/app/components/AppHeader.tsx b/src/app/components/AppHeader.tsx
new file mode 100644
index 0000000..818dfb3
--- /dev/null
+++ b/src/app/components/AppHeader.tsx
@@ -0,0 +1,13 @@
+export function AppHeader() {
+  return (
+    <header style={{ display: "flex", justifyContent: "space-between", padding: 12 }}>
+      <div>msg App</div>
+      <nav style={{ display: "flex", gap: 12 }}>
+        <a href="/">홈</a>
+        <a href="/boards">게시판</a>
+      </nav>
+    </header>
+  );
+}
+
+
diff --git a/src/app/components/AppSidebar.tsx b/src/app/components/AppSidebar.tsx
new file mode 100644
index 0000000..e51cb06
--- /dev/null
+++ b/src/app/components/AppSidebar.tsx
@@ -0,0 +1,12 @@
+export function AppSidebar() {
+  return (
+    <aside style={{ width: 200, borderRight: "1px solid #eee", padding: 12 }}>
+      <ul style={{ display: "flex", flexDirection: "column", gap: 8 }}>
+        <li><a href="/boards">게시판</a></li>
+        <li><a href="/admin">관리</a></li>
+      </ul>
+    </aside>
+  );
+}
+
+
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 6c3bcf8..40c0f7a 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,6 +1,9 @@
 import type { Metadata } from "next";
 import "./globals.css";
 import QueryProvider from "@/app/QueryProvider";
+import { AppHeader } from "@/app/components/AppHeader";
+import { AppSidebar } from "@/app/components/AppSidebar";
+import { AppFooter } from "@/app/components/AppFooter";
 
 
 export const metadata: Metadata = {
@@ -17,7 +20,12 @@ export default function RootLayout({
     <html lang="en">
       <body>
         <QueryProvider>
-          {children}
+          <AppHeader />
+          <div style={{ display: "flex", minHeight: "80vh" }}>
+            <AppSidebar />
+            <main style={{ flex: 1, padding: 16 }}>{children}</main>
+          </div>
+          <AppFooter />
         </QueryProvider>
       </body>
     </html>
