🚀 오픈챗 (OpenChat)

📋 프로젝트 소개

오픈챗은 개발자들이 채팅 기능을 빠르고 효율적으로 구현할 수 있도록 돕는 오픈소스 프로젝트입니다. 바이브코딩과 AI 기반 개발 도구를 활용하여 복잡한 채팅 시스템을 쉽게 구축할 수 있도록 전문 프롬프트, 실용적인 코드 예제, 그리고 상세한 문서를 제공합니다.

🛠️ 기술 스택

본 프로젝트에서는 Flutter와 Alpine.js로 예제 코드를 제공하지만, 각자의 프로젝트에 맞는 언어와 프레임워크를 선택하여 구현할 수 있습니다.

💡 핵심 기능

기본 채팅 기능

• 1:1 개인 채팅
• 그룹 채팅방
• 실시간 메시지 전송 및 수신
• 메시지 읽음 확인
• 사용자 온라인/오프라인 상태 표시
• 타이핑 인디케이터

미디어 및 파일

• 이미지, 동영상 전송
• 파일 첨부 기능
• 음성 메시지
• 썸네일 자동 생성

고급 기능

• 메시지 검색
• 푸시 알림
• 메시지 번역
• 이모지 리액션
• 메시지 스레드/답글
• 오프라인 지원 및 동기화

// Flutter 메시지 전송 예제
void sendMessage(String text) async {
  final message = Message(
    text: text,
    senderId: currentUser.id,
    roomId: currentRoom.id,
    timestamp: DateTime.now(),
  );

  await FirebaseDatabase.instance
    .ref('messages/${currentRoom.id}')
    .push()
    .set(message.toJson());
}

📚 문서

기본 개념 및 로직

• 채팅 기능 기본 개념과 로직

  채팅 기능의 핵심 개념, 실시간 통신, 메시지 처리 로직, 사용 언어 및 프레임워크 설명

Firebase 관련

• 파이어베이스 프로젝트 관리

  Firebase 프로젝트 생성 및 관리 방법

• Realtime Database 소개

  RTDB 선택 이유(비용 절감), 실시간 기능, 성능 최적화

• 사용자 관리

  회원가입, 로그인, 채팅 기능 연동

JavaScript 개발 설정

• JavaScript로 채팅 기능 개발을 위한 초기 설정

  Alpine.js, Bootstrap, Firebase JS SDK를 사용하여 웹 기반 채팅 애플리케이션을 구축하기 위한 초기 설정 방법과 기본 구조를 설명합니다

데이터베이스 및 API

• Firebase RTDB 데이터베이스 구조

  Firebase Realtime Database의 데이터 구조, 사용자/채팅방/메시지 저장 방식, 보안 규칙, 성능 최적화

• 데이터베이스 구조

  회원 정보, 채팅방, 메시지 저장 구조

• 데이터 타입

  Flutter와 JavaScript에서 사용하는 데이터 구조

• 푸시 알림 API

  푸시 알림 구현 및 API 사용법

• API 에러 코드

  API 호출 시 발생 가능한 에러 처리

Claude Code 연동

• Claude Code 에서 llms.txt 활용 가이드

  Claude Code 작업 공간에서 llms.txt 를 내려받아 프롬프트 맥락으로 활용하는 기본 절차를 안내합니다

🚀 시작하기

1. GitHub 저장소를 클론합니다
2. 필요한 문서를 참고하여 프로젝트 설정을 진행합니다
3. 제공된 예제 코드를 참고하여 채팅 기능을 구현합니다
4. 각자의 플랫폼과 요구사항에 맞게 커스터마이징합니다

// Alpine.js 실시간 메시지 수신 예제
Alpine.data('chat', () => ({
    messages: [],

    init() {
        // Firebase 실시간 리스너 설정
        firebase.database()
            .ref(`messages/${this.roomId}`)
            .on('child_added', (snapshot) => {
                this.messages.push(snapshot.val());
                this.scrollToBottom();
            });
    }
}))

🤝 기여하기

오픈챗은 오픈소스 프로젝트입니다. 여러분의 기여를 환영합니다!

• 버그 리포트 및 기능 제안
• 문서 개선
• 코드 예제 추가
• 다른 언어/프레임워크 지원

자세한 내용은 GitHub 저장소를 참고해주세요.