내일배움캠프 TIL93 2024-01-15 본 캠프 72일차 / 91일차 TIL (realtime chat) 2024-01-12 본 캠프 71일차 / 90일차 TIL (realtime chat) 주요 진행사항 - real time chat 구성 supabase realtime 이용 chat 만들기 (2) 이전 내용 참고 2024-01-12 본 캠프 71일차 / 90일차 TIL (realtime chat(1)) 2024-01-12 본 캠프 71일차 / 90일차 TIL (realtime chat) 주요 진행사항 - real time chat 구성 supabase realtime 이용 chat 만들기 (1) 1. supabase dm 테이블 구성 dm_channels: 모든 dm 채널을 관리하는 table, supabase realtime 적 audtjqxx.tistory.com 위 로직을 통해 변경된 state에 .. 2024. 1. 16. 2024-01-12 본 캠프 71일차 / 90일차 TIL (realtime chat(1)) 2024-01-12 본 캠프 71일차 / 90일차 TIL (realtime chat) 주요 진행사항 - real time chat 구성 supabase realtime 이용 chat 만들기 (1) 1. supabase dm 테이블 구성 dm_channels: 모든 dm 채널을 관리하는 table, supabase realtime 적용, space 단위로 filter를 적용시키기 위해 space_id 속성을 가지고 있음. dm_messages: 모든 dm 메시지 정보를 담는 테이블, dm_id와 dm_channels가 매칭되는 항목으로 각 dm 채널마다 메시지를 가져옴. 2. 나에게 오는 모든 메시지 받기 채널의 모든 메시지 구독 useEffect(() => { const dmChannel = supaba.. 2024. 1. 15. 2024-01-11 본 캠프 70일차 / 89일차 TIL (supabase rpc 함수 및 realtime table) 2024-01-11 본 캠프 70일차 / 89일차 TIL (supabase rpc 함수 및 realtime table) 주요 진행사항 : - supabase rpc 함수 제작 - supabase realtime table 검증 예정사항 - realtime chat 테스트 supabase rpc 함수 제작 dm을 구현하기 위해서 api 호출을 통해 supabase 테이블에 접근해야한다. 유저당 스페이스 별 dm 채널을 가져오기 위해서 1차로 user가 접속한 space를 확인하고 2차로 해당 space 내부의 dm 채널 중에서 나의 dm채널만을 확인해야하는 번거로움이 있었다. 이러한 문제는 api 호출을 이후 클라이언트에서의 로직으로 해당 유저의 dm채널을 가져와야하는 문제가 발생되었다. 나는 애초에 ap.. 2024. 1. 12. 2024-01-10 본 캠프 69일차 / 88일차 TIL (next.js useRouter 동적 라우팅) 2024-01-10 본 캠프 69일차 / 88일차 TIL (next.js useRouter 동적 라우팅) 주요 진행사항 : - next.js pages router 동적 라우팅 - db 구조 잡기 예정사항 - realtime chat 테스트 DB 구조 잡기 DM 서버를 위한 DB를 구성하였다. dm_channels는 dm channel의 정보를 담고있는 테이블이며 포함된 space의 정보를 담고있는 space_id와 1대1 채팅방의 유저정보를 담는 user, other_user 의 속성을 담고있다. dm_messages는 dm_channels의 id를 왜래키로 가지고 있으며 모든 dm의 내용을 담고있는 테이블이다. 보낸 시간인 created_at, 받는사람 id인 receiver_id, 보내는 사람 id.. 2024. 1. 11. 2024-01-09 본 캠프 68일차 / 87일차 TIL (로그인 로직 구현 with supabase) 2024-01-09 본 캠프 68일차 / 87일차 TIL 주요 진행사항 - 로그인 로직 구현 완료 예정 진행사항 - realtime chat 구성 (room별 전체 채팅) 로그인 로직 구현 1. 테이블 구성 supabase의 auth를 사용할 때 oAuth와 일반로그인 간 저장되는 데이터가 다르기 때문에 별도의 auth 테이블을 구성한다. id, created_at, email, display_name의 속성들로 구성하였다. 2. trigger 함수 auth 정보가 생성될 때 마다 테이블의 row도 추가되야하기 때문에 trigger를 구성한다. 이전 게시글에서 만든 trigger함수를 참고하면 되겠다. 2024-01-05 본 캠프 66일차 / 85일차 TIL (auth trigger 함수 구현 및 yar.. 2024. 1. 10. 2024-01-08 본 캠프 67일차 / 86일차 TIL (next.js pages router styled-components setting) 2024-01-08 본 캠프 65일차 / 85일차 TIL 주요진행사항 - 최종프로젝트 2차 스크럼 (디자이너님과) - styled components 세팅 최종프로젝트 2차 스크럼 프로젝트 구조 구체화 1. 홈 (헤더 레이아웃) - 로그인/ 회원가입 모달 창 토글 - 로그인 시 대시보드로 이동 - 로그인 시 대시보드 버튼 조건부 생성 2. 대시보드 (헤더 레이아웃) - 스페이스 생성 (프리셋 2~3개) 모달 - 현재 유저가 참여한 모든 스페이스 리스트화(초대링크(복사버튼)) - 각 스페이스 마다 유저 정보 수정 (이름 수정), 나가기, 모달 , 스페이스 입장은 따로 3. 스페이스 - 메뉴(스페이스나가기, 토글 버튼, 키 설명) - 하단 바, 영상/화상/마이크/채팅 - 우측 카드 리스트 (화상/화면공유) .. 2024. 1. 9. 이전 1 2 3 4 5 ··· 16 다음
