ThariqS/ai-newtab
Claude generates a daily new tab page based on your browser history.
TL;DR
AI Homepage는 새 탭 페이지를 사용자가 실제로 방문한 사이트의 AI 요약본으로 대체하는 Chrome 확장 프로그램입니다. 최근 방문한 최대 8개의 페이지를 읽고, 짧은 요약과 정리된 HTML을 (사용자의 Anthropic API 키를 통해) Claude에 전송하면, 모델이 사용자가 설명한 스타일에 맞춰 React 기반의 홈페이지를 생성합니다.
기능 설명
- 브라우징 기록 수집 – 상위 도메인, 방문 횟수 및 몇 가지 페이지 제목만 수집합니다.
- 관련 페이지 처리 – 가장 관련성 높은 페이지(최대 8개)를 백그라운드에서 열고, HTML을 추출하여 Anthropic Claude 에이전트에 전달합니다.
- Claude의 생성 작업 – Claude가 페이지를 읽고 헤드라인, 링크 및 요청한 기타 콘텐츠를 추출한 뒤, 새 탭 페이지가 될 단일 React 컴포넌트를 작성합니다.
- 매번 새로운 홈페이지 – 설정 패널에서 입력한 프롬프트에 따라 신문 스타일, 미니멀리스트 목록, 대시보드, 또는 녹색 텍스트의 터미널 스타일 등 새 탭을 열 때마다 새로운 홈페이지가 표시됩니다.
- 자동 재구축 – 기본적으로 6~48시간마다 또는 필요할 때마다 재구축되며, 항상 API 키와 연결된 새로운 에이전트 세션을 사용합니다.
이런 분들께 추천합니다
- 파워 유저:각 사이트를 일일이 열지 않고도 실제로 읽은 웹 콘텐츠의 개인화된 요약을 빠르게 확인하고 싶은 분.
- 개발자 / AI 애호가:브라우저 확장 프로그램 내에서 Claude Managed Agents를 실행하는 구체적인 예제에 관심이 있는 분.
- 개인정보 보호를 중시하는 분:데이터를 제3자 서버에 저장하지 않는 로컬 기반의 AI 도구를 선호하는 분 (브라우저를 떠나는 데이터는 Claude에 전송되는 최소한의 요약본뿐입니다).
작동 원리 – 주요 구성 요소
| 구성 요소 | 역할 |
|---|---|
| Chrome extension (MV3) | UI(새 탭 페이지, 설정 패널) 및 Chrome API (history, tabs)와 통신하는 백그라운드 워커. |
| Agent core (host-agnostic) | Claude Managed Agents를 호출하는 루프. getHistory와 getPageHtml이라는 두 가지 커스텀 도구 제공. |
| Claude Managed Agents | Anthropic의 샌드박스 내에서 LLM(Claude Sonnet/Haiku/Opus)을 실행하고, 스크래핑된 페이지를 파일로 받아 생성된 React 컴포넌트를 반환. |
| pnpm / WXT | React UI 및 확장 프로그램 패키징을 위한 빌드 시스템. |
| Bun harness | Chrome 외부에서 에이전트 코어를 로컬 테스트하기 위한 스크립트. |
데이터 흐름(README 설명 기준):
getHistory→ 도메인 랭킹 리스트.getPageHtml→ 최대 8개 페이지를 열고 HTML을 정리하여 파일로 마운트.- 에이전트가 해당 파일들에 대해
grep/read를 실행하여 콘텐츠 추출. - 에이전트가 React 컴포넌트를
write하고, 확장 프로그램이 이를 렌더링.
실행 요구 사항
- Chrome 또는 Chromium 기반 브라우저.
- Node 20+ (저장소는 패키지 관리에 pnpm 10.11.1 사용).
- Anthropic API 키 (사용자가 직접 제공해야 하며, 확장 프로그램 자체에는 키가 포함되어 있지 않습니다).
설치 단계: 저장소를 클론하고 pnpm install && pnpm build를 실행한 뒤, 생성된 apps/extension/.output/chrome-mv3 폴더를 압축 해제된 확장 프로그램으로 로드합니다.
제한 사항 및 주의 사항
- 비용 – 재구축할 때마다 Claude API 호출 비용이 발생하며, 비용은 모델과 전송되는 페이지 콘텐츠 양에 따라 달라집니다.
- 개인정보 – 확장 프로그램은 요약본과 최대 8개의 페이지만 전송하지만, 해당 페이지들은 Anthropic으로 전송됩니다. README는 API 키가 로컬 저장소에만 보관되며 각 세션은 빌드 후 삭제됨을 강조합니다.
- 실험적 – 이 프로젝트는 "초기 단계의 실험적 프로젝트"로, Chrome 웹 스토어에 그대로 게시할 용도가 아닙니다.
- 서버 사이드 없음 – 모든 작업이 브라우저 내에서 실행되므로, API 키를 분실하거나 확장 프로그램을 삭제하면 재구축 기능을 사용할 수 없습니다.
- 콘텐츠 소스 제한 – 검색 엔진, 웹 메일, 은행 사이트, 로그인 후의 마케팅 페이지는 의도적으로 제외되었습니다.
빠른 시작 체크리스트
git clone https://github.com/ThariqS/ai-newtab.git && cd ai-newtabpnpm install && pnpm build- Chrome에서 압축 해제된 확장 프로그램을 로드합니다.
- 새 탭을 열고 Anthropic API 키를 붙여넣은 뒤 Build today's homepage를 클릭합니다.
- 설정에서 프롬프트를 조정하여 원하는 레이아웃을 얻습니다.
라이선스
MIT – 포크, 수정 및 개인적인 용도로 사용할 수 있습니다.
위의 모든 정보는 저장소의 README에서 직접 가져온 것이며, 외부적인 가정은 추가되지 않았습니다.
관련
- 프로젝트
- 프로젝트
- 프로젝트
- 프로젝트