[기록] Final Project_2021.05.25

오늘은 어떻게 프로젝트에 기여했나요?

Database

▷ rooms 테이블의 entity 설계

- 프로젝트 내 채팅방 목록을 저장하는 테이블

- projects 테이블과 1:N 관계로 연결

 

Workspace

▷ socket.io 이벤트 함수 파일 분리 성공

- chat 기능 관련 함수들을 `controller/workspace/chat.ts`에 정리

- kanban 기능을 구현할 파일 `controller/workspace/kanban.ts`에 세팅

 

▷ chat 기능에서 채팅방을 관리하는 기능 구현

- routes, controllers 세팅

- 새로운 채팅방 생성

`post /workspace/:projectURL/chat` 요청 로직 작성

- 현재 채팅방의 이름 수정

`post /workspace/:projectURL/chat/:room` 요청 로직 작성

- 채팅방 삭제

`delete /workspace/:projectURL/chat/:room` 요청 로직 작성

- 현재 프로젝트 내에 존재하는 채팅방 목록 조회

`get /workspace/:projectURL/chat` 요청 로직 작성

- respose data로 채팅방 목록을 보내줌

데이터베이스에서 채팅방 목록을 검색하는 함수 `getRoomsList`를 작성하여 각 로직에 적용

 

▷ 프로젝트 정보 + 전체 멤버 정보 조회

- `get /project/:projectURL`를 조금 보완하여 사용

- response data에서 members 데이터를 id에서 데이터 가공없이 전체 데이터로 바로 보내줌

 

Middleware

▷ middeware 보완

- 프로젝트 확인-멤버 확인하는 middleware는 chat 뿐만 아니라 workspace의 다른 기능에도 사용됨

- middleware 이름을 `chatChecker`에서 `workspaceChecker`으로 변경

- `workspaceChecker`가 필요한 라우터에 middleware 설정(`use()` 메소드 사용)

 

 

오늘의 프로젝트에서 힘든 점은 무엇인가요?

▷ socket.io 이벤트 함수 파일 분리하기

일요일(5/23)에 엄청 고생했던 socket.io의 이벤트들을 각각 다른 파일에 분리하는 작업을 드디어 성공했습니다!

일요일에는 막막하기도 하고 검색해도 원하는 정보를 얻을 수 없어서 많이 힘들었는데.. 월요일(5/24)에 chat 기능을 구현하고 코드를 정리하면서 socket.io에 대해 많이 이해하게 되었고 어떻게 사용하는지에 대한 감을 잡을 수 있었습니다. 그래서 오늘 다시 파일 분리를 도전해보았는데 성공했습니다! 와아!

여러 방법을 시도하면서 알아낸 것은 다음과 같습니다.

1. `io.on('connection')`은 다른 함수 안에 들어가있으면 안됩니다. `io.on('connection')`으로 socket 연결 요청이 오는지 항상 대기하고 있어야 하는데 `socket.ts`가 아닌 다른 파일로 들어가게 되면 항상 대기가 불가능해집니다. (import로 불러온 함수는 계속 실행시키기 어렵습니다. 즉, 처음 1번만 실행되서 socket 연결 요청을 기다리지 않게 됩니다)

2. `app.set('io', io)`을 사용하여 io를 원하는 라우터로 넘겨줄 수 있습니다. io를 사용하려는 라우터에서 `app.get('io')`로 해당 io를 불러올 수 있습니다.

3. `use()` 메소드를 사용하여 이벤트 함수를 실행하기 전 middleware를 추가할 수 있습니다. 이 middleware는 socket 연결할 때(즉, `io.on('connection')`이 실행될 때) 최초 1번 실행됩니다.

// socket.ts
import socketChat from './controllers/workspace/chat';

const chatIo = io.of('/chat');
app.set('chatIo', chatIo);
chatIo.use(workspaceChecker);
chatIo.on('connection', (socket: Socket) => {
    socketChat(socket);
});

// controllers/workspace/chat.ts
const socketChat = (socket: Socket) => {
    const chatIo = app.get('chatIo');
    socket.on('event', () => {
        // 기능 구현
    });
};

export default socketChat;

 

 

내일은 프로젝트에 기여하기 위해 무엇을 해야 하나요?

▷ Workspace: chat 기능

- 클라이언트와 연결하여 테스트 진행

- 이미지 업로드 기능 구현

▷ refresh token 기능 구현(새로운 access token 발급 받기)

▷ 추가적으로 구현할 기능 찾기(고민 + 회의)