From 9c178639a0e1d278f0129d17bf879c8910fd060c Mon Sep 17 00:00:00 2001 From: 27Lia Date: Thu, 17 Aug 2023 15:43:34 +0900 Subject: [PATCH 1/3] =?UTF-8?q?feat:=20api=EC=97=B0=EA=B2=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/pages/AskQuestionPage.js | 38 +++++++++++++++++++++++++++-- 1 file changed, 36 insertions(+), 2 deletions(-) diff --git a/client/src/pages/AskQuestionPage.js b/client/src/pages/AskQuestionPage.js index 3c39470f..3102d730 100644 --- a/client/src/pages/AskQuestionPage.js +++ b/client/src/pages/AskQuestionPage.js @@ -5,13 +5,13 @@ import { useSelector, useDispatch } from 'react-redux'; import QuestionPageDropdown from '../components/QuestionPageDropdown'; // import Header from '../components/Header'; // import Footer from '../components/Footer'; +import axios from 'axios'; const StyleAskPage = styled.div` background-color: #f8f9f9; display: flex; flex-direction: column; align-items: center; - height: 100vh; margin-top: 56px; // 사이드 여백 조정 @@ -224,11 +224,45 @@ function AskQuestionPage() { }; // 질문 검토 버튼 클릭 핸들러 - const handleReviewButtonClick = () => { + const handleReviewButtonClick = async () => { // reviewButtonVisible 상태를 숨김(false)으로 변경 dispatch({ type: 'SET_REVIEW_BUTTON_VISIBLE', payload: false }); //checkContainerVisible 상태를 숨김(false)으로 변경 dispatch({ type: 'SET_CHECK_CONTAINER_VISIBLE', payload: false }); + + const titleInput = document.querySelector('.title-input'); + const contentInput = editorRef.current.editor.getData(); + + const title = titleInput.value; // 유저가 입력한 제목 + const questionBody = contentInput; // 유저가 입력한 내용 + + console.log(title, questionBody); + + // 요청 할 데이터값 정의 + const requestData = { + memberId: 2, + title, + questionBody, + nickname: '닉네임1', + }; + + console.log(requestData); + + // 주소값 정의 + const ipv4 = 'http://13.124.105.17:8080'; + + try { + // 백엔드 API로 HTTP POST 요청 보내기 + const response = await axios.post( + `${ipv4}/questions/new-questions`, + requestData, + ); + // 응답 처리 (예: 성공 메시지 표시) + console.log('질문이 성공적으로 제출되었습니다:', response); + } catch (error) { + // 오류 처리 (예: 오류 메시지 표시) + console.error('질문 제출 오류:', error); + } }; // 체크박스 변경 핸들러 함수 From 7f6530aae9ddcb8cf777b98d3743d117c099663d Mon Sep 17 00:00:00 2001 From: 27Lia Date: Thu, 17 Aug 2023 17:34:52 +0900 Subject: [PATCH 2/3] =?UTF-8?q?feat:=20api=20=EB=B0=8F=20=EC=A7=88?= =?UTF-8?q?=EB=AC=B8=EC=83=81=EC=84=B8=ED=8E=98=EC=9D=B4=EC=A7=80=20naviga?= =?UTF-8?q?te=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/package-lock.json | 61 +++++++++++++++++++++-------- client/package.json | 3 +- client/src/index.js | 5 ++- client/src/pages/AskQuestionPage.js | 12 +++--- 4 files changed, 58 insertions(+), 23 deletions(-) diff --git a/client/package-lock.json b/client/package-lock.json index 7f2c503f..a18be1e6 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -25,11 +25,12 @@ "@testing-library/jest-dom": "^5.17.0", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", + "axios": "^1.4.0", "raw-loader": "^4.0.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-redux": "^8.1.2", - "react-router-dom": "^6.14.2", + "react-router-dom": "^6.15.0", "react-scripts": "5.0.1", "redux": "^4.1.2", "styled-components": "^6.0.7", @@ -5605,11 +5606,11 @@ } }, "node_modules/@remix-run/router": { - "version": "1.7.2", - "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.7.2.tgz", - "integrity": "sha512-7Lcn7IqGMV+vizMPoEl5F0XDshcdDYtMI6uJLQdQz5CfZAwy3vvGKYSUk789qndt5dEC4HfSjviSYlSoHGL2+A==", + "version": "1.8.0", + "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.8.0.tgz", + "integrity": "sha512-mrfKqIHnSZRyIzBcanNJmVQELTnX+qagEDlcKO90RgRBVOZGSGvZKeDihTRfWcqoDn5N/NkUcwWTccnpN18Tfg==", "engines": { - "node": ">=14" + "node": ">=14.0.0" } }, "node_modules/@rollup/plugin-babel": { @@ -7689,6 +7690,29 @@ "node": ">=4" } }, + "node_modules/axios": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/axios/-/axios-1.4.0.tgz", + "integrity": "sha512-S4XCWMEmzvo64T9GfvQDOXgYRDJ/wsSZc7Jvdgx5u1sd0JwsuPLqb3SYmusag+edF6ziyMensPVqLTSc1PiSEA==", + "dependencies": { + "follow-redirects": "^1.15.0", + "form-data": "^4.0.0", + "proxy-from-env": "^1.1.0" + } + }, + "node_modules/axios/node_modules/form-data": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.0.tgz", + "integrity": "sha512-ETEklSGi5t0QMZuiXoA/Q6vcnxcLQP5vdugSpuAyi6SVGi2clPPp+xgEhuMaHC+zGgn31Kd235W35f7Hykkaww==", + "dependencies": { + "asynckit": "^0.4.0", + "combined-stream": "^1.0.8", + "mime-types": "^2.1.12" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/axobject-query": { "version": "3.2.1", "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-3.2.1.tgz", @@ -17446,6 +17470,11 @@ "node": ">= 0.10" } }, + "node_modules/proxy-from-env": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz", + "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==" + }, "node_modules/psl": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/psl/-/psl-1.9.0.tgz", @@ -17805,29 +17834,29 @@ } }, "node_modules/react-router": { - "version": "6.14.2", - "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.14.2.tgz", - "integrity": "sha512-09Zss2dE2z+T1D03IheqAFtK4UzQyX8nFPWx6jkwdYzGLXd5ie06A6ezS2fO6zJfEb/SpG6UocN2O1hfD+2urQ==", + "version": "6.15.0", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.15.0.tgz", + "integrity": "sha512-NIytlzvzLwJkCQj2HLefmeakxxWHWAP+02EGqWEZy+DgfHHKQMUoBBjUQLOtFInBMhWtb3hiUy6MfFgwLjXhqg==", "dependencies": { - "@remix-run/router": "1.7.2" + "@remix-run/router": "1.8.0" }, "engines": { - "node": ">=14" + "node": ">=14.0.0" }, "peerDependencies": { "react": ">=16.8" } }, "node_modules/react-router-dom": { - "version": "6.14.2", - "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.14.2.tgz", - "integrity": "sha512-5pWX0jdKR48XFZBuJqHosX3AAHjRAzygouMTyimnBPOLdY3WjzUSKhus2FVMihUFWzeLebDgr4r8UeQFAct7Bg==", + "version": "6.15.0", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.15.0.tgz", + "integrity": "sha512-aR42t0fs7brintwBGAv2+mGlCtgtFQeOzK0BM1/OiqEzRejOZtpMZepvgkscpMUnKb8YO84G7s3LsHnnDNonbQ==", "dependencies": { - "@remix-run/router": "1.7.2", - "react-router": "6.14.2" + "@remix-run/router": "1.8.0", + "react-router": "6.15.0" }, "engines": { - "node": ">=14" + "node": ">=14.0.0" }, "peerDependencies": { "react": ">=16.8", diff --git a/client/package.json b/client/package.json index 04106456..3257d3e3 100644 --- a/client/package.json +++ b/client/package.json @@ -20,11 +20,12 @@ "@testing-library/jest-dom": "^5.17.0", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", + "axios": "^1.4.0", "raw-loader": "^4.0.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-redux": "^8.1.2", - "react-router-dom": "^6.14.2", + "react-router-dom": "^6.15.0", "react-scripts": "5.0.1", "redux": "^4.1.2", "styled-components": "^6.0.7", diff --git a/client/src/index.js b/client/src/index.js index 9958c0e9..78d02693 100644 --- a/client/src/index.js +++ b/client/src/index.js @@ -5,12 +5,15 @@ import App from './App'; import reportWebVitals from './reportWebVitals'; import { Provider } from 'react-redux'; import store from './store'; +import { BrowserRouter } from 'react-router-dom'; const root = ReactDOM.createRoot(document.getElementById('root')); root.render( - + + + , ); diff --git a/client/src/pages/AskQuestionPage.js b/client/src/pages/AskQuestionPage.js index 3102d730..ba2abbfa 100644 --- a/client/src/pages/AskQuestionPage.js +++ b/client/src/pages/AskQuestionPage.js @@ -6,6 +6,7 @@ import QuestionPageDropdown from '../components/QuestionPageDropdown'; // import Header from '../components/Header'; // import Footer from '../components/Footer'; import axios from 'axios'; +import { useNavigate } from 'react-router-dom'; const StyleAskPage = styled.div` background-color: #f8f9f9; @@ -140,6 +141,8 @@ const StyleAskPage = styled.div` `; function AskQuestionPage() { + const navigate = useNavigate(); + const editorRef = useRef(null); const editor2Ref = useRef(null); const TagRef = useRef(null); @@ -236,18 +239,14 @@ function AskQuestionPage() { const title = titleInput.value; // 유저가 입력한 제목 const questionBody = contentInput; // 유저가 입력한 내용 - console.log(title, questionBody); - // 요청 할 데이터값 정의 const requestData = { memberId: 2, + nickname: '닉네임1', title, questionBody, - nickname: '닉네임1', }; - console.log(requestData); - // 주소값 정의 const ipv4 = 'http://13.124.105.17:8080'; @@ -259,6 +258,9 @@ function AskQuestionPage() { ); // 응답 처리 (예: 성공 메시지 표시) console.log('질문이 성공적으로 제출되었습니다:', response); + if (response.status === 201) { + navigate(`/questions/${response.data.questionId}`); //질문디테일페이지로 이동 + } } catch (error) { // 오류 처리 (예: 오류 메시지 표시) console.error('질문 제출 오류:', error); From 7e953abe4aed7df3500d72c358ba3421ae83ee3a Mon Sep 17 00:00:00 2001 From: 27Lia Date: Fri, 18 Aug 2023 23:43:30 +0900 Subject: [PATCH 3/3] =?UTF-8?q?feat:=20api=20=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/index.js | 5 +---- client/src/pages/AskQuestionPage.js | 6 ------ 2 files changed, 1 insertion(+), 10 deletions(-) diff --git a/client/src/index.js b/client/src/index.js index 78d02693..9958c0e9 100644 --- a/client/src/index.js +++ b/client/src/index.js @@ -5,15 +5,12 @@ import App from './App'; import reportWebVitals from './reportWebVitals'; import { Provider } from 'react-redux'; import store from './store'; -import { BrowserRouter } from 'react-router-dom'; const root = ReactDOM.createRoot(document.getElementById('root')); root.render( - - - + , ); diff --git a/client/src/pages/AskQuestionPage.js b/client/src/pages/AskQuestionPage.js index ba2abbfa..ff788f6f 100644 --- a/client/src/pages/AskQuestionPage.js +++ b/client/src/pages/AskQuestionPage.js @@ -6,7 +6,6 @@ import QuestionPageDropdown from '../components/QuestionPageDropdown'; // import Header from '../components/Header'; // import Footer from '../components/Footer'; import axios from 'axios'; -import { useNavigate } from 'react-router-dom'; const StyleAskPage = styled.div` background-color: #f8f9f9; @@ -141,8 +140,6 @@ const StyleAskPage = styled.div` `; function AskQuestionPage() { - const navigate = useNavigate(); - const editorRef = useRef(null); const editor2Ref = useRef(null); const TagRef = useRef(null); @@ -258,9 +255,6 @@ function AskQuestionPage() { ); // 응답 처리 (예: 성공 메시지 표시) console.log('질문이 성공적으로 제출되었습니다:', response); - if (response.status === 201) { - navigate(`/questions/${response.data.questionId}`); //질문디테일페이지로 이동 - } } catch (error) { // 오류 처리 (예: 오류 메시지 표시) console.error('질문 제출 오류:', error);