import React, { useState } from "react"; import { Loader2, Globe, ArrowUpRight, RefreshCcw } from 'lucide-react'; const CATEGORIES = [ { key: "종합", label: "종합" }, { key: "정치", label: "정치" }, { key: "경제", label: "경제" }, { key: "기술", label: "기술" }, { key: "스포츠", label: "스포츠" }, { key: "연예", label: "연예" }, { key: "건강", label: "건강" }, { key: "과학", label: "과학" }, ]; export default function App() { const [category, setCategory] = useState("종합"); const { data, loading, error, refetch, fetchedAt } = useData("news", { q: category + " 한국", lang: "ko" }); const articles = data?.articles ?? []; return (

{CATEGORIES.map(cat => ( ))} {loading && (

뉴스를 불러오는 중...

)} {error && (

뉴스를 불러올 수 없습니다

}>다시 시도

)} {!loading && !error && articles.length === 0 && ( )} {!loading && !error && articles.slice(0, 10).map((article, i) => (

{article.title}

{article.description || ""}

{article.source} · {article.publishedAt ? new Date(article.publishedAt).toLocaleDateString("ko-KR", { month: "short", day: "numeric" }) : ""}

{article.image && (

)} ))}

{fetchedAt ? fetchedAt.toLocaleTimeString("ko-KR", { hour: "2-digit", minute: "2-digit" }) + " 기준" : ""}

); }