그랜파 개발자의 프론트엔드 공부

store로 상태 관리Store(Pinia/Vuex)로 상태 관리하면 좋은 점은 다음과 같습니다.코드 구조가 정리됩니다. → props 없이 상태 공유 가능여러 컴포넌트에서 같은 데이터 쉽게 사용 가능 합니다.실시간 상태 업데이트가 편리 합니다.API 호출 최소화하여 성능을 최적화할 수 있습니다.디버깅과 유지보수가 용이합니다.나의 말:각종 상태를 store에서 관리하려고 해ChatGPT의 말:좋아! 상태 관리(store) 를 활용하면 사용자 정보, 채팅방 목록, 메시지 상태 등을 더 효율적으로 관리할 수 있어.Vue 3에서는 Vuex 대신 Pinia를 권장하니까 Pinia를 사용해보자.1. Pinia 설치 및 설정📌 1. Pinia 설치터미널에서 다음 명령어 실행npm install pinia📌 2...

VSignal - 1:1 채팅 UI 만들기채팅을 위한 UI를 만들어 봅시다.채팅을 하면 상대가 나의 말을 읽었는지 궁금합니다.상대가 메시지를 읽었는지 표시를 하고내가 메시지를 읽었다면 읽음 표시를 합니다.나의 말:메시지 읽음 표시, 1:1 채팅 UI를 추가하자. 이미지 업로드는 지금 필요없어.ChatGPT의 말:좋아! 이제 메시지 읽음 표시와 1:1 채팅 UI를 추가하자.1. 메시지 읽음 표시 기능채팅방에서 내가 마지막으로 읽은 메시지와 상대방이 읽은 메시지를 표시하도록 구현하자.📌 Firestore 구조 변경메시지 문서에 readBy 필드를 추가하여 읽은 사용자를 저장하자.{ "sender": "user@example.com", "message": "안녕하세요!", "timestamp": "20..