✨ 공유하기 링크 추가 및 오픈그래프 이미지 적용

index.html

@@ -11,6 +11,9 @@
       crossorigin
       href="https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard.min.css"
     />
+    <meta property="og:image" content="/og/intern_hasha_opengraph.png" />
+    <meta property="og:site_name" content="인턴하샤" />
+    <meta property="og:description" content="커피챗으로 구하는 스타트업 인턴" />
     <!-- Google tag (gtag.js) -->
     <script
       async

src/components/button/LinkCopyButton.tsx

@@ -0,0 +1,38 @@
+import { Copy } from 'lucide-react';
+import { toast } from 'sonner';
+
+import { Button } from '@/components/ui/button';
+
+export const LinkCopyButton = ({
+  companyName,
+  title,
+}: {
+  companyName: string;
+  title: string;
+}) => {
+  const handleCopyLink = () => {
+    const currentUrl = window.location.href;
+
+    // 가독성을 높인 복사 문구 생성
+    const copyText = [
+      `📢 인턴하샤에서 ${companyName}의 ${title} 모집 공고를 확인해보세요!`,
+      currentUrl,
+    ].join('\n');
+
+    navigator.clipboard
+      .writeText(copyText)
+      .then(() => {
+        toast('링크가 복사되었습니다.');
+      })
+      .catch(() => {
+        toast.error('링크 복사 중 오류가 발생했습니다.');
+      });
+  };
+
+  return (
+    <Button onClick={handleCopyLink} variant="outline">
+      <Copy size={16} />
+      <span>공유하기</span>
+    </Button>
+  );
+};

src/feature/post/ui/detail/PostDetailView.tsx

@@ -5,6 +5,7 @@ import { toast } from 'sonner';
 
 import { DownloadButtonWithPresignedUrl } from '@/components/button/DownloadButtonWithPresignedUrl';
 import { LinkButton } from '@/components/button/LinkButton';
+import { LinkCopyButton } from '@/components/button/LinkCopyButton';
 import { ClosePostModal } from '@/components/modal/ClosePostModal';
 import { SignInForBookmarkModal } from '@/components/modal/SignInForBookmarkModal';
 import { SignInForCoffeeChatModal } from '@/components/modal/SignInForCoffeChatModal';
@@ -182,16 +183,22 @@ export const PostDetailView = ({ postId }: { postId: string }) => {
           </div>
           <div className="flex flex-col flex-wrap gap-3 xs:flex-row md:flex-col">
             {role !== 'COMPANY' && (
-              <Button
-                onClick={() => {
-                  handleClickApplyCoffeeChat({ id: postId });
-                }}
-                disabled={coffeeChatStatus?.isSubmitted}
-              >
-                {(coffeeChatStatus?.isSubmitted ?? false)
-                  ? '커피챗 신청완료'
-                  : '커피챗 신청하기'}
-              </Button>
+              <>
+                <LinkCopyButton
+                  companyName={company.companyName}
+                  title={position.positionTitle}
+                />
+                <Button
+                  onClick={() => {
+                    handleClickApplyCoffeeChat({ id: postId });
+                  }}
+                  disabled={coffeeChatStatus?.isSubmitted}
+                >
+                  {(coffeeChatStatus?.isSubmitted ?? false)
+                    ? '커피챗 신청완료'
+                    : '커피챗 신청하기'}
+                </Button>
+              </>
             )}
             {author.id === userId && (
               <Button