Skip to content

Commit 5849997

Browse files
Minju9187Minju9187
authored
Merge pull request #236 from boostcampwm-2024/dev
6주차 2번째 배포 버전입니다.
2 parents 8bf87b9 + 44a08aa commit 5849997

File tree

4 files changed

+70
-49
lines changed

4 files changed

+70
-49
lines changed

‎BE/apps/api-server/src/modules/connection/dto/connection.query.dto.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,5 @@ export class ConnectionQueryDto {
99
@Transform(({ value, obj }) => {
1010
return obj.type === 'mindmap' ? Number(value) : value;
1111
})
12-
@IsString()
1312
id: string | number;
1413
}

‎README.md‎

Lines changed: 68 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
11
# 🗺 **BooMap**
22

33
<img width="1722" alt="스크린샷 2024-12-02 오전 2 11 50" src="https://github.com/user-attachments/assets/43132cc1-bad7-482b-885f-b8d5e3a01103">
4-
5-
![10](https://github.com/user-attachments/assets/ec375304-8a44-41d4-97c4-8f6a8688d576)
6-
![11](https://github.com/user-attachments/assets/cee80201-0d26-40e5-9e1f-0ab1fc5edae3)
7-
![12](https://github.com/user-attachments/assets/0402b25c-aa95-4296-9a0c-e431626e8312)
8-
![13](https://github.com/user-attachments/assets/f60e5d7a-7ab1-4449-90a7-df186ba66d2e)
9-
![14](https://github.com/user-attachments/assets/a318b955-ad4b-457f-b1c4-03ce4c6ccb2f)
4+
<img src="https://i.imgur.com/fiAwuJA.gif">
5+
<img src="https://github.com/user-attachments/assets/cee80201-0d26-40e5-9e1f-0ab1fc5edae3">
6+
<img src="https://i.imgur.com/CXmg6H0.gif" />
7+
<img src="https://github.com/user-attachments/assets/f60e5d7a-7ab1-4449-90a7-df186ba66d2e">
8+
<img src="https://github.com/user-attachments/assets/a318b955-ad4b-457f-b1c4-03ce4c6ccb2f">
109

1110
---
1211

@@ -28,90 +27,112 @@
2827

2928
---
3029

31-
## 🧠TEAM 두뇌풀가동
3230

33-
<div align="center">
34-
<img src="https://i.imgur.com/nHeXf6r.png" height=400/>
35-
</div>
31+
## 🧐 두뇌풀가동팀의 두뇌풀가동
3632

37-
<br>
38-
<br>
3933

40-
### 👥 팀원
34+
### 동시편집 소켓 문제 해결하기
35+
저희 팀은 노드에 대한 동시편집을 가능하기 위해 socket.io에 도전해보았습니다.
36+
동시 편집을 구현하는 과정에 있어서 어떤 문제와 고민들을 했을까요?
4137

42-
<div align="center">
38+
- 🕒 [io 객체 생성 타이밍과 HTTP 요청](https://luxurious-share-af6.notion.site/io-HTTP-d4557100f7c24787b1e87f1c6318e66c?pvs=4)
39+
- 🤖 [aiResponse 이벤트 핸들러 중복 등록 문제](https://luxurious-share-af6.notion.site/aiResponse-1507725fa9ac80c4afebe1c7ec044638?pvs=4)
40+
- 🛠️ [소켓 에러 해결하기 총본집](https://luxurious-share-af6.notion.site/cb17937f9c05446e827aecd5fabb5df0?pvs=4)
41+
- 🖥️ [소켓을 연결했더니 캔버스가 마비된 건에 대하여..](https://luxurious-share-af6.notion.site/223e0029efef4945ae4073b3340324ad?pvs=4)
42+
- 😱 [노드의 텍스트을 삭제했는데 화면의 텍스트가 살아있는 것에 대하여…](https://luxurious-share-af6.notion.site/e0451420b8c946e3b2cb9c8086197d7a?pvs=4)
4343

44-
| J001 강민주 | J026 김남희 | J155 양현호 | J238 조민형 |
45-
| :----------------------------------------------------------------: | :---------------------------------------------------------------: | :----------------------------------------------------------------: | :---------------------------------------------------------------: |
46-
| <img src="https://i.imgur.com/zjvZ2sa.jpeg" width=100 height=100/> | <img src="https://i.imgur.com/GMFP1FK.png" width=100 height=100/> | <img src="https://i.imgur.com/wtHJtfD.jpeg" width=100 height=100/> | <img src="https://i.imgur.com/wXzG6SX.png" width=100 height=100/> |
47-
| [@Minju9187](https://github.com/Minju9187) | [@kimnamheeee](https://github.com/kimnamheeee) | [@adkm12](https://github.com/adkm12) | [@alsgud8311](https://github.com/alsgud8311) |
44+
### 마인드맵 그려내기
45+
마인드맵은 캔버스 라이브러리를 이용하여 그려내지만, 노드들과 마인드맵을 만들어주는 로직은 처음부터 끝까지 저희 팀이 구현했습니다. 어떤 시도와 도전들이 있었는지 찾아보세요!
4846

49-
</div>
47+
**옵시디언과 같은 메모 앱에서는 마인드맵 자식 요소들이 딸려오던데,, 우리도 한번 도전해볼까?** <br>
48+
-> 🛠️ [노드들을 끌고오게 하기](https://luxurious-share-af6.notion.site/1417725fa9ac8060944ec3769d9056a8?pvs=4)
5049

51-
<br>
50+
**각 부모와 자식 간을 이어주는 선을 직접 위치까지 계산해서 넣어야 했는데,, 보이는 것보다 더 개선할 수 있을까에 대한 고민을 공유합니다** <br>
51+
-> 🎯 [드래그 시 노드를 따라가는 선 구현하기](https://luxurious-share-af6.notion.site/1377725fa9ac80b1af7fe19ee08a1110?pvs=4)
5252

53-
---
54-
### 🧐 두뇌풀가동팀의 두뇌풀가동
55-
#### 마인드맵 그려내기
53+
**사용자들이 브레인스토밍하면서 한 곳으로 관심사를 분류해놓긴 하지만, 텍스트를 보기 위해 겹쳐 놓지는 않을텐데,, 그럼 재미 요소로 노드들끼리 2D 물리엔진처럼 충돌이 되도록 구현해 볼까하는 생각에서 노드 충돌방지를 소개합니다.** <br>
54+
-> ⚠️ [노드들의 충돌 감지 및 회피](https://luxurious-share-af6.notion.site/13a7725fa9ac80e8b96af725dbf70ba0?pvs=4)
5655

57-
- 🛠️ [노드들을 끌고오게 하기](https://luxurious-share-af6.notion.site/1417725fa9ac8060944ec3769d9056a8?pvs=4)
58-
- 🎯 [드래그 시 노드를 따라가는 선 구현하기](https://luxurious-share-af6.notion.site/1377725fa9ac80b1af7fe19ee08a1110?pvs=4)
59-
- ⚠️ [노드들의 충돌 감지 및 회피](https://luxurious-share-af6.notion.site/13a7725fa9ac80e8b96af725dbf70ba0?pvs=4)
60-
- 🚀 [충돌 방지의 렌더링 성능 최적화](https://luxurious-share-af6.notion.site/13d7725fa9ac800798f5f44af7c4939f?pvs=4)
61-
- 💾 [노드들의 이미지 다운로드하기](https://luxurious-share-af6.notion.site/1427725fa9ac8043a27ceffd0d387cdb?pvs=4)
62-
- 📍 [노드들이 겹치지 않게 펼치기](https://luxurious-share-af6.notion.site/782eba067f814852a11208f249996cdf?pvs=4)
56+
**충돌 방지 기능을 넣었더니 노드가 많아졌을 때 프레임 드랍이 생겼습니다. 프레임 드랍을 해결하기 위한 문제 분석과 이를 해결하기 위한 시도를 공유합니다!** <br>
57+
-> 🚀 [충돌 방지의 렌더링 성능 최적화](https://luxurious-share-af6.notion.site/13d7725fa9ac800798f5f44af7c4939f?pvs=4)
58+
59+
**이미지의 export 기능을 구현한 과정을 소개합니다!** <br>
60+
-> 💾 [노드들의 이미지 다운로드하기](https://luxurious-share-af6.notion.site/1427725fa9ac8043a27ceffd0d387cdb?pvs=4)
61+
62+
**사용자가 나중에 노드가 많아졌을 때, 한번 노드들에 대해서 재정렬하거나 겹치지 않게끔 노드를 만들어주는 기능을 넣으면 사용자 경험에 좋은 영향을 끼칠 것이라 판단했습니다. 그렇다면 이를 어떻게 계산하여 반영했는지에 대한 과정을 소개합니다** <br>
63+
-> 📍 [노드들이 겹치지 않게 펼치기](https://luxurious-share-af6.notion.site/782eba067f814852a11208f249996cdf?pvs=4)
6364

6465
---
6566

66-
#### 회원과 비회원 전용 서비스 만들기
67+
### 회원과 비회원 전용 서비스 만들기
68+
회원과 비회원 전용 서비스를 만들면서 어떻게 소유권을 관리해야 할지 정말 많은 케이스들이 발견되었습니다. 이를 해결하기 위한 저희만의 돌파구를 소개합니다.
6769

6870
- 🔑 [회원과 비회원의 소유권 관리하기](https://luxurious-share-af6.notion.site/14e7725fa9ac80eba893d0986a81e605?pvs=4)
6971
- 📡 [로그인 후 대시보드 API를 불러오도록 타이밍 조절하기](https://luxurious-share-af6.notion.site/14e7725fa9ac8070aff8cd82157ca616?pvs=4)
7072

7173
---
7274

73-
#### 동시편집 소켓 문제 해결하기
74-
- 🕒 [io 객체 생성 타이밍과 HTTP 요청](https://luxurious-share-af6.notion.site/io-HTTP-d4557100f7c24787b1e87f1c6318e66c?pvs=4)
75-
- 🤖 [aiResponse 이벤트 핸들러 중복 등록 문제](https://luxurious-share-af6.notion.site/aiResponse-1507725fa9ac80c4afebe1c7ec044638?pvs=4)
76-
- 🛠️ [소켓 에러 해결하기 총본집](https://luxurious-share-af6.notion.site/cb17937f9c05446e827aecd5fabb5df0?pvs=4)
77-
- 🖥️ [소켓을 연결했더니 캔버스가 마비된 건에 대하여..](https://luxurious-share-af6.notion.site/223e0029efef4945ae4073b3340324ad?pvs=4)
78-
- 😱 [노드의 텍스트을 삭제했는데 화면의 텍스트가 살아있는 것에 대하여…](https://luxurious-share-af6.notion.site/e0451420b8c946e3b2cb9c8086197d7a?pvs=4)
79-
8075

81-
---
76+
### 마크다운 회의록 구현하기
77+
모든 회의에서 대부분의 서기가 있다시피, 저희도 회의록을 두고 한 명이 이를 편집하면서 다른 사람들은 볼 수 있으면 좋겠다는 새로운 아이디어가 나와 회의록 기능을 추가했습니다. 에디터 라이브러리를 사용한 일지를 공유합니다.<br>
8278

83-
#### 마크다운 회의록 구현하기
8479
- 📝 [tiptap 에디터 도입하기](https://luxurious-share-af6.notion.site/tiptap-4f653362bcd34016a377fe4794b76455?pvs=4)
8580

8681
---
8782

88-
#### 기타 고민과 도전들
83+
### 기타 고민과 도전들
84+
팀원들이 순수 흥미와 호기심으로 했던 도전들과 직면했던 문제들을 해결하기 위한 시도들을 소개합니다!
85+
86+
**저작도구에서 중요했던 핵심 기능 중 하나는 '단축키'였습니다. 이와 함께 저희의 노드들의 상태를 되돌리기 할 수 있는 기능이 있다면 편집이 보다 쉬울 것이라 판단하여 시도했던 과정을 소개합니다.** <br>
87+
-> 🔄 [canvas에서 Ctrl + z로 뒤로가기를 해보자](https://luxurious-share-af6.notion.site/canvas-Ctrl-z-1cf4b1e309814aea859ea9b27e3ec82b?pvs=4)
8988

90-
- 🔄 [canvas에서 Ctrl + z로 뒤로가기를 해보자](https://luxurious-share-af6.notion.site/canvas-Ctrl-z-1cf4b1e309814aea859ea9b27e3ec82b?pvs=4)
89+
다양한 문제들을 해결했던 과정들을 소개합니다.
9190
- ⚙️ [이벤트 리스너 조절하기](https://luxurious-share-af6.notion.site/14a7725fa9ac8065b906fc9af6b94d1c?pvs=4)
9291

9392

9493
---
9594

96-
### 🛠️ 기술스택
95+
## 🛠️ 기술스택
9796

9897
<div align="center">
9998
<img width="697" alt="image" src="https://github.com/user-attachments/assets/47f18052-b896-4c99-9b2b-6a18860de0aa">
10099
</div>
101100

102101
<br>
103102

104-
### 서버 아키텍처
103+
## 서버 아키텍처
105104
<img width="697" alt="image" src="https://i.imgur.com/JbkxCKa.png">
106105

107106

108107

109108
---
110109

111-
### 🔗 Links
110+
## 🔗 Links
111+
저희 팀에 대해서 더 알고 싶거나 서비스를 체험하고싶으신 분은 아래 링크를 통해 이동해주세요 😉 </br>
112+
113+
[![BOOMAP](https://img.shields.io/badge/BOOMAP-0A84FF?style=for-the-badge&logo=googlegemini&logoColor=white)](https://boomap.site) [![TEAM NOTION](https://img.shields.io/badge/TEAM%20NOTION-0078D7?style=for-the-badge&logo=notion&logoColor=white)](https://luxurious-share-af6.notion.site/BOOMAP-1287725fa9ac80dd87d9c5fbad711b3d?pvs=4) [![Wiki](https://img.shields.io/badge/Wiki-181717?style=for-the-badge&logo=github&logoColor=white)](https://github.com/boostcampwm-2024/web32-BooMap/wiki)
114+
115+
116+
117+
## 🧠TEAM 두뇌풀가동
118+
119+
<div align="center">
120+
<img src="https://i.imgur.com/nHeXf6r.png" height=400/>
121+
</div>
122+
123+
<br>
124+
<br>
112125

113-
[![BOOMAP](https://img.shields.io/badge/BOOMAP-0A84FF?style=for-the-badge&logo=googlegemini&logoColor=white)](https://boomap.site) </br>
114-
[![TEAM NOTION](https://img.shields.io/badge/TEAM%20NOTION-0078D7?style=for-the-badge&logo=notion&logoColor=white)](https://luxurious-share-af6.notion.site/BOOMAP-1287725fa9ac80dd87d9c5fbad711b3d?pvs=4) </br>
115-
[![Wiki](https://img.shields.io/badge/Wiki-181717?style=for-the-badge&logo=github&logoColor=white)](https://github.com/boostcampwm-2024/web32-BooMap/wiki) </br>
126+
### 👥 팀원
116127

128+
<div align="center">
117129

130+
| J001 강민주 | J026 김남희 | J155 양현호 | J238 조민형 |
131+
| :----------------------------------------------------------------: | :---------------------------------------------------------------: | :----------------------------------------------------------------: | :---------------------------------------------------------------: |
132+
| <img src="https://i.imgur.com/zjvZ2sa.jpeg" width=100 height=100/> | <img src="https://i.imgur.com/GMFP1FK.png" width=100 height=100/> | <img src="https://i.imgur.com/wtHJtfD.jpeg" width=100 height=100/> | <img src="https://i.imgur.com/wXzG6SX.png" width=100 height=100/> |
133+
| [@Minju9187](https://github.com/Minju9187) | [@kimnamheeee](https://github.com/kimnamheeee) | [@adkm12](https://github.com/adkm12) | [@alsgud8311](https://github.com/alsgud8311) |
134+
|Frontend|Frontend|Backend|Frontend|
135+
136+
</div>
137+
138+
<br>

‎client/src/store/NodeListProvider.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -97,6 +97,7 @@ export default function NodeListProvider({ children }: { children: ReactNode })
9797
payload: initializedNodes,
9898
callback: (response) => {
9999
overrideNodeData(response);
100+
overrideHistory(JSON.stringify(response));
100101
},
101102
});
102103
});

‎client/src/store/createSocketSlice.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -106,7 +106,7 @@ export const createSocketSlice: StateCreator<ConnectionStore, [], [], SocketSlic
106106
get().connectSocket(connectionId);
107107
return connectionId;
108108
} catch (error) {
109-
console.error(error);
109+
throw error;
110110
}
111111
},
112112

0 commit comments

Comments
 (0)