유챗으로 무엇을 만들 수 있나

유챗 채팅방은 설치 코드 두 줄로 내 사이트에 붙고, 그 위에 페이지 스크립트·스킨 UI API·서버 API로 기능을 더할 수 있어요. 이 문서는 세 방법이 각각 무엇을 하는지와 언제 어느 것을 고르는지 정리해요.

출발점: 설치 코드

모든 기능은 채팅방을 페이지에 붙이는 데서 시작해요. uchat.js를 한 번 불러오고 <u-chat room="my-room"> 태그를 두면 그 자리에 채팅방이 열려요. → 5분 설치

내 사이트 회원의 닉네임·권한을 채팅방에서 그대로 쓰려면 회원 연동을 더해요. → 회원 연동

확장 방법 세 가지

방법	어디서 실행	하는 일	정본
페이지 스크립트	내 페이지의 자바스크립트	U.chat()으로 채팅방 객체(room)를 받고 입장·메시지 같은 이벤트에 반응하거나, 메시지 보내기·명령 실행·안내 줄 띄우기를 해요	U.chat()과 room 객체, 이벤트
스킨 UI API	내 페이지의 자바스크립트(기본 스킨 안에 그려짐)	기본 스킨(basic-v2)에 메뉴 버튼, 닉네임 메뉴 항목, 대화상자, 대화 위·아래 영역, 겹치는 영역, 닉네임·메시지 꾸미기를 더해요	스킨 UI API
서버 API	내 서버	REST 요청으로 채팅방 접속자 통계를 읽거나, 채팅방 채널로 데이터를 보내요	서버 REST API

페이지 스크립트와 스킨 UI API는 같은 room 객체에서 시작해요. 스킨 UI API는 room.skin에 들어 있으므로, 페이지 스크립트를 쓸 줄 알면 바로 이어서 쓸 수 있어요.

채널: 실시간 데이터

채널은 같은 채팅방에 있는 사람들끼리, 또는 내 서버와 채팅방 사이에 채팅 메시지가 아닌 데이터를 주고받는 통로예요. 페이지 스크립트에서 room.plugin.add('채널이름')으로 열고, 서버에서는 서버 API로 같은 채널에 보내요.

• 사용자끼리: 함께 보기, 게임, 투표처럼 모두의 화면을 맞춰야 할 때 → 실시간 데이터 주고받기
• 서버에서 채팅방으로: 결제·주문·방송 시작 같은 사이트의 일을 채팅방에 알릴 때 → 서버에서 채팅방으로 알림 보내기

전송 한도와 저장 크기는 채널 API와 한도에 있어요.

무엇을 고를까

하고 싶은 일	고를 방법	시작 문서
입장한 사람에게 인사, 특정 단어가 오면 페이지에서 반응	페이지 스크립트(이벤트)	첫 스크립트
보내는 메시지를 고치거나 막기	페이지 스크립트(before. 이벤트)	이벤트
한 페이지에 채팅방 여러 개, SPA에서 붙였다 떼기	페이지 스크립트	비동기 로딩과 여러 채팅방
채팅방 안에 버튼·입력 창·배너 넣기	스킨 UI API	스킨 UI 확장하기
관리자 닉네임 강조, 특정 메시지 배경색	스킨 UI API(resolver)	닉네임·메시지 꾸미기
접속자끼리 같은 영상·게임 상태 맞추기	채널	실시간 데이터 주고받기
사이트에서 일어난 일을 채팅방에 알리기	서버 API + 채널	서버에서 채팅방으로 알림 보내기
사이트에 지금 접속자 수 보여 주기	서버 API	서버 REST API

여러 방법을 섞어 쓰는 경우가 많아요. 예를 들어 결제 완료 알림은 서버 API로 보내고, 페이지 스크립트의 채널로 받아 채팅방에 표시해요.

다음 단계

1. 5분 설치로 채팅방을 붙여요.
2. 첫 스크립트로 이벤트를 받아 봐요.
3. 만들려는 기능에 맞는 가이드를 읽고, 세부 값은 레퍼런스에서 찾아요. 완성된 코드는 예제에 있어요.

공개 전에는 보안 체크리스트를 확인하세요.