Build a Full Stack Chat App using Socket.io & Expo Router #13 - Messages
- 백엔드에서 새로운 메시지 이벤트를 생성하고, 프론트엔드로부터 받은 데이터를 콘솔에 기록합니다. 📝
- 에러 발생 시, 에러 메시지를 콘솔에 로깅하고, 메시지 생성 실패를 알립니다. ⚠️
- 메시지 모델을 사용하여 새 메시지를 생성하고, conversation ID, sender ID, content, attachment 등의 속성을 설정합니다. 🗂️
- 메시지가 생성되면, 해당 대화에 참여한 모든 사용자에게 새로운 메시지 이벤트를 전송합니다. 📢
- 메시지 전송 성공 시, 메시지 ID, 내용, 보낸 사람 정보, 첨부 파일, 생성 시간, conversation ID를 포함한 새로운 메시지 데이터를 준비합니다. 📦
- 대화 모델을 사용하여 conversation ID를 업데이트하고, 마지막 메시지 속성을 업데이트하여 채팅 목록에 최신 메시지가 표시되도록 합니다. 갱신 🔄
- 프론트엔드에서 새로운 메시지 이벤트를 등록하고, 컴포넌트가 언마운트될 때 이벤트 리스너를 제거합니다. 👂
- 메시지 전송 함수에서 새로운 메시지 API를 호출하고, conversation ID, 보낸 사람 정보, 내용, 첨부 파일 등의 데이터를 백엔드로 전송합니다. 📤
- 메시지 전송 후, 메시지 입력 필드를 비우고 선택된 파일을 초기화합니다. 🧹
- 백엔드에서 메시지 내역을 가져오는 새로운 이벤트를 정의하고, conversation ID를 기반으로 메시지를 검색합니다. 🔍
- 메시지를 내림차순으로 정렬하고, 보낸 사람 데이터를 채워 각 메시지에 보낸 사람 객체 정보가 포함되도록 합니다. 👤
- 프론트엔드에서 메시지 내역을 가져오는 이벤트를 등록하고, 응답으로 받은 메시지 데이터를 상태에 저장합니다. 💾
- 현재 사용자 ID와 메시지 보낸 사람 ID를 비교하여 메시지가 자신의 것인지 확인하고, UI를 적절히 조정합니다. ↔️
- MongoDB에서 불필요한 데이터를 제거하기 위해 lean() 함수를 사용하여 데이터를 JavaScript 객체로 변환합니다. ⚙️
- Moment 라이브러리를 사용하여 메시지 날짜 형식을 사용자 친화적으로 변경합니다. ⏰
- 새로운 메시지를 받으면, 해당 메시지를 메시지 목록에 추가하여 실시간으로 메시지가 업데이트되도록 합니다. ➕
- 소켓을 사용하여 메시지를 빠르게 주고받을 수 있도록 구현합니다. 🚀