[#2] Add Header Init

- Header 추가
- HeaderMenu 추가
- HeaderTitle 추가

components/header/Header.tsx

@@ -0,0 +1,26 @@
+import styled from "styled-components";
+import { HeaderMenu } from "./HeaderMenu";
+import { HeaderTitle } from "./HeaderTitle";
+
+export const Header = () => {
+  return (
+    <Wrapper>
+      <WrapperInner>
+        <HeaderTitle />
+        <HeaderMenu />
+      </WrapperInner>
+    </Wrapper>
+  );
+};
+
+const Wrapper = styled.section`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  align-items: center;
+`;
+const WrapperInner = styled.div`
+  display: flex;
+  flex-direction: column;
+  max-width: 1024px;
+`;

components/header/HeaderMenu.tsx

@@ -0,0 +1,11 @@
+import styled from "styled-components";
+
+export const HeaderMenu = () => {
+  return <Wrapper>헤더</Wrapper>;
+};
+
+const Wrapper = styled.section`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+`;

components/header/HeaderTitle.tsx

@@ -0,0 +1,13 @@
+import styled from "styled-components";
+
+export const HeaderTitle = () => {
+  return <Wrapper></Wrapper>;
+};
+
+const Wrapper = styled.section`
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  padding: 0 12px;
+  height: 40px;
+`;