MVP 에 채팅 기능을 포함하도록 결정했다. 이에 따라, 채팅 기능을 어떤 방식으로 제공할 지 논의를 나누었다. 다양한 방법이 후보에 올랐다. 첫 번째 스터디 / 프로젝트 공고의 경우, 글 게시자 다른 유저 간 1:1 채팅방 개설 컨퍼런스 / 행사의 경우 인원 제한을 건 오픈 채팅방 자유 개설 ...

최종 프로젝트를 시작해서, 하루 동안 했던 일의 기록을 남기기 위해 별 게 없더라도 쥐어 짜내서 정리해보려고 한다! 어제 보다 조금 더 구체적인 내용이 되었다! 프로젝트 명(가칭) 프로젝트 방향성, 주제등이 빠르게 정해져 이름도 금방 정한 것 같다! 그렇게 설정한 이름은 바로, @gather_here 가 되시겠다. 서비스의 주요 기능이...

프로젝트를 진행하고, 정리하고 싶은 부분이 있어 간단히 정리해보기로 했다. 좋아요 기능을 구현하는 것에 애로사항이 있었다. 게시글 좋아요를 누르면, DB 에서 게시글에 대한 좋아요 수를 +1 만큼 늘려줘야하고 유저가 좋아요 누른 게시글 목록에 추가해줘야 했다. Supabase 를 사용하고 있고, 별도의 SQL 문을 작성하기엔 지식이 부족했다. ...

Next js 프로젝트에서 Supabase 를 이용할 일이 생겼다. 그런데, 코드 작성할 때 조금 애를 먹기도 해서 어떤 요소를 고려해야하는지 코드와 함께 정리해보려고 한다! 상황 app router 방식으로 구성한 NextJS 프로젝트에서, supabase 를 사용할 필요가 있었다. 별도의 DB 를 구성할 수는 없기에, BaaS 를 이용하...

Next.js 의 Route Handler 를 통해, 백엔드 구현이 가능하다! 이에 대해 알아보자 Route Handler 란? 공식 홈페이지의 설명을 인용하자면, 주어진 route 에서 사용하는 웹 요청 / API 응답을 처리하는 custom handler 구현이 가능한 기능이라고 한다. 데이터를 요청받는 과정과, 이를 클라이언트에게 반...

Next.js 에서 컴포넌트 렌더링이 어떻게 이루어지는지 알아보자. Next.js 13 버전 이후 부터는 리액트 처럼 컴포넌트 단위로 렌더링이 이루어지게 됐다. 그런데, 여기서 컴포넌트의 구분이 생겼는데 서버 컴포넌트(Server Component) 클라이언트 컴포넌트(Client Component) 이렇게 2개로 구분할 수 ...

이제 Next.js 를 사용해보자! 설치 npx create-next-app@latest create-next-app 을 통해 설치하기를 권장하고 있다. 이렇게 설치하고 나면 아래와 같은 터미널 프롬프트가 출력된다. 이후 프로젝트 파일 구조는 아래와 같이 생성된다. 라우팅 과정 Tree 계층 구...