diff --git a/backend/models/profile.js b/backend/models/profile.js
new file mode 100644
index 0000000000000000000000000000000000000000..65ee68655154e78c9d8af7377e6516619249257a
--- /dev/null
+++ b/backend/models/profile.js
@@ -0,0 +1,23 @@
+const mongoose = require("mongoose");
+const mongooseAutoInc = require("mongoose-auto-increment");
+
+const ProfileSchema = new mongoose.Schema({
+ profile_photo: { type: String, required: true },
+ created_at: { type: Date, default: Date.now },
+ self_intro: { type: String },
+ user_id: { type: Number },
+ user_email: { type: String },
+ age: { type: Number },
+ location: { type: String },
+});
+
+// mongoose.connect("mongodb://localhost:27017/local", {
+// useFindAndModify: false,
+// useNewUrlParser: true,
+// useUnifiedTopology: true,
+// });
+// mongooseAutoInc.initialize(mongoose.connection);
+
+ProfileSchema.plugin(mongooseAutoInc.plugin, "profile");
+
+module.exports = mongoose.model("profile", ProfileSchema);
diff --git a/backend/routes/users.js b/backend/routes/users.js
index 917be755b0b24d86ff9084bc9b15633c8a43f136..081166f23a2c437ee92a47bfb6ecf11efd2f1463 100644
--- a/backend/routes/users.js
+++ b/backend/routes/users.js
@@ -5,6 +5,7 @@ var router = express.Router();
var UserModel = require("../models/user");
var BoardModel = require("../models/board");
var CommentModel = require("../models/comment");
+var ProfileModel = require("../models/profile");
var cors = require("cors");
const { ConnectionStates } = require("mongoose");
var path = require("path");
@@ -347,4 +348,90 @@ router.post("/writeComment", function (req, res) {
}
});
+router.get("/getProfileInfo", async function (req, res) {
+ console.log("/getProfileInfo 호출");
+ try {
+ let email = req.session.user.id;
+
+ let p = await ProfileModel.find({ user_email: email });
+
+ if (p) {
+ res.send(p);
+ } else {
+ res.send(null);
+ }
+ } catch (err) {
+ console.log(err);
+ }
+});
+
+router.post(
+ "/writeProfile",
+ upload.array("photo", 1),
+ async function (req, res) {
+ console.log("/writeProfile post 호출됨." + req.body);
+
+ try {
+ var files = req.files;
+
+ if (files.length > 0) {
+ console.log(files[0]);
+ } else {
+ console.log("업로드된 파일 x");
+ }
+
+ let originalname = "";
+ let filename = "";
+ let mimetype = "";
+ let size = 0;
+
+ if (Array.isArray(files)) {
+ console.log("배열에 들어있는 파일 갯수 : %d", files.length);
+
+ for (let i = 0; i < files.length; i++) {
+ originalname = files[i].originalname;
+ filename = files[i].filename;
+ mimetype = files[i].mimetype;
+ size = files[i].size;
+ }
+ } else {
+ console.log("파일 개수 : 1");
+ originalname = files[0].originalname;
+ filename = files[0].name;
+ mimetype = files[0].mimetype;
+ size = files[0].size;
+ }
+
+ console.log(
+ "현재 파일 정보 : " +
+ originalname +
+ ", " +
+ filename +
+ ", " +
+ mimetype +
+ ", " +
+ size
+ );
+
+ let updated = await ProfileModel.findOneAndUpdate(
+ { user_email: req.session.user.id },
+ {
+ profile_photo: filename,
+ self_intro: req.body.self_intro,
+ user_id: req.body.uid,
+ user_email: req.body.uem,
+ age: req.body.age,
+ location: req.body.loc,
+ },
+ { retrurnOriginal: false }
+ );
+ console.log("프로필 수정완료!!!");
+
+ res.redirect("http://localhost:3000/board");
+ } catch (err) {
+ console.log(err);
+ }
+ }
+);
+
module.exports = router;
diff --git a/backend/uploads/wiki_capture1607352954808.PNG b/backend/uploads/wiki_capture1607352954808.PNG
new file mode 100644
index 0000000000000000000000000000000000000000..9fa8cb978e932696f52ddd2c9633a86ee1ab9f56
Binary files /dev/null and b/backend/uploads/wiki_capture1607352954808.PNG differ
diff --git a/frontend/.eslintcache b/frontend/.eslintcache
index bfa24eed2d01f18111d29569c554c2ba8e92565d..14e955537906f79453248f5739a4a022452c0fc2 100644
--- a/frontend/.eslintcache
+++ b/frontend/.eslintcache
@@ -1 +1 @@
-[{"C:\\WYH\\frontend\\src\\reportWebVitals.js":"1","C:\\WYH\\frontend\\src\\App.js":"2","C:\\WYH\\frontend\\src\\index.js":"3","C:\\WYH\\frontend\\src\\components\\Profile.js":"4","C:\\WYH\\frontend\\src\\components\\Board.js":"5","C:\\WYH\\frontend\\src\\components\\Home.js":"6","C:\\WYH\\frontend\\src\\components\\Signup.js":"7","C:\\WYH\\frontend\\src\\components\\Login.js":"8","C:\\WYH\\frontend\\src\\components\\WriteBoard.js":"9","C:\\WYH\\frontend\\src\\components\\DetailBoard.js":"10"},{"size":362,"mtime":1606157613272,"results":"11","hashOfConfig":"12"},{"size":1342,"mtime":1607184086712,"results":"13","hashOfConfig":"12"},{"size":544,"mtime":1606240034288,"results":"14","hashOfConfig":"12"},{"size":1175,"mtime":1607184077239,"results":"15","hashOfConfig":"12"},{"size":1622,"mtime":1607166854480,"results":"16","hashOfConfig":"12"},{"size":370,"mtime":1606662762631,"results":"17","hashOfConfig":"12"},{"size":1575,"mtime":1606662809909,"results":"18","hashOfConfig":"12"},{"size":1232,"mtime":1606662786263,"results":"19","hashOfConfig":"12"},{"size":3419,"mtime":1607104090152,"results":"20","hashOfConfig":"12"},{"size":2475,"mtime":1607341349582,"results":"21","hashOfConfig":"12"},{"filePath":"22","messages":"23","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"10w9ldj",{"filePath":"24","messages":"25","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"26","messages":"27","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"28"},{"filePath":"29","messages":"30","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"31","messages":"32","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"33","usedDeprecatedRules":"28"},{"filePath":"34","messages":"35","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"36","messages":"37","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"38"},{"filePath":"39","messages":"40","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"41"},{"filePath":"42","messages":"43","errorCount":0,"warningCount":4,"fixableErrorCount":0,"fixableWarningCount":0,"source":"44","usedDeprecatedRules":"28"},{"filePath":"45","messages":"46","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\WYH\\frontend\\src\\reportWebVitals.js",[],"C:\\WYH\\frontend\\src\\App.js",["47"],"C:\\WYH\\frontend\\src\\index.js",[],["48","49"],"C:\\WYH\\frontend\\src\\components\\Profile.js",[],"C:\\WYH\\frontend\\src\\components\\Board.js",["50","51"],"import React, { useEffect, useState } from \"react\";\r\nimport { Route, Link } from \"react-router-dom\";\r\nimport axios from \"axios\";\r\n\r\nconst Board = () => {\r\n const [response, setResponse] = useState([]);\r\n\r\n useEffect(async () => {\r\n // try {\r\n // console.log(\"axios 실행\");\r\n // let res = [];\r\n // res = await axios.get(\"http://localhost:3001/board\");\r\n // console.log(res);\r\n // setResponse(res.data);\r\n // console.log(response);\r\n // } catch (err) {\r\n // console.log(\"axios err\");\r\n // console.log(err);\r\n // }\r\n async function fetchData() {\r\n console.log(\"react board get axios 호출\");\r\n const result = await axios.get(\"http://localhost:3001/board\");\r\n console.log(result.data);\r\n setResponse(result.data);\r\n }\r\n fetchData();\r\n }, []);\r\n\r\n return (\r\n <div>\r\n <button>\r\n <Link to=\"/writeBoard\">게시글 작성</Link>\r\n </button>\r\n <form action=\"http://localhost:3001/searchBoard\" method=\"post\">\r\n <input type=\"text\" name=\"searchKeyword\"></input>\r\n <button type=\"submit\">게시글검색</button>\r\n </form>\r\n <ol>\r\n {response.map((res) => (\r\n <li key={res._id}>\r\n {/* <Link to={`/detailBoard/${res._id}`}>\r\n <div onClick={handleOnClick(res._id)}>\r\n {res.title} {res.created_at}\r\n </div>\r\n </Link> */}\r\n <Link to={`/detailBoard/${res._id}`}>\r\n {res.title} {res.created_at}\r\n </Link>\r\n </li>\r\n ))}\r\n </ol>\r\n </div>\r\n );\r\n};\r\n\r\nexport default Board;\r\n","C:\\WYH\\frontend\\src\\components\\Home.js",["52"],"C:\\WYH\\frontend\\src\\components\\Signup.js",["53"],"import React, { useState } from \"react\";\r\n//import { post } from \"../../backend/app\";\r\nimport { post } from \"axios\";\r\n\r\nconst Signup = () => {\r\n const [email, setEmail] = useState(\"\");\r\n const [nicname, setNicname] = useState(\"\");\r\n const [password, setPassword] = useState(\"\");\r\n\r\n const onChangeEmail = (e) => setEmail(e.target.value);\r\n const onChangeNicname = (e) => setNicname(e.target.value);\r\n const onChangePassword = (e) => setPassword(e.target.value);\r\n\r\n // const handleFormSubmit = () => {\r\n // const url = \"/signup\";\r\n // const formData = new FormData();\r\n // formData.append(\"username\", username);\r\n // formData.append(\"password\", password);\r\n // formData.append(\"nicname\", nicname);\r\n\r\n // const config = {\r\n // headers: {\r\n // \"content-type\": \"multipart/form-data\",\r\n // },\r\n // };\r\n\r\n // return post(url, formData, config);\r\n // };\r\n\r\n return (\r\n <form action=\"http://localhost:3001/signup\" method=\"post\">\r\n <h1>회원가입</h1>\r\n 이메일:\r\n <input\r\n type=\"text\"\r\n name=\"email\"\r\n value={email}\r\n onChange={onChangeEmail}\r\n ></input>\r\n 비밀번호:\r\n <input\r\n type=\"password\"\r\n name=\"password\"\r\n value={password}\r\n onChange={onChangePassword}\r\n ></input>\r\n 닉네임:\r\n <input\r\n type=\"text\"\r\n name=\"nicname\"\r\n value={nicname}\r\n onChange={onChangeNicname}\r\n ></input>\r\n <button type=\"submit\">가입완료</button>\r\n </form>\r\n );\r\n};\r\n\r\nexport default Signup;\r\n","C:\\WYH\\frontend\\src\\components\\Login.js",["54"],"import React, { useState } from \"react\";\r\nimport { post } from \"axios\";\r\n\r\nconst Login = () => {\r\n const [username, setUsername] = useState(\"\");\r\n const [password, setPassword] = useState(\"\");\r\n\r\n const onChangeUsername = (e) => setUsername(e.target.value);\r\n const onChangePassword = (e) => setPassword(e.target.value);\r\n\r\n // const handleFormSubmit = () => {\r\n // const url = \"/login\";\r\n // let formData = new FormData();\r\n // formData.append(\"username\", username);\r\n // formData.append(\"password\", password);\r\n\r\n // let config = {\r\n // headers: {\r\n // \"content-type\": \"multipart/form-data\",\r\n // },\r\n // };\r\n\r\n // return post(url, formData, config);\r\n // };\r\n\r\n return (\r\n <form action=\"http://localhost:3001/login\" method=\"post\">\r\n <h1>로그인 화면</h1>\r\n 이메일:\r\n <input\r\n type=\"text\"\r\n name=\"email\"\r\n value={username}\r\n onChange={onChangeUsername}\r\n ></input>\r\n 비밀번호:\r\n <input\r\n type=\"password\"\r\n name=\"password\"\r\n value={password}\r\n onChange={onChangePassword}\r\n ></input>\r\n <button type=\"submit\">로그인</button>\r\n </form>\r\n );\r\n};\r\n\r\nexport default Login;\r\n","C:\\WYH\\frontend\\src\\components\\WriteBoard.js",["55","56","57","58"],"import React, { useState } from \"react\";\r\n\r\nconst WriteBoard = () => {\r\n const [title, setTitle] = useState(\"\");\r\n const [content, setContent] = useState(\"\");\r\n const [hobby, setHobby] = useState(\"\");\r\n\r\n const onChangeTitle = (e) => setTitle(e.target.value);\r\n const onChangeContent = (e) => setContent(e.target.value);\r\n const onChangeHobby = (e) => setHobby(e.target.value);\r\n\r\n return (\r\n <div>\r\n <form\r\n action=\"http://localhost:3001/writeBoard\"\r\n method=\"post\"\r\n encType=\"multipart/form-data\"\r\n >\r\n <label>제목</label>\r\n <input type=\"text\" name=\"title\" onChange={onChangeTitle}></input>\r\n <br></br>\r\n <label>본문</label>\r\n <textarea\r\n type=\"text\"\r\n name=\"content\"\r\n onChange={onChangeContent}\r\n ></textarea>\r\n <br></br>\r\n <label>취미</label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"ex/sp\" name=\"hobby\" />\r\n 운동/스포츠\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"out/tr\" name=\"hobby\" />\r\n 아웃도어/여행\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"bk/wr\" name=\"hobby\" />\r\n 인문학/책/글\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"fg/lg\" name=\"hobby\" />\r\n 외국/언어\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"cul/pfm\" name=\"hobby\" />\r\n 문화/공연\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"mu/inst\" name=\"hobby\" />\r\n 음악/악기\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"cft\" name=\"hobby\" />\r\n 공예/만들기\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"dan\" name=\"hobby\" />\r\n 댄스/무용\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"volu\" name=\"hobby\" />\r\n 봉사활동\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"par\" name=\"hobby\" />\r\n 사교/인맥\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"game\" name=\"hobby\" />\r\n 게임/오락\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"pic\" name=\"hobby\" />\r\n 사진/편집/촬영/영상\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"inv\" name=\"hobby\" />\r\n 제테크/투자\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"cok/fod\" name=\"hobby\" />\r\n 요리/음식/맛집\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"fas/bea\" name=\"hobby\" />\r\n 패션/뷰티/코디\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"art/draw\" name=\"hobby\" />\r\n 미술/그림\r\n </label>\r\n <br></br>\r\n <br></br>\r\n <label>사진첨부</label>\r\n <input type=\"file\" name=\"photo\"></input>\r\n <br></br>\r\n <button type=\"submit\">ok</button>\r\n </form>\r\n </div>\r\n );\r\n};\r\n\r\nexport default WriteBoard;\r\n","C:\\WYH\\frontend\\src\\components\\DetailBoard.js",["59","60","61"],{"ruleId":"62","severity":1,"message":"63","line":1,"column":17,"nodeType":"64","messageId":"65","endLine":1,"endColumn":26},{"ruleId":"66","replacedBy":"67"},{"ruleId":"68","replacedBy":"69"},{"ruleId":"62","severity":1,"message":"70","line":2,"column":10,"nodeType":"64","messageId":"65","endLine":2,"endColumn":15},{"ruleId":"71","severity":1,"message":"72","line":8,"column":13,"nodeType":"73","endLine":27,"endColumn":4},{"ruleId":"62","severity":1,"message":"70","line":2,"column":10,"nodeType":"64","messageId":"65","endLine":2,"endColumn":15},{"ruleId":"62","severity":1,"message":"74","line":3,"column":10,"nodeType":"64","messageId":"65","endLine":3,"endColumn":14},{"ruleId":"62","severity":1,"message":"74","line":2,"column":10,"nodeType":"64","messageId":"65","endLine":2,"endColumn":14},{"ruleId":"62","severity":1,"message":"75","line":4,"column":10,"nodeType":"64","messageId":"65","endLine":4,"endColumn":15},{"ruleId":"62","severity":1,"message":"76","line":5,"column":10,"nodeType":"64","messageId":"65","endLine":5,"endColumn":17},{"ruleId":"62","severity":1,"message":"77","line":6,"column":10,"nodeType":"64","messageId":"65","endLine":6,"endColumn":15},{"ruleId":"62","severity":1,"message":"78","line":10,"column":9,"nodeType":"64","messageId":"65","endLine":10,"endColumn":22},{"ruleId":"71","severity":1,"message":"72","line":31,"column":13,"nodeType":"73","endLine":47,"endColumn":4},{"ruleId":"71","severity":1,"message":"79","line":47,"column":6,"nodeType":"80","endLine":47,"endColumn":8,"suggestions":"81"},{"ruleId":"82","severity":1,"message":"83","line":57,"column":9,"nodeType":"84","endLine":57,"endColumn":71},"no-unused-vars","'Component' is defined but never used.","Identifier","unusedVar","no-native-reassign",["85"],"no-negated-in-lhs",["86"],"'Route' is defined but never used.","react-hooks/exhaustive-deps","Effect callbacks are synchronous to prevent race conditions. Put the async function inside:\n\nuseEffect(() => {\n async function fetchData() {\n // You can await here\n const response = await MyAPI.getData(someId);\n // ...\n }\n fetchData();\n}, [someId]); // Or [] if effect doesn't need props or state\n\nLearn more about data fetching with Hooks: https://reactjs.org/link/hooks-data-fetching","ArrowFunctionExpression","'post' is defined but never used.","'title' is assigned a value but never used.","'content' is assigned a value but never used.","'hobby' is assigned a value but never used.","'onChangeHobby' is assigned a value but never used.","React Hook useEffect has missing dependencies: 'Board' and 'board_id'. Either include them or remove the dependency array.","ArrayExpression",["87"],"jsx-a11y/alt-text","img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.","JSXOpeningElement","no-global-assign","no-unsafe-negation",{"desc":"88","fix":"89"},"Update the dependencies array to be: [Board, board_id]",{"range":"90","text":"91"},[1309,1311],"[Board, board_id]"]
\ No newline at end of file
+[{"C:\\WYH\\frontend\\src\\reportWebVitals.js":"1","C:\\WYH\\frontend\\src\\App.js":"2","C:\\WYH\\frontend\\src\\index.js":"3","C:\\WYH\\frontend\\src\\components\\Profile.js":"4","C:\\WYH\\frontend\\src\\components\\Board.js":"5","C:\\WYH\\frontend\\src\\components\\Home.js":"6","C:\\WYH\\frontend\\src\\components\\Signup.js":"7","C:\\WYH\\frontend\\src\\components\\Login.js":"8","C:\\WYH\\frontend\\src\\components\\WriteBoard.js":"9","C:\\WYH\\frontend\\src\\components\\DetailBoard.js":"10","C:\\WYH\\frontend\\src\\components\\WriteProfile.js":"11"},{"size":362,"mtime":1606157613272,"results":"12","hashOfConfig":"13"},{"size":1460,"mtime":1607351770511,"results":"14","hashOfConfig":"13"},{"size":544,"mtime":1606240034288,"results":"15","hashOfConfig":"13"},{"size":1175,"mtime":1607184077239,"results":"16","hashOfConfig":"13"},{"size":1713,"mtime":1607345137100,"results":"17","hashOfConfig":"13"},{"size":370,"mtime":1606662762631,"results":"18","hashOfConfig":"13"},{"size":1575,"mtime":1607345129868,"results":"19","hashOfConfig":"13"},{"size":1232,"mtime":1606662786263,"results":"20","hashOfConfig":"13"},{"size":3419,"mtime":1607104090152,"results":"21","hashOfConfig":"13"},{"size":2475,"mtime":1607341349582,"results":"22","hashOfConfig":"13"},{"size":1513,"mtime":1607353180173,"results":"23","hashOfConfig":"13"},{"filePath":"24","messages":"25","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"10w9ldj",{"filePath":"26","messages":"27","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"28","messages":"29","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"30"},{"filePath":"31","messages":"32","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"33","messages":"34","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"35","usedDeprecatedRules":"30"},{"filePath":"36","messages":"37","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"38","messages":"39","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"40","messages":"41","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"42"},{"filePath":"43","messages":"44","errorCount":0,"warningCount":4,"fixableErrorCount":0,"fixableWarningCount":0,"source":"45","usedDeprecatedRules":"30"},{"filePath":"46","messages":"47","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":"48"},{"filePath":"49","messages":"50","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\WYH\\frontend\\src\\reportWebVitals.js",[],"C:\\WYH\\frontend\\src\\App.js",["51"],"C:\\WYH\\frontend\\src\\index.js",[],["52","53"],"C:\\WYH\\frontend\\src\\components\\Profile.js",[],"C:\\WYH\\frontend\\src\\components\\Board.js",["54","55"],"import React, { useEffect, useState } from \"react\";\r\nimport { Route, Link } from \"react-router-dom\";\r\nimport axios from \"axios\";\r\n\r\nconst Board = () => {\r\n const [response, setResponse] = useState([]);\r\n\r\n useEffect(async () => {\r\n // try {\r\n // console.log(\"axios 실행\");\r\n // let res = [];\r\n // res = await axios.get(\"http://localhost:3001/board\");\r\n // console.log(res);\r\n // setResponse(res.data);\r\n // console.log(response);\r\n // } catch (err) {\r\n // console.log(\"axios err\");\r\n // console.log(err);\r\n // }\r\n async function fetchData() {\r\n console.log(\"react board get axios 호출\");\r\n const result = await axios.get(\"http://localhost:3001/board\");\r\n console.log(result.data);\r\n setResponse(result.data);\r\n }\r\n fetchData();\r\n }, []);\r\n\r\n return (\r\n <div>\r\n <button>\r\n <Link to=\"/writeBoard\">게시글 작성</Link>\r\n </button>\r\n <button>\r\n <Link to=\"/writeProfile\">프로필 작성</Link>\r\n </button>\r\n <form action=\"http://localhost:3001/searchBoard\" method=\"post\">\r\n <input type=\"text\" name=\"searchKeyword\"></input>\r\n <button type=\"submit\">게시글검색</button>\r\n </form>\r\n <ol>\r\n {response.map((res) => (\r\n <li key={res._id}>\r\n {/* <Link to={`/detailBoard/${res._id}`}>\r\n <div onClick={handleOnClick(res._id)}>\r\n {res.title} {res.created_at}\r\n </div>\r\n </Link> */}\r\n <Link to={`/detailBoard/${res._id}`}>\r\n {res.title} {res.created_at}\r\n </Link>\r\n </li>\r\n ))}\r\n </ol>\r\n </div>\r\n );\r\n};\r\n\r\nexport default Board;\r\n","C:\\WYH\\frontend\\src\\components\\Home.js",["56"],"C:\\WYH\\frontend\\src\\components\\Signup.js",["57"],"C:\\WYH\\frontend\\src\\components\\Login.js",["58"],"import React, { useState } from \"react\";\r\nimport { post } from \"axios\";\r\n\r\nconst Login = () => {\r\n const [username, setUsername] = useState(\"\");\r\n const [password, setPassword] = useState(\"\");\r\n\r\n const onChangeUsername = (e) => setUsername(e.target.value);\r\n const onChangePassword = (e) => setPassword(e.target.value);\r\n\r\n // const handleFormSubmit = () => {\r\n // const url = \"/login\";\r\n // let formData = new FormData();\r\n // formData.append(\"username\", username);\r\n // formData.append(\"password\", password);\r\n\r\n // let config = {\r\n // headers: {\r\n // \"content-type\": \"multipart/form-data\",\r\n // },\r\n // };\r\n\r\n // return post(url, formData, config);\r\n // };\r\n\r\n return (\r\n <form action=\"http://localhost:3001/login\" method=\"post\">\r\n <h1>로그인 화면</h1>\r\n 이메일:\r\n <input\r\n type=\"text\"\r\n name=\"email\"\r\n value={username}\r\n onChange={onChangeUsername}\r\n ></input>\r\n 비밀번호:\r\n <input\r\n type=\"password\"\r\n name=\"password\"\r\n value={password}\r\n onChange={onChangePassword}\r\n ></input>\r\n <button type=\"submit\">로그인</button>\r\n </form>\r\n );\r\n};\r\n\r\nexport default Login;\r\n","C:\\WYH\\frontend\\src\\components\\WriteBoard.js",["59","60","61","62"],"import React, { useState } from \"react\";\r\n\r\nconst WriteBoard = () => {\r\n const [title, setTitle] = useState(\"\");\r\n const [content, setContent] = useState(\"\");\r\n const [hobby, setHobby] = useState(\"\");\r\n\r\n const onChangeTitle = (e) => setTitle(e.target.value);\r\n const onChangeContent = (e) => setContent(e.target.value);\r\n const onChangeHobby = (e) => setHobby(e.target.value);\r\n\r\n return (\r\n <div>\r\n <form\r\n action=\"http://localhost:3001/writeBoard\"\r\n method=\"post\"\r\n encType=\"multipart/form-data\"\r\n >\r\n <label>제목</label>\r\n <input type=\"text\" name=\"title\" onChange={onChangeTitle}></input>\r\n <br></br>\r\n <label>본문</label>\r\n <textarea\r\n type=\"text\"\r\n name=\"content\"\r\n onChange={onChangeContent}\r\n ></textarea>\r\n <br></br>\r\n <label>취미</label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"ex/sp\" name=\"hobby\" />\r\n 운동/스포츠\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"out/tr\" name=\"hobby\" />\r\n 아웃도어/여행\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"bk/wr\" name=\"hobby\" />\r\n 인문학/책/글\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"fg/lg\" name=\"hobby\" />\r\n 외국/언어\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"cul/pfm\" name=\"hobby\" />\r\n 문화/공연\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"mu/inst\" name=\"hobby\" />\r\n 음악/악기\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"cft\" name=\"hobby\" />\r\n 공예/만들기\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"dan\" name=\"hobby\" />\r\n 댄스/무용\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"volu\" name=\"hobby\" />\r\n 봉사활동\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"par\" name=\"hobby\" />\r\n 사교/인맥\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"game\" name=\"hobby\" />\r\n 게임/오락\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"pic\" name=\"hobby\" />\r\n 사진/편집/촬영/영상\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"inv\" name=\"hobby\" />\r\n 제테크/투자\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"cok/fod\" name=\"hobby\" />\r\n 요리/음식/맛집\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"fas/bea\" name=\"hobby\" />\r\n 패션/뷰티/코디\r\n </label>\r\n <br></br>\r\n <label>\r\n <input type=\"radio\" value=\"art/draw\" name=\"hobby\" />\r\n 미술/그림\r\n </label>\r\n <br></br>\r\n <br></br>\r\n <label>사진첨부</label>\r\n <input type=\"file\" name=\"photo\"></input>\r\n <br></br>\r\n <button type=\"submit\">ok</button>\r\n </form>\r\n </div>\r\n );\r\n};\r\n\r\nexport default WriteBoard;\r\n","C:\\WYH\\frontend\\src\\components\\DetailBoard.js",["63","64","65"],"import React, { useEffect, useState } from \"react\";\r\nimport axios from \"axios\";\r\nimport { Link } from \"react-router-dom\";\r\n\r\nconst DetailBoard = ({ match }) => {\r\n const { board_id } = match.params;\r\n const [Board, setBoard] = useState({\r\n title: \"\",\r\n content: \"\",\r\n hobby: \"\",\r\n picture: \"\",\r\n writer: \"\",\r\n created_at: \"\",\r\n _id: \"\",\r\n });\r\n // const [Comments, setComments] = useState({\r\n // _id: \"\",\r\n // board_id: \"\",\r\n // writer: \"\",\r\n // input: \"\",\r\n // });\r\n const [Comments, setComments] = useState([]);\r\n const [Imgurl, setImgurl] = useState(\"\");\r\n const [Comment, setComment] = useState(\"\");\r\n\r\n const onChangeComment = (e) => setComment(e.target.value);\r\n\r\n console.dir(match.params);\r\n console.log(\"board_id : \" + board_id);\r\n\r\n useEffect(async () => {\r\n async function fetchData() {\r\n console.log(\"react detailBoard axios post 호출1\");\r\n let res = await axios.post(\"http://localhost:3001/getDetailBoard\", {\r\n id: board_id,\r\n });\r\n console.log(\"res : \");\r\n console.dir(res);\r\n setBoard(res.data.detailBoard);\r\n console.log(Board);\r\n setComments(res.data.boardComments);\r\n setImgurl(\r\n \"http://localhost:3001/uploads/\" + res.data.detailBoard.picture\r\n );\r\n }\r\n fetchData();\r\n }, []);\r\n\r\n return (\r\n <>\r\n <Link to=\"/profile\">작성자 : {Board.writer}</Link>\r\n <h3 style={{ width: \"50%\", border: \"1px solid black\" }}>{Board.title}</h3>\r\n <div style={{ width: \"80%\", border: \"1px solid black\" }}>\r\n {Board.content}\r\n </div>\r\n <div>\r\n <img src={Imgurl} style={{ width: \"600px\", height: \"600px\" }}></img>\r\n </div>\r\n <div>\r\n <form method=\"post\" action=\"http://localhost:3001/writeComment\">\r\n <input\r\n type=\"text\"\r\n placeholder=\"댓글을 작성해 주세요.\"\r\n name=\"comment\"\r\n value={Comment}\r\n onChange={onChangeComment}\r\n ></input>\r\n <input type=\"hidden\" name=\"writer\" value={Board.writer}></input>\r\n <input type=\"hidden\" name=\"boardId\" value={Board._id}></input>\r\n <button type=\"submit\">작성완료</button>\r\n </form>\r\n </div>\r\n <div>\r\n <ol>\r\n {Comments.map((c) => (\r\n <li key={c._id}>\r\n {c.input} {c.writer}\r\n </li>\r\n ))}\r\n </ol>\r\n </div>\r\n </>\r\n );\r\n};\r\n\r\nexport default DetailBoard;\r\n","C:\\WYH\\frontend\\src\\components\\WriteProfile.js",["66"],{"ruleId":"67","severity":1,"message":"68","line":1,"column":17,"nodeType":"69","messageId":"70","endLine":1,"endColumn":26},{"ruleId":"71","replacedBy":"72"},{"ruleId":"73","replacedBy":"74"},{"ruleId":"67","severity":1,"message":"75","line":2,"column":10,"nodeType":"69","messageId":"70","endLine":2,"endColumn":15},{"ruleId":"76","severity":1,"message":"77","line":8,"column":13,"nodeType":"78","endLine":27,"endColumn":4},{"ruleId":"67","severity":1,"message":"75","line":2,"column":10,"nodeType":"69","messageId":"70","endLine":2,"endColumn":15},{"ruleId":"67","severity":1,"message":"79","line":3,"column":10,"nodeType":"69","messageId":"70","endLine":3,"endColumn":14},{"ruleId":"67","severity":1,"message":"79","line":2,"column":10,"nodeType":"69","messageId":"70","endLine":2,"endColumn":14},{"ruleId":"67","severity":1,"message":"80","line":4,"column":10,"nodeType":"69","messageId":"70","endLine":4,"endColumn":15},{"ruleId":"67","severity":1,"message":"81","line":5,"column":10,"nodeType":"69","messageId":"70","endLine":5,"endColumn":17},{"ruleId":"67","severity":1,"message":"82","line":6,"column":10,"nodeType":"69","messageId":"70","endLine":6,"endColumn":15},{"ruleId":"67","severity":1,"message":"83","line":10,"column":9,"nodeType":"69","messageId":"70","endLine":10,"endColumn":22},{"ruleId":"76","severity":1,"message":"77","line":31,"column":13,"nodeType":"78","endLine":47,"endColumn":4},{"ruleId":"76","severity":1,"message":"84","line":47,"column":6,"nodeType":"85","endLine":47,"endColumn":8,"suggestions":"86"},{"ruleId":"87","severity":1,"message":"88","line":57,"column":9,"nodeType":"89","endLine":57,"endColumn":71},{"ruleId":"76","severity":1,"message":"77","line":15,"column":13,"nodeType":"78","endLine":23,"endColumn":4},"no-unused-vars","'Component' is defined but never used.","Identifier","unusedVar","no-native-reassign",["90"],"no-negated-in-lhs",["91"],"'Route' is defined but never used.","react-hooks/exhaustive-deps","Effect callbacks are synchronous to prevent race conditions. Put the async function inside:\n\nuseEffect(() => {\n async function fetchData() {\n // You can await here\n const response = await MyAPI.getData(someId);\n // ...\n }\n fetchData();\n}, [someId]); // Or [] if effect doesn't need props or state\n\nLearn more about data fetching with Hooks: https://reactjs.org/link/hooks-data-fetching","ArrowFunctionExpression","'post' is defined but never used.","'title' is assigned a value but never used.","'content' is assigned a value but never used.","'hobby' is assigned a value but never used.","'onChangeHobby' is assigned a value but never used.","React Hook useEffect has missing dependencies: 'Board' and 'board_id'. Either include them or remove the dependency array.","ArrayExpression",["92"],"jsx-a11y/alt-text","img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.","JSXOpeningElement","no-global-assign","no-unsafe-negation",{"desc":"93","fix":"94"},"Update the dependencies array to be: [Board, board_id]",{"range":"95","text":"96"},[1309,1311],"[Board, board_id]"]
\ No newline at end of file
diff --git a/frontend/src/App.js b/frontend/src/App.js
index 37eff427465cc7c85220f8e449748f652ac62b72..325dd00f38a4e94cc5b8af926edc194dc4e9ef1a 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -7,6 +7,7 @@ import Profile from "./components/Profile";
import Board from "./components/Board";
import WriteBoard from "./components/WriteBoard";
import DetailBoard from "./components/DetailBoard";
+import WriteProfile from "./components/WriteProfile";
//class App extends Component {
// state = {
@@ -41,6 +42,7 @@ const App = () => {
<Route path="/board" component={Board} />
<Route path="/writeBoard" component={WriteBoard} />
<Route path="/detailBoard/:board_id" component={DetailBoard} />
+ <Route path="/writeProfile" compenent={WriteProfile} />
</div>
);
};
diff --git a/frontend/src/components/Board.js b/frontend/src/components/Board.js
index 1b57b68cac6f6136310b1c02bc6eef99ddbaa9a4..82b93a13207f9090d3967a49f2f589f45e41a8eb 100644
--- a/frontend/src/components/Board.js
+++ b/frontend/src/components/Board.js
@@ -31,6 +31,9 @@ const Board = () => {
<button>
<Link to="/writeBoard">게시글 작성</Link>
</button>
+ <button>
+ <Link to="/writeProfile">프로필 작성</Link>
+ </button>
<form action="http://localhost:3001/searchBoard" method="post">
<input type="text" name="searchKeyword"></input>
<button type="submit">게시글검색</button>
diff --git a/frontend/src/components/WriteProfile.js b/frontend/src/components/WriteProfile.js
new file mode 100644
index 0000000000000000000000000000000000000000..5c47f313f9a113c83e12c97ec1eede33dd176f14
--- /dev/null
+++ b/frontend/src/components/WriteProfile.js
@@ -0,0 +1,58 @@
+import React, { useEffect, useState } from "react";
+import axios from "axios";
+
+const WriteProfile = () => {
+ const [Profile, setProfile] = useState({
+ profile_photo: "",
+ created_at: "",
+ self_intro: "",
+ user_id: "",
+ user_email: "",
+ location: "",
+ age: "",
+ });
+
+ useEffect(async () => {
+ async function fetchData() {
+ console.log("writeProfile axios get 호출");
+ let res = axios.get("http://localhost:3001/getProfileInfo");
+ console.log(res);
+ setProfile(res.data);
+ }
+ fetchData();
+ }, []);
+
+ return (
+ <form method="post" action="http://localhost:3001/writeProfile">
+ <input type="hidden" value={Profile.user_id} name="uid"></input>
+ <input type="hidden" value={Profile.user_email} name="uem"></input>
+ <input
+ type="file"
+ name="photo"
+ placeholder="프로필 사진"
+ value={Profile.profile_photo}
+ ></input>
+ <input
+ type="text"
+ name="self_intro"
+ placeholder="간단한 자기소개 및 관심사"
+ value={Profile.self_intro}
+ ></input>
+ <input
+ type="text"
+ name="age"
+ placeholder="나이"
+ value={Profile.age}
+ ></input>
+ <input
+ type="text"
+ name="loc"
+ placeholder="사는 곳"
+ value={Profile.location}
+ ></input>
+ <button type="submit">작성 완료</button>
+ </form>
+ );
+};
+
+export default WriteProfile;