diff --git a/weatherfit_refactoring/@types/feed/index.d.ts b/weatherfit_refactoring/@types/feed/index.d.ts
index fcb107a..aa0a00c 100644
--- a/weatherfit_refactoring/@types/feed/index.d.ts
+++ b/weatherfit_refactoring/@types/feed/index.d.ts
@@ -46,6 +46,7 @@ interface FEEDDATA_detail {
   content: string
   hashTag: string[]
   category: string[]
+  comments: CommentType[]
 }
 
 interface SelecList {
diff --git a/weatherfit_refactoring/src/Components/Molecules/bar/NavBar.tsx b/weatherfit_refactoring/src/Components/Molecules/bar/NavBar.tsx
index 36184b3..5b615b3 100644
--- a/weatherfit_refactoring/src/Components/Molecules/bar/NavBar.tsx
+++ b/weatherfit_refactoring/src/Components/Molecules/bar/NavBar.tsx
@@ -4,7 +4,7 @@ export default function NavBar() {
   return (
     <footer>
       <nav
-        className="absolute bottom-[15px] mx-[10px] flex justify-around items-center bg-white w-[370px] h-[52px] border border-black rounded-[30px] z-10 py-[5px]"
+        className="absolute bottom-[15px] mx-[2.5%] flex justify-around items-center bg-white w-[93%] h-[52px] border border-black rounded-[30px] z-10 py-[5px]"
         style={{ boxShadow: '7px 7px 1px' }}>
         <NavBarBox iconStyle="HOME" title="홈" url="/" />
         <NavBarBox iconStyle="SEARCH" title="구경" url="/feed" />
diff --git a/weatherfit_refactoring/src/Components/Molecules/comment/Comment.tsx b/weatherfit_refactoring/src/Components/Molecules/comment/Comment.tsx
index 612acac..577ee02 100644
--- a/weatherfit_refactoring/src/Components/Molecules/comment/Comment.tsx
+++ b/weatherfit_refactoring/src/Components/Molecules/comment/Comment.tsx
@@ -23,13 +23,9 @@ export default function Comment({
   const [showReply, setShowReply] = useState<boolean>(false)
   const [isEditing, setIsEditing] = useState<boolean>(false)
   const [editContent, setEditContent] = useState<string>('')
-  const { accesstoken, setAccessToken } = AuthTokenStore()
+  const { accesstoken } = AuthTokenStore()
   const { userNick } = AuthUserNickStore()
 
-  useEffect(() => {
-    setAccessToken()
-  }, [])
-
   // 답글 등록
   const handleReplySubmit = async (e: React.FormEvent) => {
     e.preventDefault()
@@ -209,7 +205,7 @@ export default function Comment({
       comments.map(c =>
         c.id === comment.id
           ? { ...c, status: 0 }
-          : { ...c, replyList: findComment(c.replyList) },
+          : { ...c, replyList: c.replyList ? findComment(c.replyList) : [] },
       )
     setComments(findComment(newComments))
   }
@@ -274,7 +270,7 @@ export default function Comment({
             style="my-[5px]"
             inputStyle="w-[285px] h-[30px]"
             btnText="게시"
-            place={`${userNick}으로 작성...`}
+            place={`${userNick}(으)로 작성...`}
           />
         </div>
       )}
diff --git a/weatherfit_refactoring/src/Components/Molecules/comment/CommentIcon.tsx b/weatherfit_refactoring/src/Components/Molecules/comment/CommentIcon.tsx
index 65cc11b..f871ed4 100644
--- a/weatherfit_refactoring/src/Components/Molecules/comment/CommentIcon.tsx
+++ b/weatherfit_refactoring/src/Components/Molecules/comment/CommentIcon.tsx
@@ -3,11 +3,20 @@ import { useState } from 'react'
 import IconStore, { IconStyle } from '../../Atoms/Icon/IconStore'
 import CommentModal from './CommentModal'
 
-export default function CommentIcon() {
+export default function CommentIcon({
+  boardId,
+  comments,
+  refreshComments,
+}: {
+  boardId: BOARDID
+  comments: CommentType[]
+  refreshComments: () => void
+}) {
   const [showComment, setShowComment] = useState<boolean>(false)
 
   const onClickComment = () => {
     setShowComment(!showComment)
+    refreshComments()
   }
   return (
     <>
@@ -16,7 +25,13 @@ export default function CommentIcon() {
         size={25}
         onClickFunction={onClickComment}
       />
-      {showComment && <CommentModal onClickFunction={onClickComment} />}
+      {showComment && (
+        <CommentModal
+          onClickFunction={onClickComment}
+          boardId={boardId}
+          comments={comments}
+        />
+      )}
     </>
   )
 }
diff --git a/weatherfit_refactoring/src/Components/Molecules/comment/CommentModal.tsx b/weatherfit_refactoring/src/Components/Molecules/comment/CommentModal.tsx
index 901d777..1da78ec 100644
--- a/weatherfit_refactoring/src/Components/Molecules/comment/CommentModal.tsx
+++ b/weatherfit_refactoring/src/Components/Molecules/comment/CommentModal.tsx
@@ -4,15 +4,25 @@ import Comment from './Comment'
 import CommentInput from './CommentInput'
 import { confirmAlert } from '@/utils/function/utilFunction'
 import { AuthTokenStore } from '@/Store/AuthToken'
+import { AuthUserNickStore } from '@/Store/AuthUserNick'
 
 interface Props {
   onClickFunction: () => void
+  boardId: BOARDID
+  comments: CommentType[]
 }
 
-export default function CommentModal({ onClickFunction }: Props) {
-  const [comments, setComments] = useState<CommentType[]>([])
+export default function CommentModal({
+  onClickFunction,
+  boardId,
+  comments,
+}: Props) {
+  const [commentList, setCommentList] = useState<CommentType[]>(
+    comments.filter(comment => comment.status !== 0),
+  )
   const [content, setContent] = useState<string>('')
-  const { accesstoken, setAccessToken } = AuthTokenStore()
+  const { accesstoken } = AuthTokenStore()
+  const { userNick } = AuthUserNickStore()
 
   // 댓글 더미 데이터
   // useEffect(() => {
@@ -31,8 +41,8 @@ export default function CommentModal({ onClickFunction }: Props) {
   // }, [])
 
   useEffect(() => {
-    console.log('댓글 목록 업데이트: ', comments)
-  }, [comments])
+    console.log('댓글 목록 업데이트: ', commentList)
+  }, [commentList])
 
   // 댓글 등록
   const handleCommentSubmit = async (e: React.FormEvent) => {
@@ -51,7 +61,7 @@ export default function CommentModal({ onClickFunction }: Props) {
           Authorization: 'Bearer ' + accesstoken,
         },
         body: JSON.stringify({
-          boardId: 1, // localBoardId 수정 필요
+          boardId: boardId, // localBoardId 수정 필요
           content: content,
         }),
       })
@@ -60,8 +70,8 @@ export default function CommentModal({ onClickFunction }: Props) {
 
       console.log('댓글 data: ', data)
 
-      setComments([
-        ...comments,
+      setCommentList([
+        ...commentList,
         {
           id: data.id,
           boardId: data.boardId,
@@ -81,8 +91,8 @@ export default function CommentModal({ onClickFunction }: Props) {
   }
 
   return (
-    <div className="fixed top-0 left-0 m-0 w-[100%] h-[100%] bg-[#bababa4f] z-[100]">
-      <div className="fixed bottom-0 bg-[#ffffff] w-[390px] h-[65%] rounded-t-lg z-[200] font-Cafe24SsurroundAir">
+    <div className="absolute top-0 left-0 m-0 w-[100%] h-[100%] bg-[#bababa4f] z-[100]">
+      <div className="absolute bottom-0 bg-[#ffffff] w-[100%] h-[65%] rounded-t-lg z-[200] font-Cafe24SsurroundAir">
         <div className="flex justify-between my-[10px] mx-[5px] font-bold">
           <p className="w-[100%] text-center">댓글</p>
           <p className="cursor-pointer" onClick={onClickFunction}>
@@ -92,14 +102,14 @@ export default function CommentModal({ onClickFunction }: Props) {
         <hr />
         <div className="m-[10px] h-[79%] overflow-auto">
           {/* 댓글 목록 부분 */}
-          {comments
+          {commentList
             .filter(comment => comment.status !== 0)
             .map(comment => (
               <Comment
                 key={comment.id}
                 comment={comment}
-                comments={comments}
-                setComments={setComments}
+                comments={commentList}
+                setComments={setCommentList}
               />
             ))}
         </div>
@@ -110,7 +120,7 @@ export default function CommentModal({ onClickFunction }: Props) {
           style="m-[10px] absolute bottom-[5px]"
           inputStyle="w-[325px] h-[30px]"
           btnText="게시"
-          place="닉네임(으)로 작성..."
+          place={`${userNick}(으)로 작성...`}
         />
       </div>
     </div>
diff --git a/weatherfit_refactoring/src/Components/Molecules/header/MainHeader.tsx b/weatherfit_refactoring/src/Components/Molecules/header/MainHeader.tsx
index 96cf674..ad48023 100644
--- a/weatherfit_refactoring/src/Components/Molecules/header/MainHeader.tsx
+++ b/weatherfit_refactoring/src/Components/Molecules/header/MainHeader.tsx
@@ -26,7 +26,7 @@ export default function MainHeader({ title }: Props) {
   }, [accesstoken])
   const router = useRouter()
 
-  console.log(`토큰: ${accesstoken} 체크: ${check}`)
+  // console.log(`토큰: ${accesstoken} 체크: ${check}`)
 
   const onClickToMain =
     title === '옷늘날씨' ? () => router.push('/') : undefined // 또는 다른 함수
diff --git a/weatherfit_refactoring/src/Components/Molecules/post/FeedContents.tsx b/weatherfit_refactoring/src/Components/Molecules/post/FeedContents.tsx
index e488067..8f5b6fa 100644
--- a/weatherfit_refactoring/src/Components/Molecules/post/FeedContents.tsx
+++ b/weatherfit_refactoring/src/Components/Molecules/post/FeedContents.tsx
@@ -50,13 +50,13 @@ export default function FeedContents({ response, blurDataMap }: Props) {
         <div
           className=" font-Cafe24SsurroundAir m-auto text-center"
           tabIndex={0}>
-          <p>현재 온도에 맞는 게시물이 없습니다.</p>
+          <p>현재 온도와 일치하는 게시물이 없습니다.</p>
           <br />
-          <p>카테고리에서</p>
-          <p>온도를 조절하여 원하는 코디를 확인하세요..!</p>
+          <p>카테고리와 온도를 조절하여</p>
+          <p>원하는 코디를 확인해 보세요.</p>
           <br />
           <p className=" text-[12px] text-gray-600">
-            ※ 모든 코디를 보고 싶다면 해시태그 검색을 이용해주세요. ※
+            ※ 검색창의 돋보기를 누르면 모든 코디를 확인할 수 있습니다 ※
           </p>
         </div>
       )}
diff --git a/weatherfit_refactoring/src/Components/Molecules/user/DetailProfile.tsx b/weatherfit_refactoring/src/Components/Molecules/user/DetailProfile.tsx
index 03559c6..d05f25a 100644
--- a/weatherfit_refactoring/src/Components/Molecules/user/DetailProfile.tsx
+++ b/weatherfit_refactoring/src/Components/Molecules/user/DetailProfile.tsx
@@ -1,17 +1,27 @@
 'use client'
 
+import IconStore, { IconStyle } from '@/Components/Atoms/Icon/IconStore'
 import Image from 'next/image'
 
-export default function DetailProfile({
-  nickName,
-  userData,
-}: {
-  nickName: string
-  userData: FEEDDATA_detail
-}) {
+export default function DetailProfile({ userData }: { userData: UserData }) {
   return (
     <div className="flex items-center font-NanumSquareRound mt-5">
-      <Image
+      {userData.image == null ? (
+        <IconStore
+          iconStyle={IconStyle.MY_PROFILE_FILL}
+          size={50}
+          style="border-[3px] border-solid border-gray rounded-full"
+        />
+      ) : (
+        <Image
+          src={userData.image}
+          alt="profile"
+          width={50}
+          height={50}
+          className="rounded-full"
+        />
+      )}
+      {/* <Image
         src={
           'https://cdnimg.melon.co.kr/cm2/artistcrop/images/002/61/143/261143_20210325180240_500.jpg?61e575e8653e5920470a38d1482d7312/melon/optimize/90'
         }
@@ -19,18 +29,10 @@ export default function DetailProfile({
         height={50}
         alt="profile"
         className="rounded-full"
-      />
-      {/* <Image
-        src={userData.userImage}
-        width={50}
-        height={50}
-        alt="profile"
-        className="rounded-full"
       /> */}
       <div className="flex-col ml-3 pb-1">
-        <p className="text-lg">{nickName}</p>
-        <p className="text-xs text-gray-400">@user1</p>
-        {/* <p className="text-xs text-gray-400">여기 아이디 들어가면 되려나</p> */}
+        <p className="text-lg">{userData.nickname}</p>
+        <p className="text-xs text-gray-400">@{userData.email.split('@')[0]}</p>
       </div>
     </div>
   )
diff --git a/weatherfit_refactoring/src/Components/Organisms/detail/DetailOrganism.tsx b/weatherfit_refactoring/src/Components/Organisms/detail/DetailOrganism.tsx
index 65873f9..e9a4b96 100644
--- a/weatherfit_refactoring/src/Components/Organisms/detail/DetailOrganism.tsx
+++ b/weatherfit_refactoring/src/Components/Organisms/detail/DetailOrganism.tsx
@@ -1,3 +1,5 @@
+'use client'
+
 import DetailContent from '@/Components/Molecules/post/DetailContent'
 import DetailImage from '@/Components/Molecules/post/DetailImage'
 import DetailCategory from '../../Molecules/post/DetailCategory'
@@ -5,58 +7,86 @@ import LikeAndComment from './LikeAndComment'
 import DetailProfile from '../../Molecules/user/DetailProfile'
 import DetailEtc from '../../Molecules/post/DetailEtc'
 import NotFound from '@/app/not-found'
+import { useEffect, useState } from 'react'
+import { AuthTokenStore } from '@/Store/AuthToken'
 
-export default async function DetailOrganism({
-  boardId,
-}: {
-  boardId: BOARDID
-}) {
-  const fetchBoardDataResponse = await fetch(
-    `https://www.jerneithe.site/board/detail/${boardId}`,
-    {
-      method: 'GET',
-    },
-  )
-  const fetchBoardData = await fetchBoardDataResponse.json()
+export default function DetailOrganism({ boardId }: { boardId: BOARDID }) {
+  const { accesstoken } = AuthTokenStore()
+  const [boardData, setBoardData] = useState<FEEDDATA_detail>()
+  const [userData, setUserData] = useState<UserData>()
+  const [refreshComments, setRefreshComments] = useState<boolean>(false)
 
-  const fetchUserDataResponse = await fetch(
-    `https://www.jerneithe.site/user/api/userinfo`,
-    {
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify({
-        nickName: fetchBoardData.nickName,
-      }),
-    },
-  )
-  const fetchUserData = await fetchUserDataResponse.json()
+  useEffect(() => {
+    const fetchData = async () => {
+      try {
+        const fetchBoardDataResponse = await fetch(
+          `https://www.jerneithe.site/board/detail/${boardId}`,
+          {
+            method: 'GET',
+          },
+        )
+        const fetchBoardData = await fetchBoardDataResponse.json()
+        setBoardData(fetchBoardData)
+        console.log('fetchBoardData: ', fetchBoardData)
 
-  if (!fetchBoardData.boardId) NotFound()
-  else
-    return (
-      <div className="space-y-5">
-        <div className="mx-5 space-y-3">
-          <div className="flex justify-between">
-            <DetailProfile
-              nickName={fetchBoardData.nickName}
-              userData={fetchUserData}
-            />
-            <DetailEtc boardId={boardId} nickName={fetchBoardData.nickName} />
-          </div>
-          <DetailImage images={fetchBoardData.images} />
-          <LikeAndComment
-            boardId={boardId}
-            likelist={fetchBoardData.likelist}
-          />
-          <DetailContent
-            nickName={fetchBoardData.nickName}
-            content={fetchBoardData.content}
-            hashTag={fetchBoardData.hashTag}
-          />
+        // 작성 유저 정보
+        // 작성한 유저의 정보를 가져오는 거라서 token 값이 들어가면 안됨
+        // 일단 오류 방지를 위해 현재 로그인한 유저의 토큰값을 보내서 정보를 가져올 수 있음
+        // 로그인 안해도 게시물 확인할 수 있도록 토큰값 없이 작성자 정보 불러오기
+        const fetchUserDataResponse = await fetch(
+          `https://www.jerneithe.site/user/api/userinfo`,
+          {
+            method: 'POST',
+            headers: {
+              'Content-Type': 'application/json',
+              Authorization: 'Bearer ' + accesstoken,
+            },
+            body: JSON.stringify({
+              nickname: fetchBoardData.nickName,
+            }),
+          },
+        )
+        const fetchUserData = await fetchUserDataResponse.json()
+        setUserData(fetchUserData)
+        console.log('fetchUserData: ', fetchUserData)
+      } catch (err) {
+        console.log('오류: ', err)
+      }
+    }
+    fetchData()
+  }, [boardId, refreshComments])
+
+  //  if (!fetchBoardData.boardId) NotFound()
+  //  else
+  return (
+    <div className="space-y-5">
+      <div className="mx-5 space-y-3">
+        <div className="flex justify-between">
+          {userData && (
+            <>
+              <DetailProfile userData={userData} />
+              <DetailEtc boardId={boardId} nickName={userData.nickname} />
+            </>
+          )}
         </div>
-        <DetailCategory category={fetchBoardData.category} />
+        {boardData && (
+          <>
+            <DetailImage images={boardData.images} />
+            <LikeAndComment
+              boardId={boardId}
+              likelist={boardData.likelist}
+              comments={boardData.comments}
+              refreshComments={() => setRefreshComments(!refreshComments)}
+            />
+            <DetailContent
+              nickName={boardData.nickName}
+              content={boardData.content}
+              hashTag={boardData.hashTag}
+            />
+          </>
+        )}
       </div>
-    )
+      {boardData && <DetailCategory category={boardData.category} />}
+    </div>
+  )
 }
diff --git a/weatherfit_refactoring/src/Components/Organisms/detail/LikeAndComment.tsx b/weatherfit_refactoring/src/Components/Organisms/detail/LikeAndComment.tsx
index b7f91f7..ecb44d6 100644
--- a/weatherfit_refactoring/src/Components/Organisms/detail/LikeAndComment.tsx
+++ b/weatherfit_refactoring/src/Components/Organisms/detail/LikeAndComment.tsx
@@ -9,9 +9,13 @@ import { AuthUserNickStore } from '@/Store/AuthUserNick'
 export default function LikeAndComment({
   boardId,
   likelist,
+  comments,
+  refreshComments,
 }: {
+  comments: CommentType[]
   boardId: BOARDID
   likelist: LIKE[]
+  refreshComments: () => void
 }) {
   // const { isLiked, toggleLikeState } = useStore()
   const { accesstoken } = AuthTokenStore()
@@ -56,7 +60,11 @@ export default function LikeAndComment({
           size={25}
         />
       </div>
-      <CommentIcon />
+      <CommentIcon
+        boardId={boardId}
+        comments={comments}
+        refreshComments={refreshComments}
+      />
     </div>
   )
 }