linkat

어느 웹페이지에서든 픽셀 고양이가 따라다니며 링크를 1클릭으로 저장해주는 크롬 익스텐션 + 웹앱

→ linkat-kappa.vercel.app

---

주요 기능

• 크롬 익스텐션: 모든 웹페이지에 픽셀 고양이 상주, 클릭 또는 Alt+S로 즉시 저장
• 자동 메타데이터 수집: 페이지 제목, OG 이미지, 파비콘, 스크롤 위치
• 폴더 분류: 링크 저장 시 폴더 지정, 컬렉션별 필터링
• 링크 보관함: 검색, 메모, 읽음 표시, 그리드/리스트 뷰
• Google OAuth: 기기 간 링크 동기화

---

기술 스택

레이어	기술
프론트엔드	Next.js 15 (App Router), React 19, TypeScript
백엔드	Next.js API Routes (서버리스)
DB / Auth	Supabase (PostgreSQL + GoTrue)
배포	Vercel
크롬 익스텐션	Manifest V3, 바닐라 JS

---

로컬 개발

npm install

# 로컬 DB 시작 (Docker 필요)
npm run db:start
# → 출력된 anon key / service_role key를 .env.local에 입력

npm run dev

환경변수 (.env.local)

NEXT_PUBLIC_APP_URL=http://localhost:3000
NEXT_PUBLIC_SUPABASE_URL=http://127.0.0.1:54321
NEXT_PUBLIC_SUPABASE_ANON_KEY=<db:start 출력값>
SUPABASE_SERVICE_ROLE_KEY=<db:start 출력값>

DB 명령어

명령어	설명
npm run db:start	로컬 Supabase 시작
npm run db:stop	종료
npm run db:reset	초기화 (마이그레이션 재실행)
npm run db:status	상태 확인

---

크롬 익스텐션 설치

Chrome Web Store 심사 중. 그 전까지는 개발자 모드로 직접 설치:

1. chrome-extension/ 폴더를 ZIP으로 압축
2. chrome://extensions → 개발자 모드 ON
3. "압축 해제된 확장 프로그램 로드" → 폴더 선택

---

설계 문서

아키텍처, DB 스키마, API 설계 → DESIGN.md

버전

현재: 0.1.6 · CHANGELOG.md