npx create-next-app@latest my-camp-log --typescript --tailwind --app
cd my-camp-log
npm install @supabase/supabase-js @supabase/ssr
npm install @radix-ui/react-*
npm install lucide-react

// src/lib/actions/camping.ts
const API_BASE_URL = "http://apis.data.go.kr/B551011/GoCamping";

export async function fetchCampingList(keyword: string): Promise<CampingItem[]> {
  const apiKey = process.env.GO_CAMPING_API_KEY;
  if (!apiKey) {
    console.error("GO_CAMPING_API_KEY is not configured");
    return [];
  }

  const params = new URLSearchParams({
    serviceKey: apiKey,
    numOfRows: "10",
    pageNo: "1",
    MobileOS: "ETC",
    MobileApp: "MyCampLog",
    _type: "json",
    ...(keyword.trim() && { keyword: keyword.trim() }),
  });

  const url = `${API_BASE_URL}/searchList?${params.toString()}`;
  
  const res = await fetch(url, { next: { revalidate: 3600 } });
  const data = await res.json();
  
  return parseApiItems(data);
}

// src/types/camping.ts
export interface CampingItem {
  contentId?: string;
  facltNm: string; // 캠핑장 이름
  lineIntro?: string; // 한줄소개
  addr1: string; // 주소
  firstImageUrl?: string; // 대표이미지
  tel?: string; // 전화번호
  homepage?: string; // 홈페이지
  induty?: string; // 업종
  mapX?: string; // 경도
  mapY?: string; // 위도
}

// src/components/auth/kakao-button.tsx
export function KakaoButton() {
  const [isLoading, setIsLoading] = useState(false);
  const supabase = createClient();

  const handleKakaoLogin = async () => {
    setIsLoading(true);
    try {
      const { error } = await supabase.auth.signInWithOAuth({
        provider: "kakao",
        options: {
          redirectTo: `${window.location.origin}/auth/callback`,
          queryParams: {
            scope: "profile_nickname, profile_image, account_email",
          },
        },
      });
    } catch (err) {
      console.error("Kakao login error:", err);
    }
  };

  return (
    <button
      onClick={handleKakaoLogin}
      className="w-full h-12 rounded-lg font-semibold text-[#191919] bg-[#FEE500] hover:bg-[#FDD835]"
    >
      <span>카카오로 3초 만에 시작하기</span>
    </button>
  );
}

// src/app/auth/callback/route.ts
export async function GET(request: Request) {
  const requestUrl = new URL(request.url);
  const code = requestUrl.searchParams.get("code");
  const next = requestUrl.searchParams.get("next") || "/dashboard";

  if (code) {
    const supabase = await createClient();
    const { error } = await supabase.auth.exchangeCodeForSession(code);

    if (!error) {
      return NextResponse.redirect(new URL(next, request.url));
    }
  }

  return NextResponse.redirect(new URL("/login?error=auth-code-error", request.url));
}

-- saved_campsites 테이블
CREATE TABLE saved_campsites (
  id UUID DEFAULT gen_random_uuid() PRIMARY KEY,
  user_id UUID REFERENCES auth.users(id),
  camp_id VARCHAR(255) NOT NULL,
  camp_name VARCHAR(255) NOT NULL,
  address TEXT,
  content TEXT,
  image_url TEXT,
  is_public BOOLEAN DEFAULT false,
  visited_date DATE,
  created_at TIMESTAMP DEFAULT NOW(),
  updated_at TIMESTAMP DEFAULT NOW()
);

// Next.js의 캐싱 활용
const res = await fetch(url, { 
  next: { revalidate: 3600 } // 1시간 캐싱
});

try {
  const data = await fetchCampingList(keyword);
  setCampingSites(data);
} catch (error) {
  toast.error("캠핑장 정보를 불러오는데 실패했습니다.");
}

const [isLoading, setIsLoading] = useState(false);

const handleSearch = async () => {
  setIsLoading(true);
  try {
    const results = await fetchCampingList(keyword);
    setCampingSites(results);
  } finally {
    setIsLoading(false);
  }
};

# .env.local
NEXT_PUBLIC_SUPABASE_URL=your_supabase_url
NEXT_PUBLIC_SUPABASE_ANON_KEY=your_supabase_anon_key
GO_CAMPING_API_KEY=your_go_camping_api_key

npm run build
vercel --prod