readme 업데이트

yudonggeun · Sep 20, 2023 · e0dbe91 · e0dbe91
1 parent 7fc5433
commit e0dbe91
Show file tree

Hide file tree

Showing 15 changed files with 83 additions and 11 deletions.
diff --git a/file/addFriend.png b/file/addFriend.png
diff --git a/file/chat_info.png b/file/chat_info.png
diff --git a/file/chat_room.png b/file/chat_room.png
diff --git a/file/chat_room_menu.png b/file/chat_room_menu.png
diff --git a/file/chating_room.png b/file/chating_room.png
diff --git a/file/erd.png b/file/erd.png
diff --git a/file/login.png b/file/login.png
diff --git a/file/main.png b/file/main.png
diff --git a/file/welcome.png b/file/welcome.png
diff --git a/readme.md b/readme.md
@@ -0,0 +1,70 @@
+# 실시간 채팅 웹 사이트
+
+Version1 : From 23-09-13 To 23-09-20
+
+## 1. 기획 의도
+
+- STOMP 프로토콜을 이용한 실시간 채팅 서비스 기능을 개발하여 STOMP 기술을 익힌다.
+- 채팅 기능 구현을 통해서 동기화를 고려한 개발을 진행해본다.
+- 메시지 브로커 (RabbitMQ, Kafka) 서비스를 이용해서 아키텍처를 구성한다.
+
+## 2. 개발 기능
+
+- 회원 기능
+    - 간단 회원가입
+    - 로그인
+    - 친구 추가
+    - 친구 삭제
+    - 친구 목록 조회
+- 채팅 기능
+    - 채팅 입력
+    - 채팅 삭제
+    - 채팅 목록 조회
+- 채팅방 기능
+    - 채팅방 생성
+    - 채팅방 조회 
+    - 채팅방 나가기
+    - 친구 초대하기
+    - 채팅방 배경색 설정
+    - 채팅 안 읽음 확인
+
+## 3. 아키텍처
+
+### version 1
+
+browser → server → db
+
+### version 2
+
+browser → messageQueue → server → db
+
+## 4. ERD 설계
+![erd image](/file/erd.png)
+[erd cloud link](https://www.erdcloud.com/d/44AHnBQQtTh4HtfwD)
+
+## 5. 사용 기술
+
+version 1
+
+- `spring boot` `spring websocket` `STOMP` `JPA`
+
+version 2
+
+- `rabbitMQ`
+
+
+## 6. 개발 UI
+
+| 이름            | 상세                                                                                                                                                                                                                                                    | 화면                           |
+|---------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------|
+| 로그인 페이지       | 닉네임과 비밀번호를 통한 로그인 페이지로서 모든 입력 값을 입력해야 로그인 버튼이 동작한다.                                                                                                                                                                                                   | ![로그인](/file/login.png)      |
+| 회원가입 페이지      | 닉네임과 비밀번호를 통한 회원가입 페이지로서 모든 입력 값을 입력해야 회원가입 버튼이 동작한다.                                                                                                                                                                                                 | ![회원가입](/file/welcome.png)   |
+| 친구추가 페이지      | 친구의 닉네임으로 친구를 추가할 수 있다.                                                                                                                                                                                                                               | ![친구추가](/file/addFriend.png) |
+| 서비스 간단 설명 페이지 | 1. 채팅방 만들기 : `채팅방 만들기` 버튼을 클릭하면 채팅방 추가를 위한 인터페이스 제공한다. 말풍선 아이콘을 클릭하면 채팅방을 생성한다.<br/><br/> 2. 채팅방 변경 : 채팅방 목록에서 채팅방을 클릭하면 해당 채팅방으로 이동한다. <br/><br/> 3. 채팅 삭제 : 스스로 생성한 하얀색 채팅은 클릭시 삭제된다.<br/><br/> 4. 친구 초대: 친구의 닉네임 입력후 초대 아이콘을 클릭하면 친구 해당 채팅방에 초대한다. | ![간단설명](/file/chat_info.png) |
+
+
+
+
+
+
+
diff --git a/src/main/java/com/websocket/demo/service/UserService.java b/src/main/java/com/websocket/demo/service/UserService.java
@@ -10,7 +10,6 @@
 import com.websocket.demo.response.FriendInfo;
 import jakarta.transaction.Transactional;
 import lombok.RequiredArgsConstructor;
-import org.springframework.dao.DataIntegrityViolationException;
 import org.springframework.stereotype.Service;
 
 import java.util.List;

diff --git a/src/main/resources/templates/index.html b/src/main/resources/templates/index.html
@@ -62,6 +62,7 @@
 
 
 
+
     </script>
 
     <script th:inline="javascript">
@@ -71,6 +72,7 @@
 
 
 
+
     </script>
     <script th:inline="javascript" th:if="${targetRoom != null}">
     /*<![CDATA[*/
@@ -108,6 +110,7 @@
     });
 };
     /*]]>*/
+
     </script>
     <style>
       .no-scrollbar::-webkit-scrollbar {
@@ -120,6 +123,7 @@
           scrollbar-width: none;  /* Firefox */
       }
 
+
     </style>
 </head>
 <body style="overflow: hidden" class="overflow-hidden">
@@ -233,11 +237,10 @@ <h1 class="flex-1">친구</h1>
                     </div>
                     <li th:each="friend : ${friends}">
                         <div th:id="'friend-' + ${friend.nickname}"
-                             class="flex dark:hover:bg-gray-700 hover:bg-blue-100 rounded-lg">
+                             class="flex dark:hover:bg-gray-700 hover:bg-gray-100 rounded-lg">
                             <button type="button"
                                     class="flex items-center p-2 w-full text-base font-normal text-gray-900 rounded-lg transition duration-75 group dark:text-white">
-                        <span th:text="${friend.nickname}"
-                              class="flex-1 ml-3 text-left whitespace-nowrap">friend nickname</span>
+                                <span th:text="${friend.nickname}" class="flex-1 ml-3 text-left whitespace-nowrap">friend nickname</span>
                             </button>
                             <button type="button"
                                     th:id="'delete-friend' + ${friend.nickname}"
@@ -318,7 +321,8 @@ <h1 class="flex-1">채팅</h1>
                         <a href="/user/logout" class="">
                             <button class="w-full">
                                 <svg xmlns="http://www.w3.org/2000/svg" width="27" height="27" fill="currentColor"
-                                     class="border-0 rounded-lg text-sm hover:bg-gray-100 mr-3 absolute right-0 bottom-0 bi bi-gear-fill" viewBox="0 0 16 16">
+                                     class="border-0 rounded-lg text-sm hover:bg-gray-100 mr-3 absolute right-0 bottom-0 bi bi-gear-fill"
+                                     viewBox="0 0 16 16">
                                     <path d="M7.5 1v7h1V1h-1z"/>
                                     <path d="M3 8.812a4.999 4.999 0 0 1 2.578-4.375l-.485-.874A6 6 0 1 0 11 3.616l-.501.865A5 5 0 1 1 3 8.812z"/>
                                 </svg>
@@ -332,7 +336,8 @@ <h1 class="flex-1">채팅</h1>
         <div th:if="${targetRoom == null}"
              class="flex-1 grid h-screen bg-blue-100">
             <div class="place-self-center">
-                <svg xmlns="http://www.w3.org/2000/svg" width="170" height="170" fill="#99ccff" class="bi bi-chat-heart-fill" viewBox="0 0 16 16">
+                <svg xmlns="http://www.w3.org/2000/svg" width="170" height="170" fill="#99ccff"
+                     class="bi bi-chat-heart-fill" viewBox="0 0 16 16">
                     <path d="M8 15c4.418 0 8-3.134 8-7s-3.582-7-8-7-8 3.134-8 7c0 1.76.743 3.37 1.97 4.6-.097 1.016-.417 2.13-.771 2.966-.079.186.074.394.273.362 2.256-.37 3.597-.938 4.18-1.234A9.06 9.06 0 0 0 8 15Zm0-9.007c1.664-1.711 5.825 1.283 0 5.132-5.825-3.85-1.664-6.843 0-5.132Z"/>
                 </svg>
             </div>
@@ -342,7 +347,8 @@ <h1 class="flex-1">채팅</h1>
             <div class="relative w-full">
                 <div class="absolute top-0 right-0 w-full h-full flex-1 grid h-screen ">
                     <div class="place-self-center">
-                        <svg xmlns="http://www.w3.org/2000/svg" width="170" height="170" fill="#99ccff" class="bi bi-chat-heart-fill" viewBox="0 0 16 16">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="170" height="170" fill="#99ccff"
+                             class="bi bi-chat-heart-fill" viewBox="0 0 16 16">
                             <path d="M8 15c4.418 0 8-3.134 8-7s-3.582-7-8-7-8 3.134-8 7c0 1.76.743 3.37 1.97 4.6-.097 1.016-.417 2.13-.771 2.966-.079.186.074.394.273.362 2.256-.37 3.597-.938 4.18-1.234A9.06 9.06 0 0 0 8 15Zm0-9.007c1.664-1.711 5.825 1.283 0 5.132-5.825-3.85-1.664-6.843 0-5.132Z"/>
                         </svg>
                     </div>

diff --git a/src/test/java/com/websocket/demo/controller/UserControllerTest.java b/src/test/java/com/websocket/demo/controller/UserControllerTest.java
@@ -6,7 +6,6 @@
 import org.junit.jupiter.api.DisplayName;
 import org.junit.jupiter.api.Test;
 import org.springframework.boot.test.mock.mockito.MockBean;
-import org.springframework.dao.DataIntegrityViolationException;
 
 import static org.mockito.ArgumentMatchers.any;
 import static org.mockito.BDDMockito.given;

diff --git a/src/test/java/com/websocket/demo/repository/ChatRepositoryTest.java b/src/test/java/com/websocket/demo/repository/ChatRepositoryTest.java
@@ -3,7 +3,6 @@
 import com.websocket.demo.SpringTest;
 import com.websocket.demo.domain.Chat;
 import com.websocket.demo.domain.Room;
-import jakarta.transaction.Transactional;
 import org.junit.jupiter.api.DisplayName;
 import org.junit.jupiter.api.Test;
 import org.springframework.beans.factory.annotation.Autowired;

diff --git a/src/test/java/com/websocket/demo/service/UserServiceTest.java b/src/test/java/com/websocket/demo/service/UserServiceTest.java
@@ -14,7 +14,6 @@
 import java.util.List;
 
 import static org.assertj.core.api.Assertions.assertThat;
-import static org.assertj.core.api.Assertions.assertThatThrownBy;
 
 class UserServiceTest extends SpringTest {
 
@@ -152,7 +151,7 @@ public void failCase2() {
             var request = new AddFriendRequest();
             request.setNickname("friend1");
             //when
-            boolean result = userService.addFriend(request, null);
+            boolean result = userService.addFriend(request, "nick");
             //then
             assertThat(result).isFalse();
         }