feat(community) : public 상태 리포지토리 조회 프론트 작성

Author: Plectranthus

front/.idea/.gitignore

@@ -1,14 +1,12 @@
 // 커뮤니티 사용자 분석 결과 상세 페이지, 댓글 기능 있어야 하는 곳
-"use client"
-
-import { useCommunity } from "@/hooks/community/useCommunity"
-import RepoList from "@/components/community/RepoList"
-
-export default function CommunityPage() {
-  const { repos, loading, error } = useCommunity()
-
-  if (loading) return <div>Loading...</div>
-  if (error) return <div>에러가 발생했습니다 😢</div>
-
-  return <RepoList repos={repos} />
-}
+import RepositoryList from '@/components/community/RepoList';
+
+export default function HomePage() {
+  return (
+    <main className="max-w-3xl mx-auto p-6">
+      <h1 className="text-3xl font-bold mb-2 text-blue-600">Portfol.ioQ</h1>
+      <p className="text-gray-500 text-sm mb-6">커뮤니티 레포지토리 피드</p>
+      <RepositoryList />
+    </main>
+  );
+}

front/.idea/front.iml

@@ -0,0 +1,72 @@
+'use client';
+
+import type { RepositoryItem } from '@/types/community';
+
+export default function RepositoryCard({ item }: { item: RepositoryItem }) {
+  return (
+    <article className="bg-white border border-gray-200 rounded-2xl shadow-sm p-5 hover:shadow-md transition-all duration-200">
+      {/* 사용자 정보 */}
+      <div className="flex items-center mb-3">
+        {item.userImage ? (
+          <img
+            src={item.userImage}
+            alt={item.userName}
+            className="w-10 h-10 rounded-full mr-3"
+          />
+        ) : (
+          <div className="w-10 h-10 rounded-full bg-gray-200 flex items-center justify-center text-gray-600 font-bold mr-3">
+            {item.userName.charAt(0).toUpperCase()}
+          </div>
+        )}
+        <div>
+          <p className="font-semibold text-sm">{item.userName}</p>
+          <p className="text-gray-500 text-xs">@{item.userName.toLowerCase()}</p>
+        </div>
+        <span className="ml-auto text-gray-400 text-xs">2시간 전</span>
+      </div>
+
+      {/* 레포지토리 링크 */}
+      <a
+        href="#"
+        className="text-blue-600 font-semibold text-sm hover:underline"
+      >
+        {item.userName}/{item.repositoryName}
+      </a>
+
+      {/* 요약 */}
+      <p className="mt-2 text-gray-700 text-sm leading-relaxed">
+        {item.summary}
+      </p>
+
+      {/* 점수 */}
+      <div className="bg-gray-50 mt-4 p-3 rounded-xl border">
+        <p className="text-xs text-gray-500 mb-1 font-medium">Overall Score</p>
+        <p className="text-green-600 font-bold text-2xl">{item.totalScore}</p>
+      </div>
+
+      {/* 언어 태그 */}
+      <div className="mt-3 flex flex-wrap gap-2">
+        {item.language.map((lang, idx) => (
+          <span
+            key={idx}
+            className="text-xs bg-gray-100 text-gray-800 px-2 py-1 rounded-full font-medium"
+          >
+            {lang}
+          </span>
+        ))}
+      </div>
+
+      {/* 하단 */}
+      <div className="flex justify-between items-center mt-4 text-gray-500 text-sm">
+        <div className="flex gap-4">
+          <span>❤️ 128</span>
+          <span>💬 24</span>
+          <span>🔗 Share</span>
+        </div>
+        <button className="border px-3 py-1 rounded-full text-xs font-semibold hover:bg-gray-100">
+          View Analysis
+        </button>
+      </div>
+    </article>
+  );
+}

front/.idea/inspectionProfiles/Project_Default.xml

@@ -0,0 +1,19 @@
+'use client';
+
+import { useRepositories } from '@/hooks/community/useCommunity';
+import RepositoryCard from './RepoCard';
+
+export default function RepositoryList() {
+  const { data, loading, error } = useRepositories();
+
+  if (loading) return <p>로딩 중...</p>;
+  if (error) return <p className="text-red-500">에러 발생: {error}</p>;
+
+  return (
+    <section className="flex flex-col gap-6 mt-6">
+      {data.map((item, i) => (
+        <RepositoryCard key={i} item={item} />
+      ))}
+    </section>
+  );
+}