Merge branch 'main' of https://github.com/hackersground-kr/hg-crescen…

…do-server

README.md

@@ -36,6 +36,7 @@
 
 - powershell, 터미널 등은 컴퓨터 내의 검색을 통해 찾을 수 있습니다.
 - 윈도우는 powershell에서 진행합니다.
+- 만약 깃이 없다면 https://git-scm.com/download/win 링크에서 윈도우 64로 설치를 해주세요, 설정은 건드리지 않아도 됩니다.
 
 ## 환경 설정 - 2
 
@@ -75,8 +76,8 @@ https://www.oracle.com/java/technologies/downloads/
 
 0-1-2. mac에서 자바 설치
 
-오라클 홈페이지에서 맥 os 자바 17을 설치한다.
-https://www.oracle.com/java/technologies/downloads/
+이 링크로 다운받습니다
+https://download.oracle.com/java/17/latest/jdk-17_macos-aarch64_bin.dmg
 
 터미널에서 아래 명령어를 차례로 입력합니다.
 ```
@@ -106,7 +107,7 @@ export PATH
 
 다음 명령어를 입력하여 환경변수를 적용한다.
 ```
-source .bash_profile
+source ~/.bash_profile
 ```
 
 ```
@@ -269,6 +270,7 @@ gh auth status
 ```
 # mac
 AZURE_ENV_NAME="{{ GITHUB_ID }}"
+
 # window (** powershell, 띄어쓰기 주의)
 $AZURE_ENV_NAME = "{{ GITHUB_ID }}"
 
@@ -340,11 +342,11 @@ https://portal.azure.com/#home 에 접속합니다.
 
 3-1-1. app service를 검색합니다.
 
-3-1-2. 만들기 → 웹앱
+3-1-2. 만들기 버튼을 클릭하여 웹앱을 선택합니다.
 
 3-1-3. 할당된 리소스 그룹을 선택합니다
 
-3-1-4. 고유한 호스트 이름(서버의 도메인 주소)를 설정할 수 있습니다. (선택사항, 필수 X, 만약 켠다면 도메인 이름이 복잡해집니다.)
+3-1-4. 고유한 호스트 이름을 설정할 수 있습니다.
 
 3-1-5. 코드 → 자바 17 → java SE 그리고 korea Central을 선택합니다.
 
@@ -356,36 +358,43 @@ https://portal.azure.com/#home 에 접속합니다.
 
 3-1-7. 검토 및 만들기를 합니다.
 
-다시 cosmosDB - postgre로 돌아갑니다.
 
 3-1-8 ai 사용
 
 애저 포털에서 openAI 검색 및 +만들기
-이름은 아무렇게나, 지역은 korea central 선택하고 생성합니다. 
+할당된 리소스 그룹을 선택하고
+이름은 아무렇게나, 지역은 korea central 선택하고 생성합니다. (이외 다른 수정사항 없음)
 
 3-1-8-1
 
-리소스 관리 - 키 값 및 엔드포인트에 들어가면 키가 2개가 생성된걸 확인할 수 있습니다.
+리소스 관리 - 키 값 및 엔드포인트에 들어가거나, 개요에서 오른쪽에 '키를 관리하려면 여기를 클릭' 을 눌러 이동하면
+키가 2개가 생성된걸 확인할 수 있습니다. key1을 복사해서 메모장에 붙혀둡니다.
 <img width="763" alt="스크린샷 2024-08-27 오전 7 16 45" src="https://github.com/user-attachments/assets/4828c264-a084-4aeb-8812-96ef0c411c3c">
 
 
 
 3-2-0. DB 연결 및 환경변수
 
-3-2-0-1. 설정 - 연결 문자열 - JDBC의 url을 ‘?’전까지만 복사합니다.
+다시 자신이 만든 cosmosDB - postgre로 돌아갑니다. (포탈로 돌아가서 방문 기록을 보면 쉽게 찾을 수 있습니다.)
 
-![png](https://github.com/hackersground-kr/hg-crescendo-server/blob/main/images/az9.png)
+3-2-0-1. 설정 - 연결 문자열 - JDBC의 url을 ‘?’전까지만 복사합니다. ('?'는 복사하면 x) 이것도 메모장에 적어줍니다.
 
+![png](https://github.com/hackersground-kr/hg-crescendo-server/blob/main/images/az9.png)
 
 
+자신이 만든 앱서비스로 다시 이동합니다.
 
-아까 만든 웹앱 소스에서 설정 -  환경변수에서 +추가를 클릭합니다.
+설정 -  환경변수에서 +추가를 클릭합니다.
 
-1번째 이름: DB_URL, 값: 방금 복사한 데이터베이스 url
+이름: DB_URL, 값: 방금 복사한 데이터베이스 url
+를 만들고 완료합니다.
 
-2번쨰 이름: DB_PW, 값: 자신의 db 비밀번호
+또 다시 +추가를 클릭하여
+이름: DB_PW, 값: 자신의 db 비밀번호
+를 만듭니다.
 
-3번째 이름: CHATGPT_API_KEY, 값: openai의 key 1 또는 2(선택)
+마지막으로 한번 더 +추가를 누르고
+이름: CHATGPT_API_KEY, 값: openai에서 복사했던 key1
 
 이렇게 총 3개를 만들고 적용합니다.
 
@@ -397,30 +406,35 @@ https://portal.azure.com/#home 에 접속합니다.
 
 3-2-2. 소스 : GitHub
 
-3-2-3. 포크해온 리포지토리와 main 분기를 선택합니다
+3-2-3. 포크해온 리포지토리(조직: 자신의 깃헙 아이디, 리포지토리: hg-crescendo-server)와 main 분기를 선택합니다
 
 3-2-4. 설정을 마쳤다면 저장을 누릅니다. 깃액션이 활성화됩니다.
 
-
+----------
 
 3-2-5-1. intellij에서 자신이 포크한 폴더 경로를 열어줍니다. (hg-crescendo-server)
 
 ![image.png](https://github.com/hackersground-kr/hg-crescendo-server/blob/main/images/az14.png)
 
-3-2-5-2. intelliJ에서 터미널을 열고 아래의 명령어를 입력합니다.
+3-2-5-2. intelliJ에서 좌측 하단의 터미널을 열고 아래의 명령어를 입력합니다.
 
 ```
 git pull
 ```
 
-3-2-6. .github/workflows 폴더에 yml파일이 두개가 있습니다. 원래 있던 파일을 삭제합니다.
+3-2-6. .github/workflows 폴더에 yml파일이 두개가 있습니다. sh-crescendo-server를 삭제합니다.
+3-2-7-0. 새로 생긴 yml 파일의 아래 내용(앱서비스의 고유key)을 메모장에 복사해두고 '내용'만 모두 지웁니다. (파일은 지우시면 안됩니다)
+
+<img width="775" alt="스크린샷 2024-08-27 오전 9 04 12" src="https://github.com/user-attachments/assets/6a03c384-1a7f-4294-a41e-4b1c30231444">
+
+
 
-3-2-7. 새로 생긴 yml 파일에 내용을 다음과 같이 변경합니다. 복사 붙여넣기를 하셔도 괜찮습니다. 
+3-2-7. 새로 생긴 yml 파일에 내용을 다음(아래의 코드블럭)과 같이 변경합니다. (복사 붙여넣기 하세요.)
 
 단 ** 주의할 점
 
-1. 가장 아래에서 2번째에 app-name 은 당신의 웹앱 리소스 네임으로 변경하셔야합니다. 
-2. client-id, tanant-id, subscription-id는 자신이 발급받은 키를 쓰셔야 합니다. 이전 파일 지웠어도 깃허브 commit 기록 보면 찾을 수 있습니다.
+1. 가장 아래에서 2번째에 app-name 은 당신이 만든 앱서비스의 이름으로 변경하셔야합니다.
+2. client-id, tanant-id, subscription-id는 자신이 발급받은 키를 쓰셔야 합니다. 메모장에 복사해둔 client-id, tanant-id, subscription-id로 다시 바꿔줍니다.
 
 ```
 # Docs for the Azure Web Apps Deploy action: https://github.com/Azure/webapps-deploy

crescendo-server/src/main/java/com/example/crescendoserver/global/config/security/SecurityConfig.java

@@ -15,6 +15,10 @@
 import org.springframework.security.crypto.password.PasswordEncoder;
 import org.springframework.security.web.SecurityFilterChain;
 import org.springframework.security.web.authentication.UsernamePasswordAuthenticationFilter;
+import org.springframework.web.cors.CorsConfiguration;
+import org.springframework.web.cors.CorsConfigurationSource;
+
+import java.util.Collections;
 
 @Configuration
 @RequiredArgsConstructor
@@ -34,7 +38,8 @@ public PasswordEncoder passwordEncoder() {
     public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
         return http
                 .csrf(AbstractHttpConfigurer::disable)
-                .cors(AbstractHttpConfigurer::disable)
+//                .cors(AbstractHttpConfigurer::disable)
+                .cors(corsConfigurer -> corsConfigurer.configurationSource(corsConfigurationSource()))
                 .formLogin(AbstractHttpConfigurer::disable)
                 .httpBasic(AbstractHttpConfigurer::disable)
                 .rememberMe(AbstractHttpConfigurer::disable)
@@ -54,12 +59,12 @@ public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
                         .requestMatchers(HttpMethod.GET, "/ws/chat").permitAll()
                         .requestMatchers(HttpMethod.POST, "/chat").permitAll()
                         .requestMatchers(HttpMethod.GET, "/chat").permitAll()
-                        .requestMatchers(HttpMethod.GET, "/todos/{todoId}").authenticated()
-                        .requestMatchers(HttpMethod.GET, "/todos").authenticated()
-                        .requestMatchers(HttpMethod.POST, "/todos").authenticated()
-                        .requestMatchers(HttpMethod.PATCH, "/todos/{todoId}/check").authenticated()
-                        .requestMatchers(HttpMethod.PATCH, "/todos/{todoId}").authenticated()
-                        .requestMatchers(HttpMethod.DELETE, "/todos/{todoId}").authenticated()
+                        .requestMatchers(HttpMethod.GET, "/todos/{todoId}").permitAll()
+                        .requestMatchers(HttpMethod.GET, "/todos").permitAll()
+                        .requestMatchers(HttpMethod.POST, "/todos").permitAll()
+                        .requestMatchers(HttpMethod.PATCH, "/todos/{todoId}/check").permitAll()
+                        .requestMatchers(HttpMethod.PATCH, "/todos/{todoId}").permitAll()
+                        .requestMatchers(HttpMethod.DELETE, "/todos/{todoId}").permitAll()
                         .requestMatchers(HttpMethod.GET, "/posts/{postId}").authenticated()
                         .requestMatchers(HttpMethod.GET, "/posts").authenticated()
                         .requestMatchers(HttpMethod.POST, "/posts").authenticated()
@@ -72,4 +77,15 @@ public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
                 .addFilterBefore(jwtExceptionFilter, JwtAuthenticationFilter.class)
                 .build();
     }
+
+    CorsConfigurationSource corsConfigurationSource() {
+        return request -> {
+            CorsConfiguration config = new CorsConfiguration();
+            config.setAllowedHeaders(Collections.singletonList("*"));
+            config.setAllowedMethods(Collections.singletonList("*"));
+            config.setAllowedOriginPatterns(Collections.singletonList("*"));
+            config.setAllowCredentials(true);
+            return config;
+        };
+    }
 }

crescendo-web/src/App.js

@@ -17,6 +17,15 @@ import Counsel from "./pages/Counsel";
 import Board from "./pages/Board";
 
 const App = () => {
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const openModal = () => {
+    setIsModalOpen(true);
+  };
+  // 모달 닫기 함수
+  const closeModal = () => {
+    setIsModalOpen(false);
+  };
+
   const [formData, setFormData] = useState({
     id: "",
     password: "",

crescendo-web/src/Login.js

@@ -16,7 +16,7 @@ function Login() {
 
   const handleLogin = async () => {
     try {
-      const response = await axios.post("http://20.41.66.225/auth/login", loginData);
+      const response = await axios.post("https://sh-crescendo-server.azurewebsites.net/auth/login", loginData);
 
       if (response.status === 200) {
         navigate("/Main");
@@ -61,7 +61,8 @@ function Login() {
       </header>
       <div className="btns">
         <button id="prevBtn" onClick={() => navigate(-1)} aria-label="Previous" />
-        <button id="login" onClick={handleLogin} aria-label="Login">로그인</button>
+        <button id="login"  onClick={() => navigate("/Main")}
+        aria-label="login">로그인</button>
         <button id="helpBtn" aria-label="Help" />
       </div>
     </div>

crescendo-web/src/SignUp1.css

@@ -88,7 +88,7 @@ header {
   font-size: 20px;
   margin-bottom: 1rem;
   background-color: #f8f4f3;
-  color: #eaddd8;
+  color: #895d3c;
   outline: none;
 }
 
@@ -98,7 +98,7 @@ header {
   width: 80%;
   font-size: 20px;
   background-color: #f8f4f3;
-  color: #eaddd8;
+  color: #895d3c;;
   outline: none;
 }
 

crescendo-web/src/SignUp3.js

@@ -8,12 +8,9 @@ function SignUp3({ formData }) {
 
   const handleSubmit = async () => {
     try {
-      const response = await axios.post("http://20.41.66.225/auth/signup", formData);
-
-      if (response.status === 200) {
-        navigate("/login");
-      } else {
-        console.error("Signup failed");
+      const res = await axios.post("https://sh-crescendo-server.azurewebsites.net/auth/signup", {username:formData.id,password:formData.password});
+      if(res){
+        navigate("/Main");
       }
     } catch (error) {
       console.error("There was an error during the signup process:", error);
@@ -32,7 +29,9 @@ function SignUp3({ formData }) {
       </header>
       <div>
         <button id="prevBtn" onClick={() => navigate(-1)} aria-label="Previous" />
-        <button id="startBtn" onClick={handleSubmit} aria-label="Start">시작하기</button>
+        <button id="startBtn"
+        onClick={handleSubmit}
+        aria-label="Start">시작하기</button>
         <button id="helpBtn" aria-label="Help" />
       </div>
     </div>

crescendo-web/src/pages/Guide.css

@@ -1,26 +1,48 @@
 .box {
   background-color: #895d3c;
   width: 100%;
-  height: 1px;
+  height: 15px;
 }
-
-.whatDo id {
+.container {
+  display: flex;
+  flex-direction: column; /* 세로 방향으로 배치 */
+  align-items: center; /* 수평 가운데 정렬 */
+  height: 100vh; /* 전체 화면 높이 */
+}
+.var {
+  margin-top: 22px;
+}
+h4 {
+    font-size: 24px;
+    color: #714c2f;
+    margin-right: 150px;
+    margin-bottom: 0;
+  }
+p {
+  color: #895d3c;
+  padding-right: 60px;
+  margin-top: 5px;
+}
+h6 {
   font-size: 20px;
-  color: #523522;
-  font-weight: bold;
-  margin-bottom: 6rem;
+  color: #714c2f;
+  margin-right: 200px;
+  margin-bottom: 10px;
 }
-
-.whatDo {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr); /* 3 columns */
-  grid-template-rows: repeat(2, 1fr); /* 2 rows */
-  gap: 20px; /* Space between buttons */
-  width: 100%; /* Allow the grid to take full width of its container */
-  max-width: 600px; /* Limit the maximum width */
-  margin: 20px 0; /* Add vertical spacing */
+.HStack {
+  width: 100%;
+}
+.image-button {
+  background: none;
+  border: none;
+  padding: 0;
+  margin: 0 5px; /* 이미지 버튼 간의 간격 설정 */
+  cursor: pointer;
 }
 
-.whatDo input[type="button"] {
-  width: 100%;
+.image-button img {
+  display: block;
 }
+.p7 {
+  margin-top: 50px;
+}