diff --git a/src/components/MyPage/MyInfoModal.tsx b/src/components/MyPage/MyInfoModal.tsx
index eb610142..c4a128d2 100644
--- a/src/components/MyPage/MyInfoModal.tsx
+++ b/src/components/MyPage/MyInfoModal.tsx
@@ -1,58 +1,96 @@
 /* eslint-disable no-alert */
 import React, { useState } from 'react';
 import styled from 'styled-components';
-import { LoungeList } from '~components/MyPage/constant';
+import { useRouter } from 'next/router';
 import ModalPopup from '~components/ModalPopup';
+import Axios from '~lib/axios';
+import { useAppDispatch } from '~/store';
+import { showNotice } from '~store/modules/notice';
+import useGetLoungeList from '~/hooks/myPage/useGetLoungeList';
+import Notice from '~/components/Notice';
+
+type lounge = {
+  id: string;
+  name: string;
+};
 
 const MyInfo = ({ onClose }: { onClose: () => void }) => {
-  const [name, setName] = useState('');
+  const router = useRouter();
+  const dispatch = useAppDispatch();
   const [loungeOutModalShow, setLoungeOutModalShow] = useState(false);
   const [withdrawalModalShow, setWithdrawalModalShow] = useState(false);
-  const onClickSave = () => {
-    alert('새로운 이름을 저장했습니다.');
-    setName(name);
-    console.log(`새 이름 ${name}`);
-  };
+  const [loungeOutId, setLoungeOutId] = useState('');
+
+  // 라운지 리스트와 이름 get
+  const { data: loungeNames, error, isLoading } = useGetLoungeList();
 
   // 라운지 탈퇴
-  const goodByeLounge = () => {
-    if (loungeOutModalShow) {
-      alert('소속 라운지를 탈퇴했습니다.');
+  const goodByeLounge = async (id: string) => {
+    try {
+      if (loungeOutModalShow) {
+        handleNotice('라운지를 탈퇴했습니다.');
+        await Axios.delete(`/api/rooms/${id}`, { withCredentials: true });
+        router.push('/');
+      }
+    } catch (err) {
+      handleNotice('라운지 탈퇴에 실패했습니다.');
     }
   };
 
   // 라이언타운 계정 삭제
-  const goodByeLionTown = () => {
-    if (withdrawalModalShow) {
-      alert('라이언타운 계정을 삭제했습니다. 안녕히 가세요.');
+  const goodByeLionTown = async () => {
+    try {
+      if (withdrawalModalShow) {
+        handleNotice('안녕히 가세요.');
+        await Axios.delete('/api/auth/sign-drop', { withCredentials: true });
+        router.push('/');
+      }
+    } catch (err) {
+      handleNotice('회원 탈퇴에 실패했습니다.');
     }
   };
 
+  // 다음 코드는 mvp 이후에 작업하려고 코드 살려뒀습니다.
+  const onClickSave = () => {
+    handleNotice('저장되었습니다.');
+  };
+
+  // 토스트 메시지
+  const handleNotice = (message: string) => {
+    dispatch(showNotice(message));
+  };
+
+  // 상태에 따른 렌더링
+  if (error) {
+    return handleNotice('알 수 없는 에러가 발생했습니다.');
+  }
+
+  if (isLoading) {
+    return null;
+  }
+
   return (
     <div>
+      <Notice />
       <ModalPopup size="large" title="내 정보" onClose={onClose} isCancel>
         <InfoBox>
           <NameBox>
             <NameTitle>이름</NameTitle>
             <NameInfo>
-              <NameText
-                type="text"
-                maxLength={6}
-                value={name}
-                onChange={e => setName(e.target.value)}
-              />
+              <NameText type="text" maxLength={6} value={loungeNames.user.name} readOnly />
               <NameSaveButton onClick={onClickSave}>저장</NameSaveButton>
             </NameInfo>
           </NameBox>
           <LoungeBox>
             <LoungeTitle>소속 라운지</LoungeTitle>
             <LoungeInfo>
-              {LoungeList.map(lounge => (
+              {loungeNames.loungeNames.map((lounge: lounge) => (
                 <LoungeRow key={lounge.id}>
                   <LoungeName>{lounge.name}</LoungeName>
                   <LoungeOutButton
                     onClick={() => {
                       setLoungeOutModalShow(true);
+                      setLoungeOutId(lounge.id);
                     }}
                   >
                     탈퇴
@@ -81,12 +119,13 @@ const MyInfo = ({ onClose }: { onClose: () => void }) => {
           }}
           onConfirm={() => {
             setLoungeOutModalShow(false);
-            goodByeLounge();
+            goodByeLounge(loungeOutId);
           }}
         >
           정말 [라운지이름]을 탈퇴하시겠습니까?
         </ModalPopup>
       )}
+
       {/* //소속 라운지 탈퇴 모달 */}
       {withdrawalModalShow && (
         <ModalPopup
diff --git a/src/components/MyPage/constant.ts b/src/components/MyPage/constant.ts
deleted file mode 100644
index 69ec0568..00000000
--- a/src/components/MyPage/constant.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-type LoungeList = { id: number; name: string };
-
-export const LoungeList = [
-  {
-    id: 1,
-    name: '6 0 2 1 2 4 0 4 하 나 둘 셋 넷 다 잘려라잘려라',
-  },
-  {
-    id: 2,
-    name: '이 건 한 글 임 이 건 열 글 자 하 나',
-  },
-  {
-    id: 3,
-    name: '6 0 2 1 2 4 0 4 이 유 라 r e a c t11111',
-  },
-  {
-    id: 4,
-    name: 'a a a a b b b b c c c c d d', // 영문 14글자
-  },
-  {
-    id: 5,
-    name: '2022 명지대 멋쟁이사자처럼 라운지',
-  },
-  {
-    id: 6,
-    name: '연빈님이 기능 얼른 하라고 함',
-  },
-  {
-    id: 7,
-    name: '여기도 토큰이 있고 저기도 is',
-  },
-];
diff --git a/src/hooks/myPage/useGetLoungeList.ts b/src/hooks/myPage/useGetLoungeList.ts
new file mode 100644
index 00000000..f197eb1d
--- /dev/null
+++ b/src/hooks/myPage/useGetLoungeList.ts
@@ -0,0 +1,19 @@
+import { useQuery } from '@tanstack/react-query';
+import Axios from '~lib/axios';
+
+const myInfoList = async () => {
+  try {
+    const loungeData = await Axios.get('/api/lounges/mypage', {
+      withCredentials: true,
+    });
+    return loungeData.data.data;
+  } catch (err) {
+    throw new Error('리스트를 불러올 수 없습니다.');
+  }
+};
+
+const useGetLoungeList = () => {
+  return useQuery(['loungeList'], myInfoList);
+};
+
+export default useGetLoungeList;