diff --git a/package-lock.json b/package-lock.json
index e996b773f..2dd89c835 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -19,7 +19,7 @@
         "react-dom": "^18.2.0",
         "react-router-dom": "^6.22.1",
         "react-scripts": "5.0.1",
-        "typescript": "^5.4.3",
+        "typescript": "^4.9.5",
         "web-vitals": "^2.1.4"
       }
     },
@@ -16693,15 +16693,15 @@
       }
     },
     "node_modules/typescript": {
-      "version": "5.4.3",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.3.tgz",
-      "integrity": "sha512-KrPd3PKaCLr78MalgiwJnA25Nm8HAmdwN3mYUYZgG/wizIo9EainNVQI9/yDavtVFRN2h3k8uf3GLHuhDMgEHg==",
+      "version": "4.9.5",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz",
+      "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==",
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
       },
       "engines": {
-        "node": ">=14.17"
+        "node": ">=4.2.0"
       }
     },
     "node_modules/unbox-primitive": {
diff --git a/src/api/api.tsx b/src/api/api.tsx
index a02fe6620..fba5fccaf 100644
--- a/src/api/api.tsx
+++ b/src/api/api.tsx
@@ -18,8 +18,8 @@ export async function getFolders() {
   }
 }
 
-export async function getUserFolders(folderId: string | undefined) {
-  let url = "/users/1/links";
+export async function getUserFolders(userId: string = '1', folderId?: string ) {
+  let url = "/users/${userId}/links";
 
   if (folderId) {
     url += `?folderId=${folderId}`;
@@ -33,9 +33,9 @@ export async function getUserFolders(folderId: string | undefined) {
   }
 }
 
-export async function getButtonList() {
+export async function getButtonList(userId: string = '1') {
   try {
-    const response = await http.get("/users/1/folders");
+    const response = await http.get("/users/${userId}/folders");
     return response.data;
   } catch (error) {
     throw new Error("버튼 리스트를 불러오는데 실패했습니다.");
diff --git a/src/components/ButtonGroup.tsx b/src/components/ButtonGroup.tsx
index d0c6e0ab1..40b2ef9dd 100644
--- a/src/components/ButtonGroup.tsx
+++ b/src/components/ButtonGroup.tsx
@@ -1,12 +1,17 @@
 import "./ButtonGroup.css";
 import add_icon from "../assets/svg/add.svg";
+import { ButtonGroupProps } from "../types/type";
+
+function ButtonGroup({ buttonList }: ButtonGroupProps) {
+  if (!Array.isArray(buttonList)) {
+    return null; 
+  }
 
-function ButtonGroup({ buttonList }: any) {
   return (
     <div className="button_area">
       <div className="button_list">
         <button className="button_folder">전체</button>
-        {buttonList.map((button: any) => (
+        {buttonList.map((button) => (
           <button key={button.id} type="button" className="button_folder">
             {button.name}
           </button>
diff --git a/src/components/CardList.tsx b/src/components/CardList.tsx
index faaeb4d78..7234cb38a 100644
--- a/src/components/CardList.tsx
+++ b/src/components/CardList.tsx
@@ -1,10 +1,11 @@
+import { FolderData, FolderProps } from "types/type";
 import Card from "./Card";
 import "./CardList.css";
 
-function CardList({ items }: any) {
+function CardList({ folderList }: FolderProps) {
   return (
     <ul className="card_list">
-      {items ? items.map((item: any) => <Card item={item} key={item.id} />) : null}
+      {folderList ? folderList.map((item: FolderData) => <Card cardList={item} key={item.id} />) : null}
     </ul>
   );
 }
diff --git a/src/components/CardsArea.tsx b/src/components/CardsArea.tsx
index 643f8db55..c774c4a13 100644
--- a/src/components/CardsArea.tsx
+++ b/src/components/CardsArea.tsx
@@ -1,13 +1,14 @@
 import "./CardsArea.css";
 import CardList from "./CardList";
+import { FolderProps } from "types/type";
 
 // 에러처리, 로딩처리 추후 추가 예정
-function CardsArea({ foldersData }: any) {
+function CardsArea({ folderList }: FolderProps) {
   return (
     <div className="card_area">
       <div className="card_wrapper">
         {/* {buttonData ? <ButtonList buttonData={buttonData} /> : " "} */}
-        <CardList items={foldersData} />
+        <CardList folderList={folderList} />
       </div>
     </div>
   );
diff --git a/src/pages/folder/FolderPage.tsx b/src/pages/folder/FolderPage.tsx
index a3312c002..949636ed7 100644
--- a/src/pages/folder/FolderPage.tsx
+++ b/src/pages/folder/FolderPage.tsx
@@ -12,12 +12,12 @@ import pen_icon from "../../assets/svg/pen.svg";
 import share_icon from "../../assets/svg/share.svg";
 import delete_icon from "../../assets/svg/delete.svg";
 import ButtonGroup from "../../components/ButtonGroup";
-import { UserData, FolderData, ButtonData } from "@/src/types/type";
+import { UserData, FolderData, ButtonData } from "types/type";
 
 function FolderPage() {
-  const [users, setUsers] = useState<UserData | undefined>();
-  const [folders, setFolders] = useState<FolderData | undefined>();
-  const [buttons, setButtons] = useState<ButtonData | undefined>();
+  const [users, setUsers] = useState<UserData>();
+  const [folders, setFolders] = useState<FolderData[]>();
+  const [buttons, setButtons] = useState<ButtonData[]>();
   // const [folderTitle, setFolderTitle] = useState("전체");
   const [folderTitle] = useState("전체");
   // const [isLoading, setIsLoading] = useState(false);
@@ -74,9 +74,7 @@ function FolderPage() {
 
     loadUserFoldersData();
   }, [id]);
-
-  console.log(folders);
-
+  
   return (
     <div className="folderPage">
       <Gnb userEmail={users?.email} />
@@ -105,7 +103,7 @@ function FolderPage() {
         </div>
         {folders ? (
           <div>
-            <CardsArea foldersData={folders} />
+            <CardsArea folderList={folders} />
           </div>
         ) : (
           <div className="folder_no_link">저장된 링크가 없습니다.</div>
diff --git a/src/pages/share/SharePage.tsx b/src/pages/share/SharePage.tsx
index dd65bddd9..857ea1a9d 100644
--- a/src/pages/share/SharePage.tsx
+++ b/src/pages/share/SharePage.tsx
@@ -6,11 +6,11 @@ import Banner from "../../components/Banner";
 import SearchBar from "../../components/SearchBar";
 import CardsArea from "../../components/CardsArea";
 import Footer from "../../components/Footer";
-import { FolderData, UserData } from "@/src/types/type";
+import { FolderData, UserData } from "../../types/type";
 
 function SharePage() {
   const [users, setUsers] = useState<UserData | undefined>();
-  const [folders, setFolders] = useState<FolderData | undefined>();
+  const [folders, setFolders] = useState<FolderData[]>();
   // const [isLoading, setIsLoading] = useState(false);
   // const [error, setError] = useState(null);
 
@@ -53,7 +53,7 @@ function SharePage() {
       <Banner userName={users?.name} />
       <div className="sharePage_contents">
         <SearchBar />
-        <CardsArea foldersData={folders} />
+        <CardsArea folderList={folders} />
       </div>
       <Footer />
     </div>
diff --git a/src/types/type.d.ts b/src/types/type.d.ts
index 5bcb6c0e8..9283fa5e0 100644
--- a/src/types/type.d.ts
+++ b/src/types/type.d.ts
@@ -14,6 +14,10 @@ export interface FolderData {
   imageSource?: string;
 }
 
+export interface FolderProps{
+  folderList: FolderData[] | undefined;
+}
+
 export interface ButtonData {
   id: number;
   created_at: string;
@@ -23,6 +27,11 @@ export interface ButtonData {
   link?: any;
 }
 
+
+export interface ButtonGroupProps {
+  buttonList: ButtonData[] | undefined;
+};
+
 export interface Icon {
   id: number;
   name: string;
diff --git a/tsconfig.json b/tsconfig.json
index f02e42c74..5684f0bf7 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -13,8 +13,29 @@
     "isolatedModules": true,
     "jsx": "preserve",
     "incremental": true,
+    "baseUrl": ".",
     "paths": {
-      "@/*": ["./*"]
+      "api/*": [
+        "src/api/*"
+      ],
+      "assets/*": [
+        "src/assets/*"
+      ],
+      "components/*": [
+        "src/components/*"
+      ],
+      "constants/*": [
+        "src/constants/*"
+      ],
+      "pages/*": [
+        "src/pages/*"
+      ],
+      "types/*":[
+        "src/types/*"
+      ],
+      "util/*": [
+        "src/util/*"
+      ],
     },
     "typeRoots": ["./node_modules/@types", "@types"]
   },