diff --git a/src/components/Playground.jsx b/src/components/Playground.jsx
index a908ba0f..e3d185ec 100644
--- a/src/components/Playground.jsx
+++ b/src/components/Playground.jsx
@@ -8,6 +8,7 @@ import { FaAnglesDown } from 'react-icons/fa6'
 
 import { useAxios } from '@/hooks/useAxios'
 import { useMessage } from '@/hooks/useMessage'
+import { useMasterController } from '@/hooks/common/useMasterController'
 import { convertDwgToPng } from '@/lib/cadAction'
 import { cadFileNameState, googleMapFileNameState, useCadFileState, useGoogleMapFileState } from '@/store/canvasAtom'
 
@@ -35,6 +36,7 @@ export default function Playground() {
   const converterUrl = process.env.NEXT_PUBLIC_CONVERTER_API_URL
   const { getMessage } = useMessage()
   const { swalFire } = useSwal()
+  const { getRoofMaterialList, getModuleTypeItemList } = useMasterController()
 
   const [color, setColor] = useState('#ff0000')
 
@@ -156,6 +158,24 @@ export default function Playground() {
     <>
       <div className="container mx-auto p-4 m-4 border">
         <div className={styles.test}>이 영역은 테스트입니다.</div>
+        <div className="my-2">
+          <button
+            className="btn-frame deepgray"
+            onClick={() => {
+              getRoofMaterialList()
+            }}
+          >
+            지붕재 목록 조회 API 호출
+          </button>
+          <button
+            className="btn-frame deepgray"
+            onClick={() => {
+              getModuleTypeItemList('ROOF_ID_HIRA_SEME')
+            }}
+          >
+            모듈 타입별 아이템 목록 조회 API 호출
+          </button>
+        </div>
         <div className="m-2">
           <button
             className="btn-frame deepgray"
diff --git a/src/hooks/common/useMasterController.js b/src/hooks/common/useMasterController.js
new file mode 100644
index 00000000..5467a2fc
--- /dev/null
+++ b/src/hooks/common/useMasterController.js
@@ -0,0 +1,22 @@
+import { useAxios } from '@/hooks/useAxios'
+
+export function useMasterController() {
+  const { get } = useAxios()
+
+  const getRoofMaterialList = async () => {
+    return await get({ url: '/api/v1/master/getRoofMaterialList' }).then((res) => {
+      console.log('🚀🚀 ~ getRoofMaterialList ~ res:', res)
+    })
+  }
+
+  const getModuleTypeItemList = async (roofMaterialCd) => {
+    return await get({ url: `/api/v1/master/getModuleTypeItemList/${roofMaterialCd}` }).then((res) => {
+      console.log('🚀🚀 ~ getModuleTypeItemList ~ res:', res)
+    })
+  }
+
+  return {
+    getRoofMaterialList,
+    getModuleTypeItemList,
+  }
+}