조회수 및 좋아요 수 기능 구현

client/src/components/board/PostDetail/index.stories.tsx

@@ -43,6 +43,8 @@ display: none;
   postTitle: 'Test Post',
   postType: 'qna',
   postUpdatedAt: '2023-06-01T02:25:31.176242',
+  likes: 0,
+  hits: 0,
 };
 
 const meta: Meta<typeof PostDetail> = {

client/src/components/board/PostDetail/index.tsx

@@ -81,7 +81,7 @@ export default function PostDetail({ data, IS_AUTHOR }: PostDetail) {
 
       <p className="text-gray-400">{parseDate(data?.postCreatedAt)}</p>
       <hr />
-      <p className="text-sm text-gray-400">좋아요 0 | 조회 0</p>
+      <p className="text-sm text-gray-400">{`좋아요 ${data.likes} | 조회 ${data.hits}`}</p>
     </article>
   );
 }

client/src/components/common/Post/PostSummary/index.stories.tsx

@@ -16,6 +16,8 @@ const mockPostInfoData: IPostInformation = {
   postTitle: 'reDuck 입니다.',
   postType: 'qna',
   postUpdatedAt: '2023-06-01T02:25:31.176242',
+  likes: 0,
+  hits: 0,
 };
 
 const meta: Meta<typeof PostSummary> = {

client/src/components/common/Post/PostSummary/index.tsx

@@ -46,7 +46,7 @@ export function PostSummary({
         />
         <div className="flex justify-between">
           <div className="flex flex-col gap-1">
-            <p className="text-sm text-gray-400">좋아요 0 | 조회 0</p>
+            <p className="text-sm text-gray-400">{`좋아요 ${postInfoData.likes} | 조회 ${postInfoData.hits}`}</p>
             <p className="text-gray-400">
               {parseDate(postInfoData?.postCreatedAt)}
             </p>

client/src/types/index.ts

@@ -20,6 +20,8 @@ export interface IPostInformation {
   postTitle: string;
   postType: string;
   postUpdatedAt: string;
+  hits: number;
+  likes: number;
 }
 
 export interface IBoardPostInformation

client/vercel.json

@@ -0,0 +1,3 @@
+{
+  "installCommand": "yarn install"
+}