diff --git a/next.config.ts b/next.config.ts
index 680c176..9d20e0c 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -5,14 +5,18 @@ const nextConfig: NextConfig = {
     scrollRestoration: false,
   },
   images: {
-    domains: ['team2-app-s3-bucket.s3.ap-northeast-2.amazonaws.com'],
+    // 외부 이미지 최적화 완전 비활성화 (Vercel 유료 기능 회피)
+    unoptimized: true,
+    domains: [
+      'team2-app-s3-bucket.s3.ap-northeast-2.amazonaws.com',
+      'team2-app-s3-bucket.s3.amazonaws.com',
+    ],
     remotePatterns: [
       {
         protocol: 'https',
         hostname: 'www.thecocktaildb.com',
       },
     ],
-    qualities: [25, 50, 75, 90, 100],
   },
   env: {
     NPUBLIC_API_URL: process.env.NEXT_PUBLIC_API_URL,
diff --git a/src/domains/community/components/post-info/PostInfo.tsx b/src/domains/community/components/post-info/PostInfo.tsx
index c2d3f87..e6dc048 100644
--- a/src/domains/community/components/post-info/PostInfo.tsx
+++ b/src/domains/community/components/post-info/PostInfo.tsx
@@ -17,7 +17,7 @@ function PostInfo({
 }: Props) {
   return (
     <ul
-      className="flex font-light sm:gap-3 gap-1 sm:text-sm text-xs text-gray"
+      className="flex font-light sm:gap-3 gap-1 sm:text-sm text-[10px] text-gray"
       aria-label="게시글 정보"
     >
       {hasUserName && (
diff --git a/src/domains/community/detail/DetailHeader.tsx b/src/domains/community/detail/DetailHeader.tsx
index 441bcd8..d28d2b9 100644
--- a/src/domains/community/detail/DetailHeader.tsx
+++ b/src/domains/community/detail/DetailHeader.tsx
@@ -2,7 +2,6 @@ import Label from '@/domains/shared/components/label/Label';
 import EditDelete from './EditDelete';
 import { useRouter } from 'next/navigation';
 import { useAuthStore } from '@/domains/shared/store/auth';
-import { useToast } from '@/shared/hook/useToast';
 import ConfirmModal from '@/shared/components/modal-pop/ConfirmModal';
 import { useState } from 'react';
 import { getApi } from '@/app/api/config/appConfig';
@@ -18,7 +17,6 @@ function DetailHeader({ categoryName, postId, userNickName }: Props) {
   const [deletePost, setDeletePost] = useState(false);
   const router = useRouter();
   const user = useAuthStore((state) => state.user);
-  const { toastError } = useToast();
 
   const handleConfirmDelete = async (postId: number | ParamValue) => {
     if (!user) {
@@ -28,7 +26,6 @@ function DetailHeader({ categoryName, postId, userNickName }: Props) {
 
     try {
       const res = await fetch(`${getApi}/posts/${postId}`, { method: 'DELETE' });
-      if (res.ok) console.log('deleted');
       router.push('/community');
     } catch (err) {
       console.error(err);
diff --git a/src/domains/community/detail/DetailPage.tsx b/src/domains/community/detail/DetailPage.tsx
index 42ad188..b1f6b4c 100644
--- a/src/domains/community/detail/DetailPage.tsx
+++ b/src/domains/community/detail/DetailPage.tsx
@@ -48,15 +48,26 @@ function DetailPage() {
 
   useEffect(() => {
     const fetchLikeStatus = async () => {
+      // 로그인 상태일 때만 좋아요 상태 조회
+      if (!isLoggedIn) {
+        setLike(false);
+        return;
+      }
+
       try {
         const liked = await getLikePost(postId);
         setLike(liked);
       } catch (err) {
         console.error('좋아요 상태 불러오기 실패', err);
+        setLike(false);
       }
     };
-    fetchLikeStatus();
-  }, [postId]);
+
+    // postId가 있을 때만 실행
+    if (postId) {
+      fetchLikeStatus();
+    }
+  }, [postId]); // isLoggedIn 의존성 제거하여 무한 루프 방지
 
   useEffect(() => {
     if (postDetail) {
diff --git a/src/domains/community/hook/useComment.ts b/src/domains/community/hook/useComment.ts
index e734002..fda4090 100644
--- a/src/domains/community/hook/useComment.ts
+++ b/src/domains/community/hook/useComment.ts
@@ -2,8 +2,8 @@ import { useState, useEffect, useCallback } from 'react';
 import { deleteComment, fetchComment, updateComment } from '../api/fetchComment';
 import { getApi } from '@/app/api/config/appConfig';
 import { CommentType } from '../types/post';
-import { User } from '@/domains/shared/store/auth';
 import { ParamValue } from 'next/dist/server/request/params';
+import { User } from '@/domains/shared/store/auth';
 
 export function useComments(postId: ParamValue, user: User | null) {
   const [comments, setComments] = useState<CommentType[] | null>(null);
@@ -19,11 +19,11 @@ export function useComments(postId: ParamValue, user: User | null) {
     if (!data) return;
     setComments(data);
     setIsEnd(false);
-  }, [postId]);
+  }, [postId, user]);
 
   useEffect(() => {
     fetchData();
-  }, [postId]);
+  }, [fetchData]);
 
   const handleUpdateComment = async (commentId: number, content: string) => {
     if (!user) {
@@ -78,7 +78,7 @@ export function useComments(postId: ParamValue, user: User | null) {
 
     setIsLoading(true);
     try {
-      const res = await fetch(`${getApi}/posts/${postId}/comments?lastId=${lastCommentId}`);
+      const res = await fetch(`${getApi}/posts/${postId}/comments?lastId=${lastCommentId}`, {});
       const newComments = await res.json();
 
       if (newComments.data.length === 0) {
diff --git a/src/domains/community/main/CommunityFilter.tsx b/src/domains/community/main/CommunityFilter.tsx
index 6887752..6fbe8ff 100644
--- a/src/domains/community/main/CommunityFilter.tsx
+++ b/src/domains/community/main/CommunityFilter.tsx
@@ -25,8 +25,6 @@ function CommunityFilter({ posts, setPosts }: Props) {
   const handleChange = async (selectTitle: string) => {
     if (!query) return;
 
-    console.log(selectTitle);
-
     const data = await fetchPostByTab({
       category: query,
       filter: sortMap[selectTitle as keyof typeof sortMap],
diff --git a/src/domains/community/write/CompleteBtn.tsx b/src/domains/community/write/CompleteBtn.tsx
index 9c7c913..2240d4f 100644
--- a/src/domains/community/write/CompleteBtn.tsx
+++ b/src/domains/community/write/CompleteBtn.tsx
@@ -3,20 +3,28 @@ import Button from '@/shared/components/button/Button';
 type Props = {
   mode: 'edit' | 'create';
   setEditDone: (value: boolean) => void;
+  isLoading?: boolean;
 };
 
-function CompleteBtn({ mode, setEditDone }: Props) {
+function CompleteBtn({ mode, setEditDone, isLoading = false }: Props) {
   return (
     <div className="w-full flex items-center justify-end mt-10">
       <Button
         type={mode === 'create' ? 'submit' : 'button'}
         size="default"
         color="default"
+        disabled={isLoading}
         onClick={async () => {
           setEditDone(true);
         }}
       >
-        {mode === 'create' ? '올리기' : '수정하기'}
+        {isLoading
+          ? mode === 'create'
+            ? '올리는 중...'
+            : '수정 중...'
+          : mode === 'create'
+            ? '올리기'
+            : '수정하기'}
       </Button>
     </div>
   );
diff --git a/src/domains/community/write/WriteSection.tsx b/src/domains/community/write/WriteSection.tsx
index 5e5dfe1..cdf447c 100644
--- a/src/domains/community/write/WriteSection.tsx
+++ b/src/domains/community/write/WriteSection.tsx
@@ -153,6 +153,7 @@ function WriteSection({ mode, postId }: Props) {
     payload.append('post', postBlob);
 
     try {
+      setIsLoading(true);
       const res = await fetch(`${getApi}/posts`, {
         method: 'POST',
         credentials: 'include',
@@ -161,10 +162,17 @@ function WriteSection({ mode, postId }: Props) {
 
       if (res.ok) {
         router.push('/community');
+      } else {
+        // 서버 에러 응답 처리
+        const errorData = await res.json().catch(() => ({}));
+        const errorMessage = errorData.message || `서버 오류가 발생했습니다. (${res.status})`;
+        toastError(errorMessage);
       }
     } catch (err) {
       console.error('글작성 폼 작성 에러', err);
-      return;
+      toastError('네트워크 오류가 발생했습니다. 다시 시도해주세요.');
+    } finally {
+      setIsLoading(false);
     }
   };
 
@@ -275,14 +283,14 @@ function WriteSection({ mode, postId }: Props) {
     e.preventDefault();
   };
 
-  if (isEditLoading) <Spinner />;
+  if (isEditLoading) return <Spinner />;
 
-  if (isLoading) <DetailSkeleton />;
+  if (isLoading) return <DetailSkeleton />;
 
   return (
     <>
       <form onSubmit={mode === 'create' ? handleSubmit : handleEditSubmit}>
-        <CompleteBtn mode={mode} setEditDone={setEditDone} />
+        <CompleteBtn mode={mode} setEditDone={setEditDone} isLoading={isLoading || isEditLoading} />
         <section>
           <FormTitle formData={formData} setFormData={setFormData} />
           <Category formData={formData} setFormData={setFormData} />
diff --git a/src/domains/community/write/image-upload/ImageInput.tsx b/src/domains/community/write/image-upload/ImageInput.tsx
index a0206e7..23d4893 100644
--- a/src/domains/community/write/image-upload/ImageInput.tsx
+++ b/src/domains/community/write/image-upload/ImageInput.tsx
@@ -16,7 +16,18 @@ function ImageInput({ uploadedFile, onAddImage }: Props) {
 
     const newFiles = Array.from(newFileList);
 
+    // 파일을 선택하지 않고 취소한 경우 조용히 리턴
+    if (newFiles.length === 0) return;
+
     try {
+      // 파일 크기 검증 (모바일 최적화)
+      const maxSize = 5 * 1024 * 1024; // 5MB
+      const oversizedFiles = newFiles.filter((file) => file.size > maxSize);
+      if (oversizedFiles.length > 0) {
+        toastError('파일 크기는 5MB 이하로 업로드해주세요.');
+        return;
+      }
+
       const totalLength = uploadedFile.length + newFiles.length;
       if (totalLength > 10) {
         toastError('최대 10개 파일까지 업로드할 수 있어요.');
@@ -49,7 +60,7 @@ function ImageInput({ uploadedFile, onAddImage }: Props) {
     <>
       <label
         htmlFor="fileInput"
-        className="border-3 border-dashed shrink-0 border-gray-light w-[100px] h-[100px] sm:w-[80px] sm:h-[80px] rounded-xl cursor-pointer bg-gray-dark flex flex-col gap-3 items-center justify-center hover:bg-gray-dark/70"
+        className="border-3 border-dashed shrink-0 border-gray-light w-[100px] h-[100px] sm:w-[80px] sm:h-[80px] rounded-xl cursor-pointer bg-gray-dark flex flex-col gap-3 items-center justify-center hover:bg-gray-dark/70 active:bg-gray-dark/50 touch-manipulation"
       >
         <ImageBox />
         <div className="flex items-center md:text-md text-sm">
@@ -61,8 +72,8 @@ function ImageInput({ uploadedFile, onAddImage }: Props) {
       <input
         type="file"
         id="fileInput"
-        hidden
-        accept="image/*"
+        className="sr-only"
+        accept="image/*,image/jpeg,image/jpg,image/png,image/webp"
         multiple
         onChange={handleInputChange}
       />
diff --git a/src/domains/community/write/image-upload/UploadedImage.tsx b/src/domains/community/write/image-upload/UploadedImage.tsx
index cf6662f..d982823 100644
--- a/src/domains/community/write/image-upload/UploadedImage.tsx
+++ b/src/domains/community/write/image-upload/UploadedImage.tsx
@@ -5,6 +5,7 @@ import DeleteIcon from '@/shared/assets/icons/close_20.svg';
 import React, { Dispatch, SetStateAction, useEffect, useRef } from 'react';
 import gsap from 'gsap';
 import { UploadedItem } from '@/domains/recipe/types/types';
+import { useToast } from '@/shared/hook/useToast';
 
 type Props = {
   uploadedFile: UploadedItem[];
@@ -14,6 +15,7 @@ type Props = {
 function UploadedImage({ uploadedFile, setUploadedFile }: Props) {
   const imageRefs = useRef<HTMLElement[]>([]);
   const prevLength = useRef(0);
+  const { toastError } = useToast();
 
   useEffect(() => {
     const isAdded = uploadedFile.length > prevLength.current;
@@ -71,6 +73,7 @@ function UploadedImage({ uploadedFile, setUploadedFile }: Props) {
                 onError={(e) => {
                   // 402 에러 등으로 이미지 로딩 실패 시 fallback 이미지 사용
                   e.currentTarget.src = '/CocktailDrop.webp';
+                  toastError('이미지가 너무 크거나 손상되어 기본 이미지로 대체됩니다.');
                 }}
               />
               <figcaption className="sr-only">업로드된 이미지입니다</figcaption>
diff --git a/src/domains/main/cocktailDrop/CocktailDrop.tsx b/src/domains/main/cocktailDrop/CocktailDrop.tsx
index 469b8b7..09d4da2 100644
--- a/src/domains/main/cocktailDrop/CocktailDrop.tsx
+++ b/src/domains/main/cocktailDrop/CocktailDrop.tsx
@@ -44,21 +44,6 @@ function CocktailDrop({ isDesktop = false }: CocktailDropProps) {
         }
       );
 
-      const cupElement = cupRef.current;
-      const logoElement = logoRef.current;
-
-      if (!cupElement || !logoElement) return;
-
-      const cupRect = cupElement.getBoundingClientRect();
-      const logoRect = logoElement.getBoundingClientRect();
-
-      // container 기준 상대 위치 계산
-      const containerTop = containerRef.current?.getBoundingClientRect().top || 0;
-      const cupTopRelative = cupRect.top - containerTop + 10;
-      console.log('containerTop', containerTop);
-      console.log('cupTopRelative', cupTopRelative);
-      console.log('logoRect.height', logoRect.height);
-
       const getFinalY = (width: number): number => {
         if (width >= 1800) return 200;
         if (width >= 1400) return 10;
@@ -70,7 +55,7 @@ function CocktailDrop({ isDesktop = false }: CocktailDropProps) {
 
       // 내부에서 사용
       const finalY = getFinalY(window.innerWidth);
-      console.log('finalY', finalY);
+
       gsap.fromTo(
         logoRef.current,
         { y: -300, opacity: 0 },
diff --git a/src/domains/recipe/components/details/BackBtn.tsx b/src/domains/recipe/components/details/BackBtn.tsx
index af3bc26..dc9d21e 100644
--- a/src/domains/recipe/components/details/BackBtn.tsx
+++ b/src/domains/recipe/components/details/BackBtn.tsx
@@ -9,10 +9,6 @@ function BackButton() {
   });
 
   const handleBack = () => {
-    console.log('뒤로가기 클릭');
-    console.log('저장된 스크롤:', sessionStorage.getItem('cocktail_list_scroll'));
-    console.log('저장된 URL:', sessionStorage.getItem('cocktail_list_scroll_url'));
-    console.log('복원 플래그:', sessionStorage.getItem('cocktail_list_scroll_restore'));
     restoreAndGoBack();
   };
 
diff --git a/src/domains/recipe/components/details/DetailsHeader.tsx b/src/domains/recipe/components/details/DetailsHeader.tsx
index 5c07fb7..96ccc60 100644
--- a/src/domains/recipe/components/details/DetailsHeader.tsx
+++ b/src/domains/recipe/components/details/DetailsHeader.tsx
@@ -20,7 +20,6 @@ function DetailsHeader({ id, favor }: { id: number; favor: boolean | undefined }
   const url = async () => {
     const res = await fetch(`${getApi}/cocktails/${id}/share`);
     const json = await res.json();
-    console.log(json.data);
     setMeta(json.data);
   };
 
diff --git a/src/domains/shared/components/comment/CommentHeader.tsx b/src/domains/shared/components/comment/CommentHeader.tsx
index 52d52f3..cfca1c3 100644
--- a/src/domains/shared/components/comment/CommentHeader.tsx
+++ b/src/domains/shared/components/comment/CommentHeader.tsx
@@ -61,7 +61,6 @@ function CommentHeader({
       intervalCall1000(async () => {
         const success = await createComment(newComment);
         if (!success) {
-          console.log('칵테일 페이지에서 댓글은 한개만 입력 가능합니다');
         }
       });
     }
diff --git a/src/domains/shared/components/profile/Profile.tsx b/src/domains/shared/components/profile/Profile.tsx
index 31a2e48..ea7b4bd 100644
--- a/src/domains/shared/components/profile/Profile.tsx
+++ b/src/domains/shared/components/profile/Profile.tsx
@@ -1,25 +1,20 @@
-import useFetchProfile from '@/domains/mypage/api/fetchProfile';
 import SsuryImage from '@/domains/mypage/main/SsuryImage';
-import { useEffect } from 'react';
+import { useAuthStore } from '@/domains/shared/store/auth';
 
 type Props = {
   userNickname: string;
 };
 
 function Profile({ userNickname }: Props) {
-  const { profile, fetchProfile } = useFetchProfile();
-  useEffect(() => {
-    fetchProfile();
-  }, [fetchProfile, profile?.data?.abvLevel]);
+  const user = useAuthStore((state) => state.user);
 
-  if (!profile?.data) return null;
-  const { abvLevel } = profile.data;
+  if (!user) return null;
 
   return (
     <div className="flex gap-2 items-center justify-start">
       <div className="w-8 h-8 flex items-center justify-center" aria-label="작성자 아이콘">
         <div className="w-8 flex items-center justify-center">
-          <SsuryImage abvLevel={abvLevel} />
+          <SsuryImage abvLevel={user.abv_degree || 5.0} />
         </div>
       </div>
       <span aria-label="작성자 이름" className="text-sm">