지금 이 사이트에 접속한 사람들과 실시간으로 대화하는 Chrome 사이드패널 확장프로그램
별도 가입 없이, 같은 사이트를 보고 있는 방문자들끼리 바로 연결됩니다. 모든 메시지는 시간이 지나면 저절로 사라집니다.
- 자동 방 생성 — 접속한 사이트 hostname이 채팅방이 됨
- 메시지 자동 소멸 — 전송 후 10초부터 페이드아웃, 30초에 완전 삭제
- 드래그 앤 드롭 — 웹페이지 텍스트 또는 로컬 이미지를 채팅창에 드래그하면 바로 전송
- 이미지 전송 — 500KB 이하 이미지 파일 전송 가능
- 방 고정 — 특정 사이트 채팅방을 고정해두면 탭 이동 후에도 유지
- 사이트 테마 — 접속 사이트마다 고유한 컬러 테마 자동 적용
- 멀티라인 입력 — Shift+Enter로 줄바꿈, Enter로 전송
webtalk/
ext/ Chrome Extension (React + TypeScript + Tailwind CSS)
server/ Node.js + Socket.io WebSocket 서버 (Railway 배포)
cd server
cp .env.example .env
npm install
npm run dev # nodemon 개발 모드
npm start # 운영 모드cd ext
npm install
npm run build # dist/ 폴더로 빌드Chrome → chrome://extensions → 개발자 모드 ON → "압축해제된 확장 프로그램 로드" → ext/dist/ 선택
| 항목 | 내용 |
|---|---|
| 플랫폼 | Railway |
| URL | https://shaut-production.up.railway.app |
| 통신 | Socket.io (WebSocket) |
| 메시지 TTL | 60초 (서버 자동 삭제) |
| 히스토리 | 방당 최대 50개 인메모리 캐시 |
Extension — React, TypeScript, Tailwind CSS, Zustand, Webpack Server — Node.js, Express, Socket.io