diff --git a/frontend/src/components/client/ClientView.tsx b/frontend/src/components/client/ClientView.tsx
index 89a31ff0..99f47b19 100644
--- a/frontend/src/components/client/ClientView.tsx
+++ b/frontend/src/components/client/ClientView.tsx
@@ -2,7 +2,7 @@ import styled from 'styled-components';
import Player from './Player';
import PlayerInfo from './PlayerInfo';
-import Footer from './Footer';
+import Footer from '@components/common/Footer';
const ClientView = () => {
return (
diff --git a/frontend/src/components/client/Footer.tsx b/frontend/src/components/client/Footer.tsx
deleted file mode 100644
index f6785fd8..00000000
--- a/frontend/src/components/client/Footer.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import styled from 'styled-components';
-
-const Footer = () => {
- return Footer;
-};
-
-export default Footer;
-
-const FooterContainer = styled.div`
- display: flex;
-`;
diff --git a/frontend/src/components/common/Footer.tsx b/frontend/src/components/common/Footer.tsx
new file mode 100644
index 00000000..93da8da8
--- /dev/null
+++ b/frontend/src/components/common/Footer.tsx
@@ -0,0 +1,41 @@
+import styled from 'styled-components';
+
+const Footer = () => {
+ const footerItem = [
+ { title: '라이부 노션', link: 'https://gominzip.notion.site/TEAM-127673f3719e803faf63c70322560d3b?pvs=4' },
+ { title: '라이부 깃허브', link: 'https://github.com/boostcampwm-2024/web22-LiBoo' },
+ { title: '개발자에게 커피 사주기', link: '' },
+ { title: '라이부 팀 소개', link: '' },
+ { title: '라이부 팀 블로그', link: '' }
+ ];
+
+ return (
+
+ {footerItem.map(({ title, link }, index) => (
+
+ {title}
+
+ ))}
+
+ );
+};
+
+export default Footer;
+
+const FooterContainer = styled.div`
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100px;
+ gap: 40px;
+ ${({ theme }) => theme.tokenTypographys['display-medium12']};
+
+ .footer-link {
+ color: ${({ theme }) => theme.tokenColors['text-default']};
+ text-decoration: none;
+
+ &:hover {
+ text-decoration: underline;
+ }
+ }
+`;
diff --git a/frontend/src/pages/MainPage.tsx b/frontend/src/pages/MainPage.tsx
index a420608d..82db44dc 100644
--- a/frontend/src/pages/MainPage.tsx
+++ b/frontend/src/pages/MainPage.tsx
@@ -1,10 +1,9 @@
import { styled } from 'styled-components';
import { MainHeader, MainLiveSection, RecommendLive, ServiceBanner } from '@components/main';
+import Footer from '@components/common/Footer';
export default function MainPage() {
-
-
return (
<>
@@ -13,6 +12,7 @@ export default function MainPage() {
+
>
);