diff --git a/frontend/__test__/api/postList.test.ts b/frontend/__test__/api/postList.test.ts
index 57f594d3a..33ae82d61 100644
--- a/frontend/__test__/api/postList.test.ts
+++ b/frontend/__test__/api/postList.test.ts
@@ -2,7 +2,7 @@ import { getPostList } from '@api/postList';
 
 import { POST_TYPE, SORTING, STATUS } from '@constants/post';
 
-import { MOCK_POST_LIST } from '@mocks/mockData/postList';
+import { MOCK_TRANSFORM_POST_LIST } from '@mocks/mockData/postList';
 
 describe('서버와 통신하여 전체 게시글 목록을 불러오는지 확인한다.', () => {
   test('게시글 목록의 개수는 10개씩 불러온다.', async () => {
@@ -36,7 +36,7 @@ describe('서버와 통신하여 전체 게시글 목록을 불러오는지 확
       }
     );
 
-    expect(data.postList).toEqual(MOCK_POST_LIST);
+    expect(data.postList).toEqual(MOCK_TRANSFORM_POST_LIST);
   });
 
   test('게시글 페이지의 정보를 불러온다.', async () => {
@@ -70,7 +70,7 @@ describe('서버와 통신하여 전체 게시글 목록을 불러오는지 확
       }
     );
 
-    expect(data.postList).toEqual(MOCK_POST_LIST);
+    expect(data.postList).toEqual(MOCK_TRANSFORM_POST_LIST);
   });
 
   test('내가 작성한 게시글 페이지의 정보를 불러온다.', async () => {
@@ -87,7 +87,7 @@ describe('서버와 통신하여 전체 게시글 목록을 불러오는지 확
       }
     );
 
-    expect(data.postList).toEqual(MOCK_POST_LIST);
+    expect(data.postList).toEqual(MOCK_TRANSFORM_POST_LIST);
   });
 
   test('내가 투표한 게시글 페이지의 정보를 불러온다.', async () => {
@@ -104,7 +104,7 @@ describe('서버와 통신하여 전체 게시글 목록을 불러오는지 확
       }
     );
 
-    expect(data.postList).toEqual(MOCK_POST_LIST);
+    expect(data.postList).toEqual(MOCK_TRANSFORM_POST_LIST);
   });
 
   test('내가 검색한 게시글 페이지의 정보를 불러온다.', async () => {
@@ -121,6 +121,6 @@ describe('서버와 통신하여 전체 게시글 목록을 불러오는지 확
       }
     );
 
-    expect(data.postList).toEqual(MOCK_POST_LIST);
+    expect(data.postList).toEqual(MOCK_TRANSFORM_POST_LIST);
   });
 });
diff --git a/frontend/__test__/hooks/query/usePostList.test.tsx b/frontend/__test__/hooks/query/usePostList.test.tsx
index 1595cf016..9f4944712 100644
--- a/frontend/__test__/hooks/query/usePostList.test.tsx
+++ b/frontend/__test__/hooks/query/usePostList.test.tsx
@@ -7,7 +7,7 @@ import { usePostList } from '@hooks/query/usePostList';
 
 import { POST_TYPE, SORTING, STATUS } from '@constants/post';
 
-import { MOCK_POST_LIST } from '@mocks/mockData/postList';
+import { MOCK_TRANSFORM_POST_LIST } from '@mocks/mockData/postList';
 
 const queryClient = new QueryClient();
 
@@ -35,7 +35,9 @@ describe('usePostList 훅이 게시글 목록을 불러오는지 확인한다.',
       }
     );
 
-    await waitFor(() => expect(result.current.data?.pages[0].postList).toEqual(MOCK_POST_LIST));
+    await waitFor(() =>
+      expect(result.current.data?.pages[0].postList).toEqual(MOCK_TRANSFORM_POST_LIST)
+    );
   });
 
   test('카테고리별 게시글 목록을 불러온다.', async () => {
@@ -57,7 +59,9 @@ describe('usePostList 훅이 게시글 목록을 불러오는지 확인한다.',
       }
     );
 
-    await waitFor(() => expect(result.current.data?.pages[0].postList).toEqual(MOCK_POST_LIST));
+    await waitFor(() =>
+      expect(result.current.data?.pages[0].postList).toEqual(MOCK_TRANSFORM_POST_LIST)
+    );
   });
 
   test('내가 작성한 게시글 목록을 불러온다.', async () => {
@@ -79,7 +83,9 @@ describe('usePostList 훅이 게시글 목록을 불러오는지 확인한다.',
       }
     );
 
-    await waitFor(() => expect(result.current.data?.pages[0].postList).toEqual(MOCK_POST_LIST));
+    await waitFor(() =>
+      expect(result.current.data?.pages[0].postList).toEqual(MOCK_TRANSFORM_POST_LIST)
+    );
   });
 
   test('내가 투표한 게시글 목록을 불러온다.', async () => {
@@ -101,7 +107,9 @@ describe('usePostList 훅이 게시글 목록을 불러오는지 확인한다.',
       }
     );
 
-    await waitFor(() => expect(result.current.data?.pages[0].postList).toEqual(MOCK_POST_LIST));
+    await waitFor(() =>
+      expect(result.current.data?.pages[0].postList).toEqual(MOCK_TRANSFORM_POST_LIST)
+    );
   });
 
   test('내가 검색한 게시글 목록을 불러온다.', async () => {
@@ -123,6 +131,8 @@ describe('usePostList 훅이 게시글 목록을 불러오는지 확인한다.',
       }
     );
 
-    await waitFor(() => expect(result.current.data?.pages[0].postList).toEqual(MOCK_POST_LIST));
+    await waitFor(() =>
+      expect(result.current.data?.pages[0].postList).toEqual(MOCK_TRANSFORM_POST_LIST)
+    );
   });
 });
diff --git a/frontend/src/api/post.ts b/frontend/src/api/post.ts
index fa3ce30f4..04c258bc2 100644
--- a/frontend/src/api/post.ts
+++ b/frontend/src/api/post.ts
@@ -1,4 +1,4 @@
-import { PostInfo } from '@type/post';
+import { PostInfo, PostInfoResponse } from '@type/post';
 
 import {
   getFetch,
@@ -11,6 +11,33 @@ import {
 
 const BASE_URL = process.env.VOTOGETHER_BASE_URL;
 
+export const transformPostResponse = (post: PostInfoResponse): PostInfo => {
+  return {
+    category: post.categories.map(category => ({ id: category.id, name: category.name })),
+    content: post.content,
+    endTime: post.deadline,
+    imageUrl: post.imageUrl,
+    postId: post.postId,
+    startTime: post.createdAt,
+    title: post.title,
+    voteInfo: {
+      allPeopleCount: post.voteInfo.totalVoteCount,
+      selectedOptionId: post.voteInfo.selectedOptionId,
+      options: post.voteInfo.options.map(option => ({
+        id: option.optionId,
+        text: option.content,
+        peopleCount: option.voteCount,
+        percent: option.votePercent,
+        imageUrl: option.imageUrl,
+      })),
+    },
+    writer: {
+      id: post.writer.id,
+      nickname: post.writer.nickname,
+    },
+  };
+};
+
 export const votePost = async (postId: number, optionId: number) => {
   return await postFetch(`${BASE_URL}/posts/${postId}/options/${optionId}`, '');
 };
@@ -27,7 +54,9 @@ export const changeVotedOption = async (postId: number, optionData: OptionData)
 };
 
 export const getPost = async (postId: number): Promise<PostInfo> => {
-  return await getFetch<PostInfo>(`${BASE_URL}/posts/${postId}`);
+  const post = await getFetch<PostInfoResponse>(`${BASE_URL}/posts/${postId}`);
+
+  return transformPostResponse(post);
 };
 
 export const createPost = async (newPost: FormData) => {
diff --git a/frontend/src/api/postList.ts b/frontend/src/api/postList.ts
index f2a4e91ad..089623883 100644
--- a/frontend/src/api/postList.ts
+++ b/frontend/src/api/postList.ts
@@ -1,4 +1,4 @@
-import { PostInfo, PostListByOptionalOption, PostListByRequiredOption } from '@type/post';
+import { PostInfoResponse, PostListByOptionalOption, PostListByRequiredOption } from '@type/post';
 
 import {
   REQUEST_STATUS_OPTION,
@@ -10,6 +10,8 @@ import {
 
 import { getFetch } from '@utils/fetch';
 
+import { transformPostResponse } from './post';
+
 const BASE_URL = process.env.VOTOGETHER_BASE_URL;
 
 export const makePostListUrl = (
@@ -44,10 +46,10 @@ export const getPostList = async (
 
   const postListUrl = makePostListUrl(requiredOption, optionalOption);
 
-  const postList = await getFetch<PostInfo[]>(postListUrl);
+  const postList = await getFetch<PostInfoResponse[]>(postListUrl);
 
   return {
     pageNumber,
-    postList,
+    postList: postList.map(post => transformPostResponse(post)),
   };
 };
diff --git a/frontend/src/mocks/mockData/postList.ts b/frontend/src/mocks/mockData/postList.ts
index ba85cf666..8a1d8d142 100644
--- a/frontend/src/mocks/mockData/postList.ts
+++ b/frontend/src/mocks/mockData/postList.ts
@@ -1,8 +1,10 @@
-import { PostInfo } from '@type/post';
+import { PostInfo, PostInfoResponse } from '@type/post';
 
-export const MOCK_POST_LIST: PostInfo[] = [];
+import { transformPostResponse } from '@api/post';
 
-const getMockPost = () => ({
+export const MOCK_POST_LIST: PostInfoResponse[] = [];
+
+const getMockPost = (): PostInfoResponse => ({
   postId: Math.floor(Math.random() * 100000),
   title:
     '어느 곳에서 정보를 찾아야 할지도 막막한 사람들을 위한, 심심풀이로 나의 취향과 남의 취향을 비교해보고 싶은 사람들을 위한 프로젝트',
@@ -13,7 +15,7 @@ const getMockPost = () => ({
   content:
     '이는 사람들에게 재미와 정보, 두 가지를 줄 수 있습니다. 사람들은 MBTI, 밸런스게임처럼 나와 같은 사람들을 찾고, 나와 다른 사람들과 비교하는 것을 즐깁니다. 이를 컨텐츠화하여 보다 빠르게 질문하고 답변하며, 사람들의 반응을 확인할 수 있다면 사람들은 충분한 즐거움을 느낄 것입니다. 또한 20대가 많은 대학가에 창업을 하고 싶지만 20대의 의견을 모르겠을 때, 확실한 답은 아닐지라도 어느 정도의 가이드를 줄 수 있을 것입니다. 질문자에게 제공되는 성별/나이대별 투표 결과 정보는 질문자가 하고자 하는 의사결정의 근거가 될 수 있을 것입니다.',
   imageUrl: '',
-  category: [
+  categories: [
     {
       id: 1,
       name: '개발',
@@ -27,39 +29,40 @@ const getMockPost = () => ({
       name: '상담',
     },
   ],
-  startTime: '2023-07-12 12:40',
-  endTime: '2023-07-13 18:40',
+  createdAt: '2023-07-12 12:40',
+  deadline: '2023-07-13 18:40',
   voteInfo: {
     selectedOptionId: 9,
-    allPeopleCount: 123,
+    totalVoteCount: 123,
     options: [
       {
-        id: 6,
-        text: '당선',
-        peopleCount: 30,
-        percent: 30,
+        optionId: 6,
+        content: '당선',
+        voteCount: 30,
+        votePercent: 30,
         imageUrl: '',
       },
       {
-        id: 7,
-        text: 'votogether',
-        peopleCount: 40,
-        percent: 40,
+        optionId: 7,
+        content: 'votogether',
+        voteCount: 40,
+        votePercent: 40,
         imageUrl: '',
       },
       {
-        id: 8,
-        text: '인스타그램, 블라인드와 같은 SNS의 형식을 차용합니다. 누군가는 글을 쓰고, 누군가는 반응합니다. 다만, 댓글은 없습니다. 투표로 자신의 의견을 표현하고 이를 사람들에게 보여줍니다.',
-        peopleCount: 20,
+        optionId: 8,
+        content:
+          '인스타그램, 블라인드와 같은 SNS의 형식을 차용합니다. 누군가는 글을 쓰고, 누군가는 반응합니다. 다만, 댓글은 없습니다. 투표로 자신의 의견을 표현하고 이를 사람들에게 보여줍니다.',
+        voteCount: 20,
         imageUrl: '',
-        percent: 20,
+        votePercent: 20,
       },
       {
-        id: 9,
-        text: 'fun from choice, 오늘도 즐거운 한 표 ',
+        optionId: 9,
+        content: 'fun from choice, 오늘도 즐거운 한 표 ',
         imageUrl: 'https://source.unsplash.com/random',
-        peopleCount: 10,
-        percent: 10,
+        voteCount: 10,
+        votePercent: 10,
       },
     ],
   },
@@ -68,3 +71,7 @@ const getMockPost = () => ({
 for (let index = 0; index < 10; index += 1) {
   MOCK_POST_LIST.push(getMockPost());
 }
+
+export const MOCK_TRANSFORM_POST_LIST: PostInfo[] = MOCK_POST_LIST.map(POST =>
+  transformPostResponse(POST)
+);