Skip to content

GitLab

Commit 9ad00da0 authored by JeongYeonwoo's avatar JeongYeonwoo
Browse files

profile, homepage, router, navbar

parent 22311088
Show whitespace changes
Inline Side-by-side
client/.eslintcache
View file @ 9ad00da0
[{"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\reportWebVitals.js":"1","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\App.js":"2","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\ProfilePage.js":"3","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\index.js":"4","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Hello.js":"5","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\homePage.js":"6","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\HomePage.js":"7"},{"size":362,"mtime":1608689321626,"results":"8","hashOfConfig":"9"},{"size":318,"mtime":1609262769832,"results":"10","hashOfConfig":"9"},{"size":4767,"mtime":1609263408377,"results":"11","hashOfConfig":"9"},{"size":1076,"mtime":1609261820667,"results":"12","hashOfConfig":"9"},{"size":1238,"mtime":1609263419304,"results":"13","hashOfConfig":"9"},{"size":356,"mtime":1609260857173,"results":"14","hashOfConfig":"9"},{"size":1590,"mtime":1609263415754,"results":"15","hashOfConfig":"9"},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"zqy9n4",{"filePath":"18","messages":"19","errorCount":0,"warningCount":7,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"20","messages":"21","errorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"22","messages":"23","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"24","messages":"25","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"26","messages":"27","errorCount":1,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"28","messages":"29","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\reportWebVitals.js",[],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\App.js",["30","31","32","33","34","35","36"],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\ProfilePage.js",["37","38","39","40","41"],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\index.js",["42"],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Hello.js",["43","44"],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\homePage.js",["45","46"],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\HomePage.js",["47","48"],{"ruleId":"49","severity":1,"message":"50","line":1,"column":27,"nodeType":"51","messageId":"52","endLine":1,"endColumn":33},{"ruleId":"49","severity":1,"message":"53","line":1,"column":35,"nodeType":"51","messageId":"52","endLine":1,"endColumn":40},{"ruleId":"49","severity":1,"message":"54","line":1,"column":42,"nodeType":"51","messageId":"52","endLine":1,"endColumn":50},{"ruleId":"49","severity":1,"message":"55","line":1,"column":52,"nodeType":"51","messageId":"52","endLine":1,"endColumn":58},{"ruleId":"49","severity":1,"message":"56","line":1,"column":60,"nodeType":"51","messageId":"52","endLine":1,"endColumn":73},{"ruleId":"49","severity":1,"message":"57","line":2,"column":8,"nodeType":"51","messageId":"52","endLine":2,"endColumn":13},{"ruleId":"49","severity":1,"message":"58","line":4,"column":8,"nodeType":"51","messageId":"52","endLine":4,"endColumn":19},{"ruleId":"49","severity":1,"message":"59","line":4,"column":42,"nodeType":"51","messageId":"52","endLine":4,"endColumn":53},{"ruleId":"49","severity":1,"message":"50","line":5,"column":27,"nodeType":"51","messageId":"52","endLine":5,"endColumn":33},{"ruleId":"49","severity":1,"message":"53","line":5,"column":35,"nodeType":"51","messageId":"52","endLine":5,"endColumn":40},{"ruleId":"49","severity":1,"message":"55","line":5,"column":52,"nodeType":"51","messageId":"52","endLine":5,"endColumn":58},{"ruleId":"49","severity":1,"message":"60","line":5,"column":60,"nodeType":"51","messageId":"52","endLine":5,"endColumn":64},{"ruleId":"49","severity":1,"message":"56","line":5,"column":60,"nodeType":"51","messageId":"52","endLine":5,"endColumn":73},{"ruleId":"49","severity":1,"message":"61","line":1,"column":31,"nodeType":"51","messageId":"52","endLine":1,"endColumn":35},{"ruleId":"49","severity":1,"message":"59","line":1,"column":37,"nodeType":"51","messageId":"52","endLine":1,"endColumn":48},{"ruleId":"49","severity":1,"message":"57","line":5,"column":10,"nodeType":"51","messageId":"52","endLine":5,"endColumn":15},{"ruleId":"62","severity":2,"message":"63","line":20,"column":16,"nodeType":"51","messageId":"64","endLine":20,"endColumn":24},{"ruleId":"49","severity":1,"message":"61","line":1,"column":31,"nodeType":"51","messageId":"52","endLine":1,"endColumn":35},{"ruleId":"49","severity":1,"message":"59","line":1,"column":37,"nodeType":"51","messageId":"52","endLine":1,"endColumn":48},"no-unused-vars","'Router' is defined but never used.","Identifier","unusedVar","'Route' is defined but never used.","'Redirect' is defined but never used.","'Switch' is defined but never used.","'BrowserRouter' is defined but never used.","'Hello' is defined but never used.","'ProfilePage' is defined but never used.","'FormControl' is defined but never used.","'Link' is defined but never used.","'Form' is defined but never used.","no-undef","'HomePage' is not defined.","undef"] [{"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\reportWebVitals.js":"1","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\App.js":"2","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\ProfilePage.js":"3","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\index.js":"4","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Hello.js":"5","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\homePage.js":"6","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\HomePage.js":"7"},{"size":362,"mtime":1608689321626,"results":"8","hashOfConfig":"9"},{"size":318,"mtime":1609262769832,"results":"10","hashOfConfig":"9"},{"size":5997,"mtime":1609293778920,"results":"11","hashOfConfig":"9"},{"size":1076,"mtime":1609261820667,"results":"12","hashOfConfig":"9"},{"size":1238,"mtime":1609263419304,"results":"13","hashOfConfig":"9"},{"size":356,"mtime":1609260857173,"results":"14","hashOfConfig":"9"},{"size":1590,"mtime":1609263415754,"results":"15","hashOfConfig":"9"},{"filePath":"16","messages":"17","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"zqy9n4",{"filePath":"18","messages":"19","errorCount":0,"warningCount":7,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"20","messages":"21","errorCount":0,"warningCount":5,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"22","messages":"23","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"24"},{"filePath":"25","messages":"26","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"27","messages":"28","errorCount":1,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"29","messages":"30","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\reportWebVitals.js",[],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\App.js",["31","32","33","34","35","36","37"],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\ProfilePage.js",["38","39","40","41","42"],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\index.js",["43"],"import React from 'react';\nimport ReactDOM from 'react-dom';\nimport 'bootstrap/dist/css/bootstrap.min.css';\nimport './index.css';\nimport { BrowserRouter as Router, Route, Redirect, Switch, BrowserRouter } from 'react-router-dom';\nimport App from './App';\nimport reportWebVitals from './reportWebVitals';\nimport ProfilePage from './Pages/ProfilePage';\nimport Hello from './Hello'\nimport HomePage from './Pages/HomePage'\n\nReactDOM.render(\n <Router>\n <Switch>\n <Route exact path=\"/\" component={App} />\n <Route path=\"/hello\" component={Hello} />\n <Route path=\"/homepage\" component={HomePage} />\n <Route path=\"/profilepage\" component={ProfilePage} />\n <Redirect path='/hello' to='/hello'/>\n </Switch>\n </Router>,\n\n // <React.StrictMode>\n // <App />\n // </React.StrictMode>,\n document.getElementById('root')\n);\n\n// If you want to start measuring performance in your app, pass a function\n// to log results (for example: reportWebVitals(console.log))\n// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals\nreportWebVitals();\n","C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Hello.js",["44","45"],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\homePage.js",["46","47"],"C:\\Users\\82109\\Desktop\\JS\\messenger\\client\\src\\Pages\\HomePage.js",["48","49"],{"ruleId":"50","severity":1,"message":"51","line":1,"column":27,"nodeType":"52","messageId":"53","endLine":1,"endColumn":33},{"ruleId":"50","severity":1,"message":"54","line":1,"column":35,"nodeType":"52","messageId":"53","endLine":1,"endColumn":40},{"ruleId":"50","severity":1,"message":"55","line":1,"column":42,"nodeType":"52","messageId":"53","endLine":1,"endColumn":50},{"ruleId":"50","severity":1,"message":"56","line":1,"column":52,"nodeType":"52","messageId":"53","endLine":1,"endColumn":58},{"ruleId":"50","severity":1,"message":"57","line":1,"column":60,"nodeType":"52","messageId":"53","endLine":1,"endColumn":73},{"ruleId":"50","severity":1,"message":"58","line":2,"column":8,"nodeType":"52","messageId":"53","endLine":2,"endColumn":13},{"ruleId":"50","severity":1,"message":"59","line":4,"column":8,"nodeType":"52","messageId":"53","endLine":4,"endColumn":19},{"ruleId":"50","severity":1,"message":"60","line":4,"column":42,"nodeType":"52","messageId":"53","endLine":4,"endColumn":53},{"ruleId":"50","severity":1,"message":"51","line":5,"column":27,"nodeType":"52","messageId":"53","endLine":5,"endColumn":33},{"ruleId":"50","severity":1,"message":"54","line":5,"column":35,"nodeType":"52","messageId":"53","endLine":5,"endColumn":40},{"ruleId":"50","severity":1,"message":"56","line":5,"column":52,"nodeType":"52","messageId":"53","endLine":5,"endColumn":58},{"ruleId":"50","severity":1,"message":"61","line":5,"column":60,"nodeType":"52","messageId":"53","endLine":5,"endColumn":64},{"ruleId":"50","severity":1,"message":"57","line":5,"column":60,"nodeType":"52","messageId":"53","endLine":5,"endColumn":73},{"ruleId":"50","severity":1,"message":"62","line":1,"column":31,"nodeType":"52","messageId":"53","endLine":1,"endColumn":35},{"ruleId":"50","severity":1,"message":"60","line":1,"column":37,"nodeType":"52","messageId":"53","endLine":1,"endColumn":48},{"ruleId":"50","severity":1,"message":"58","line":5,"column":10,"nodeType":"52","messageId":"53","endLine":5,"endColumn":15},{"ruleId":"63","severity":2,"message":"64","line":20,"column":16,"nodeType":"52","messageId":"65","endLine":20,"endColumn":24},{"ruleId":"50","severity":1,"message":"62","line":1,"column":31,"nodeType":"52","messageId":"53","endLine":1,"endColumn":35},{"ruleId":"50","severity":1,"message":"60","line":1,"column":37,"nodeType":"52","messageId":"53","endLine":1,"endColumn":48},"no-unused-vars","'Router' is defined but never used.","Identifier","unusedVar","'Route' is defined but never used.","'Redirect' is defined but never used.","'Switch' is defined but never used.","'BrowserRouter' is defined but never used.","'Hello' is defined but never used.","'ProfilePage' is defined but never used.","'FormControl' is defined but never used.","'Link' is defined but never used.","'Form' is defined but never used.","no-undef","'HomePage' is not defined.","undef"]
\ No newline at end of file \ No newline at end of file
client/src/Pages/ProfilePage.js
View file @ 9ad00da0
...@@ -14,11 +14,6 @@ let userNickname = "가나다라마바사"; ...@@ -14,11 +14,6 @@ let userNickname = "가나다라마바사";
function editNickname1() { //수정버튼 누르면 재입력하게 함 function editNickname1() { //수정버튼 누르면 재입력하게 함
// const pic = document.getElementById("profileImg").value //
const html = ( const html = (
<Form> <Form>
<div className="d-flex justify-content-center"> <div className="d-flex justify-content-center">
...@@ -33,11 +28,6 @@ function editNickname1() { //수정버튼 누르면 재입력하게 함 ...@@ -33,11 +28,6 @@ function editNickname1() { //수정버튼 누르면 재입력하게 함
</Form> </Form>
) )
ReactDOM.render(html, document.getElementById("nickname")) ReactDOM.render(html, document.getElementById("nickname"))
// console.log(document.getElementById("profileImg").value) //
// console.log(userdefault) //
} }
function editNickname2() { //수정버튼 누르면 다시 원래대로 돌아가게 함 function editNickname2() { //수정버튼 누르면 다시 원래대로 돌아가게 함
changeNickname() changeNickname()
...@@ -55,16 +45,45 @@ function changeNickname() { //수정버튼 누르면 닉네임 변경해줌 ...@@ -55,16 +45,45 @@ function changeNickname() { //수정버튼 누르면 닉네임 변경해줌
userNickname = editedNickname.value userNickname = editedNickname.value
} }
function ProfilePage() { function ProfilePage() {
const [tohome, setTohome] = useState(false) const [tohome, setTohome] = useState(false)
const [defaultImg, setDefaultImg] = useState(true)
function goHome() { function goHome() {
return (setTohome(true)) return (setTohome(true))
} }
function setThumbnail(event) { //불러온 사진 <div id='image_container'>에 띄우기
let reader = new FileReader();
reader.onload = function (event) {
let img = document.createElement("img");
img.setAttribute("src", event.target.result);
img.setAttribute("id", "profileImg")
document.querySelector("div#image_container").appendChild(img);
};
reader.readAsDataURL(event.target.files[0]);
if (defaultImg) { //첫 이미지 업로드(default이미지 지우고 유저가 올린걸로 업로드)
let del = document.getElementById("defaultImg")
del.remove()
setDefaultImg(false)
}
else { //기존에 올렸던 사진 지우고 재선택한 사진 업로드
let del2= document.getElementById('profileImg')
del2.remove()
reader.onload = function (event) {
let img = document.createElement("img");
img.setAttribute("src", event.target.result);
img.setAttribute("id", "profileImg")
document.querySelector("div#image_container").appendChild(img);
};
}
}
return ( return (
<div> <div>
<Navbar bg="dark" variant="dark"> <Navbar bg="dark" variant="dark">
...@@ -89,13 +108,14 @@ function ProfilePage() { ...@@ -89,13 +108,14 @@ function ProfilePage() {
<h1 className="text-center mt-4 ml-5 mr-5 mb-3">Profile Page</h1> <h1 className="text-center mt-4 ml-5 mr-5 mb-3">Profile Page</h1>
<h4 className="text-center mb-5">{userName}님 환영합니다 !</h4> <h4 className="text-center mb-5">{userName}님 환영합니다 !</h4>
<div className="d-flex justify-content-center mb-3"> <div className="d-flex justify-content-center mb-3" id="defaultImg">
<Image src={userdefault} width="300px" roundedCircle /> <Image src={userdefault} width="300px" roundedCircle />
</div> </div>
<div className="d-flex justify-content-center"> <div className="d-flex justify-content-center">
<Form className="d-flex justify-content-center"> <Form className="d-flex justify-content-center">
<Form.Group> <Form.Group>
<Form.File id="profileImg" label="프로필 사진 변경" /> <div id="image_container"></div>
<Form.File label="프로필 사진 변경" accept="image/*" onChange={setThumbnail} />
</Form.Group> </Form.Group>
</Form> </Form>
</div> </div>
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment