alkahest-toolbar
실행 중인 제품에 붙이는 이슈 제보 툴바입니다. 팀원이 보던 페이지에서 바로 Alkahest 이슈를 남깁니다. 의존성 없는 약 10 kB 스크립트이고, 일반 방문자에게는 보이지 않습니다.
주요 기능
보던 페이지에서 바로 제보
제목과 내용만 쓰면 됩니다. 현재 라우트가 이슈의 대상이 되고, 전체 URL과 브라우저 정보는 자동으로 붙습니다.
팀 전용
스니펫은 모든 방문자에게 배포되지만, 팀원이 Alkahest 계정으로 로그인해야만 보입니다. 일반 방문자에게는 아무것도 보이지 않아 운영 환경에 넣어도 안전합니다.
권한이 제한된 토큰
로그인은 alkahest.app의 동의 화면을 거칩니다. 토큰은 이슈 생성과 맵 목록 조회만 할 수 있고, 계정에서 언제든 취소할 수 있습니다. 페이지 소스에는 공개된 프로젝트 슬러그만 들어갑니다.
약 10 kB, 의존성 없음
프레임워크 없이 TypeScript로 만들었습니다. 스스로 초기화되는 스크립트 태그 한 줄을 넣거나, npm에서 ESM 빌드를 가져다 씁니다.
Shadow DOM으로 격리
사이트의 CSS가 툴바에 들어오지 않고, 툴바의 CSS도 밖으로 새지 않습니다. 라이트·다크 모드는 방문자의 OS가 아니라 사이트의 테마를 따릅니다.
모바일 우선
버튼을 좌우 가장자리로 끌어다 두면 그 자리에 남습니다. 휴대폰에서는 패널이 화면을 가득 채우고, 버튼을 ✕ 위에 놓으면 툴바가 꺼집니다.
기술 스택
TypeScript
Language
Shadow DOM
Isolation
IIFE + ESM
Builds
npm
Distribution
프로젝트 정보
플랫폼
Web (any site)
카테고리
Developer Tools
지원 언어
EN
관련 프로젝트
Alkahest
코드를 정적 분석해 화면 단위 제품 지도를 만드는 서비스입니다. 화면, 화면 사이의 이동, 각 화면이 부르는 API를 그래프로 보여주고, 코딩 에이전트와 이슈·노트를 함께 다룹니다.
alkahest-cli
Alkahest의 오픈소스 CLI입니다. Next.js부터 SwiftUI, Flutter까지 어댑터로 코드를 스캔해 제품 지도를 만들고, MCP 서버로 코딩 에이전트에 제공합니다. API 키가 필요 없습니다.
owlcode
텔레그램으로 원격 Claude Code를 조작하는 CLI 봇입니다. 어디서든 휴대폰으로 코딩 작업을 지시하고 결과를 받아볼 수 있습니다.
제품에 붙여 보세요
프로젝트 슬러그를 넣은 스크립트 태그 한 줄을 추가하거나, npm에서 @cr8rcho/alkahest-toolbar를 설치하세요. MIT 라이선스로 GitHub에 공개돼 있습니다.