게시판 컴포넌트 분리 및 네이밍 수정

src/components/board/BoardComentArea.vue

@@ -0,0 +1,15 @@
+<template>
+    <div>
+
+    </div>
+</template>
+
+<script>
+    export default {
+        
+    }
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/components/board/BoardComment.vue

@@ -1,21 +1,21 @@
 <template>
     <ul class="list-unstyled">
         <li>
-            <Profile profileName=곤데리 :showDetail="false" />
+            <BoardProfile profileName=곤데리 :showDetail="false" />
             <div>저도 궁금합니다.</div>
             <ul class="list-unstyled twoDepth">
                 <li>
-                    <Profile profileName=곤데리2 :showDetail="false" />
+                    <BoardProfile profileName=곤데리2 :showDetail="false" />
                     <div>저도 궁금합니다.</div>
                 </li>
             </ul>
         </li>
         <li>
-            <Profile profileName=곤데리 :showDetail="false" />
+            <BoardProfile profileName=곤데리 :showDetail="false" />
             <div>저도 궁금합니다.</div>
         </li>
         <li>
-            <Profile profileName=곤데리 :showDetail="false" :unknown="false"/>
+            <BoardProfile profileName=곤데리 :showDetail="false" :unknown="false"/>
             <div>저도 궁금합니다.</div>
         </li>
     </ul>
@@ -24,7 +24,7 @@
 
 <script setup>
 
-import Profile from './Profile.vue';
+import BoardProfile from './BoardProfile.vue';
 
 </script>
 

src/components/board/BoardContent.vue

@@ -2,7 +2,7 @@
     <div class="col">
         <div class="card">
             <div class="card-header">
-                <Profile profileName="만드레야2" />
+                <BoardProfile profileName="만드레야2" />
             </div>
             <div class="card-body">
                 <div class="d-flex justify-content-between align-items-center flex-wrap mb-6 gap-2">
@@ -22,18 +22,7 @@
                 <div class="d-flex min-150">
                     <p class="mb-0">현재 뷰 사용중인데 리액트 공부가 해보고 싶습니다. 강의 추천해주십쇼! 리액트 1도 모릅니다.</p>
                 </div>
-                <div class="card shadow-none border mt-6">
-                    <div class="card-body">
-                        <div class="d-flex justify-content-start align-items-top">
-                            <div class="avatar-wrapper">
-                                <div class="avatar me-4"><img src="/img/avatars/11.png" alt="Avatar" class="rounded-circle"></div>
-                            </div>
-                            <div class="w-100">
-                                <textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
-                            </div>
-                        </div>
-                    </div>
-                </div>
+                
                 <div class="mb-4 text-end">
                     <button class="btn btn-primary my-4">답변 쓰기</button>
                 </div>
@@ -43,7 +32,7 @@
 </template>
 
 <script setup>
-    import Profile from './Profile.vue'
+    import BoardProfile from './BoardProfile.vue';
 </script>
 
 <style scoped>

src/views/board/BoardView.vue

@@ -1,17 +1,16 @@
 <template>
     <div class="container-xxl flex-grow-1 container-p-y">
         <div class="row">
-            <BoardDetail />
-            <Comment />
+            <BoardContent />
+            <BoardComment />
         </div>
     </div>
 </template>
 
 <script setup>
 
-import Profile from '@/components/Profile.vue';
-import Comment from '@/components/Comment.vue';
-import BoardDetail from '@/components/BoardDetail.vue';
+import BoardComment from '@/components/board/BoardComment.vue';
+import BoardContent from '@/components/board/BoardContent.vue';
 
 </script>