본문 바로가기

전체 글143

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.
2024-01-05 본 캠프 66일차 / 85일차 TIL (auth trigger 함수 구현 및 yarn run dev 시 문제 발생) 2024-01-05 본 캠프 65일차 / 85일차 TIL 주요진행사항 - supabase 로그인 로직 구현 (trigger) - react-hook-form 이용 supabase 로그인 로직 구현 (trigger) trigger 함수를 통해 supabase auth에 유저를 생성 하면, 추가 정보를 담은 row를 users table에 추가하는 로직을 구성하였다. trigger 함수를 구성하기 위해 다음과 같이 eql 명령어를 만들었다. create or replace function public.handle_new_user () returns trigger set search_path = public as $$ BEGIN IF new.raw_app_meta_data->>'provider' = 'emai.. 2024. 1. 8.
2024-01-04 본 캠프 65일차 / 84일차 TIL 2024-01-04 본 캠프 65일차 / 84일차 TIL 주요 진행 사항 - 최종프로젝트 발제 - 프로젝트 1차 스크럼 (디자이너님과 회의) 최종 프로젝트 1차 스크럼 (SA) 최종 프로젝트 주제 : 커스텀 화면공유가 가능한 메타버스 환경 (NEP) - 프로젝트 선정 배경 프로젝트 배경현재 상황: 개발자 교육과정을 수강 중인 송용승씨는 프로젝트 시작 및 진행 중 발표자료 공유 방식에 불편함을 느낌. 문제점: 청취자는 발표자가 제공하는 자료만 볼 수 있으며, 발표자는 자신의 환경을 청취자에게 맞게 설정해야 하는 불편함이 있음. 타겟 개발자 교육 과정을 수강 중인 학생들과 강사.화상회의를 자주 사용하는 기업 및 교육 기관. 목적 / 기대효과목적: 화상회의 시 발표자료 공유의 효율성과 사용자 경험 개선.기대효.. 2024. 1. 4.
2023-12-21 본캠프 56일차 / 75일차 TIL 2023-12-21 본캠프 56일차 / 75일차 TIL 주요진행사항 - next.js 블로그만들기 next.js 블로그만들기 next.js와 typescript를 프로젝트를 통해 공부하기 위해서 개인 포트폴리오 (블로그) 프로젝트를 무작정 시작하였다. 개념을 정리하며 프로젝트를 진행 할 예정이다. 1. next.js 프로젝트 만들기 next.js는 CRA (Create React App)을 자체적으로 가지고 있다. 프로젝트를 생성하는 명령어는 다음과 같다. npx create-next-app@latest --typescript yarn create next-app --typescript pnpm create next-app --typescript 이후 프로젝트 생성을 위한 몇가지 질문을 프로젝트 성격에 .. 2023. 12. 22.