김대휘

Connect Error 해결

...@@ -45,7 +45,7 @@ Then you can simply: ...@@ -45,7 +45,7 @@ Then you can simply:
45 Reference from [`YARN`](https://yarnpkg.com/en/docs/install) 45 Reference from [`YARN`](https://yarnpkg.com/en/docs/install)
46 <br> 46 <br>
47 47
48 -### Third, add "database.json" 48 +#### Third, add "database.json"
49 you should add `database.json` in the following format. 49 you should add `database.json` in the following format.
50 ```sh 50 ```sh
51 { 51 {
......
...@@ -67,7 +67,7 @@ export default function BodyLayout() { ...@@ -67,7 +67,7 @@ export default function BodyLayout() {
67 } else { 67 } else {
68 return ( 68 return (
69 <div className={classes.root}> 69 <div className={classes.root}>
70 - <Container className={classes.container} maxwidth="md"> 70 + <Container key="container" className={classes.container} maxwidth="md">
71 <Grid className={classes.item} container> 71 <Grid className={classes.item} container>
72 {data.map((card, idx) => { 72 {data.map((card, idx) => {
73 let isVisible = card.isPublic; 73 let isVisible = card.isPublic;
...@@ -75,7 +75,11 @@ export default function BodyLayout() { ...@@ -75,7 +75,11 @@ export default function BodyLayout() {
75 const isMine = card.name === localStorage["userName"]; //remove item 75 const isMine = card.name === localStorage["userName"]; //remove item
76 if (idx === 0 || card.date !== data[idx - 1].date) { 76 if (idx === 0 || card.date !== data[idx - 1].date) {
77 showDate = ( 77 showDate = (
78 - <Typography key={idx} variant="h4" className={classes.date}> 78 + <Typography
79 + key={card.date}
80 + variant="h4"
81 + className={classes.date}
82 + >
79 {card.date} 83 {card.date}
80 </Typography> 84 </Typography>
81 ); 85 );
...@@ -89,9 +93,9 @@ export default function BodyLayout() { ...@@ -89,9 +93,9 @@ export default function BodyLayout() {
89 return ( 93 return (
90 <> 94 <>
91 {showDate} 95 {showDate}
92 - <Grid item xs={12} sm={6} md={3} key={idx+1}> 96 + <Grid item xs={12} sm={6} md={3} key={idx}>
93 <TodoCard 97 <TodoCard
94 - key={idx} 98 + key={card.title}
95 data={card} 99 data={card}
96 isVisible={isVisible} 100 isVisible={isVisible}
97 isMine={isMine} 101 isMine={isMine}
...@@ -104,7 +108,7 @@ export default function BodyLayout() { ...@@ -104,7 +108,7 @@ export default function BodyLayout() {
104 } 108 }
105 })} 109 })}
106 </Grid> 110 </Grid>
107 - <AddButton key="addBtn"></AddButton> 111 + <AddButton></AddButton>
108 </Container> 112 </Container>
109 </div> 113 </div>
110 ); 114 );
......
...@@ -77,7 +77,7 @@ export default function AddButton({ handleClose }) { ...@@ -77,7 +77,7 @@ export default function AddButton({ handleClose }) {
77 const [isPublic, setIsPublic] = useState(1); 77 const [isPublic, setIsPublic] = useState(1);
78 const [textList, setTextList] = useState([]); 78 const [textList, setTextList] = useState([]);
79 const [textFieldBody, setTextFieldBody] = useState([ 79 const [textFieldBody, setTextFieldBody] = useState([
80 - <TextField required label="To do 1" onChange={(e) => handleText(e, 0)} />, 80 + <TextField required key={0} label="To do 1" onChange={(e) => handleText(e, 0)} />,
81 ]); 81 ]);
82 82
83 const addApi = (data) => { 83 const addApi = (data) => {
...@@ -139,6 +139,7 @@ export default function AddButton({ handleClose }) { ...@@ -139,6 +139,7 @@ export default function AddButton({ handleClose }) {
139 ...textFieldBody, 139 ...textFieldBody,
140 <TextField 140 <TextField
141 required 141 required
142 + key={idx}
142 label={"To do " + (idx + 1)} 143 label={"To do " + (idx + 1)}
143 onChange={(e) => handleText(e, idx)} 144 onChange={(e) => handleText(e, idx)}
144 />, 145 />,
......
...@@ -81,6 +81,7 @@ export default function AddButton({ data, handleClose }) { ...@@ -81,6 +81,7 @@ export default function AddButton({ data, handleClose }) {
81 return ( 81 return (
82 <TextField 82 <TextField
83 required 83 required
84 + key={idx}
84 fullWidth={true} 85 fullWidth={true}
85 defaultValue={textList[idx]} 86 defaultValue={textList[idx]}
86 label={"To do " + (idx + 1)} 87 label={"To do " + (idx + 1)}
......
...@@ -92,7 +92,7 @@ export default function LandingPage(props) { ...@@ -92,7 +92,7 @@ export default function LandingPage(props) {
92 }; 92 };
93 93
94 const checkEnter = ()=>{ 94 const checkEnter = ()=>{
95 - if(window.event.keyCode == 13){ 95 + if(window.event.keyCode === 13){
96 handleLogin(); 96 handleLogin();
97 } 97 }
98 } 98 }
......
...@@ -105,6 +105,12 @@ export default function LandingPage(props) { ...@@ -105,6 +105,12 @@ export default function LandingPage(props) {
105 } 105 }
106 }; 106 };
107 107
108 + const checkEnter = ()=>{
109 + if(window.event.keyCode === 13){
110 + handleSubmit();
111 + }
112 + }
113 +
108 return ( 114 return (
109 <div className={classes.root}> 115 <div className={classes.root}>
110 <Paper className={classes.paper} elevation={3}> 116 <Paper className={classes.paper} elevation={3}>
...@@ -119,6 +125,7 @@ export default function LandingPage(props) { ...@@ -119,6 +125,7 @@ export default function LandingPage(props) {
119 onChange={(e) => { 125 onChange={(e) => {
120 setUserID(e.target.value); 126 setUserID(e.target.value);
121 }} 127 }}
128 + onKeyUp={checkEnter}
122 /> 129 />
123 <TextField 130 <TextField
124 required 131 required
...@@ -129,6 +136,7 @@ export default function LandingPage(props) { ...@@ -129,6 +136,7 @@ export default function LandingPage(props) {
129 onChange={(e) => { 136 onChange={(e) => {
130 setNickName(e.target.value); 137 setNickName(e.target.value);
131 }} 138 }}
139 + onKeyUp={checkEnter}
132 /> 140 />
133 <TextField 141 <TextField
134 required 142 required
...@@ -141,6 +149,7 @@ export default function LandingPage(props) { ...@@ -141,6 +149,7 @@ export default function LandingPage(props) {
141 onChange={(e) => { 149 onChange={(e) => {
142 setUserPW(e.target.value); 150 setUserPW(e.target.value);
143 }} 151 }}
152 + onKeyUp={checkEnter}
144 /> 153 />
145 <TextField 154 <TextField
146 required 155 required
...@@ -160,6 +169,7 @@ export default function LandingPage(props) { ...@@ -160,6 +169,7 @@ export default function LandingPage(props) {
160 setMatchPW(false); 169 setMatchPW(false);
161 } 170 }
162 }} 171 }}
172 + onKeyUp={checkEnter}
163 /> 173 />
164 <Button 174 <Button
165 className={classes.submit} 175 className={classes.submit}
......
...@@ -20,7 +20,26 @@ const connection = mysql.createConnection({ ...@@ -20,7 +20,26 @@ const connection = mysql.createConnection({
20 port: conf.port, 20 port: conf.port,
21 database: conf.database, 21 database: conf.database,
22 }); 22 });
23 -connection.connect(); 23 +// connection.connect();
24 +function handleDisconnect() {
25 + connection.connect(function (err) {
26 + if (err) {
27 + console.log("error when connecting to db:", err);
28 + setTimeout(handleDisconnect, 4000);
29 + }
30 + });
31 +
32 + connection.on("error", function (err) {
33 + console.log("db error", err);
34 + if (err.code === "PROTOCOL_CONNECTION_LOST") {
35 + return handleDisconnect();
36 + } else {
37 + throw err;
38 + }
39 + });
40 +}
41 +
42 +handleDisconnect();
24 43
25 app.use(bodyParser.json()); 44 app.use(bodyParser.json());
26 app.use(bodyParser.urlencoded({ extended: true })); 45 app.use(bodyParser.urlencoded({ extended: true }));
...@@ -30,8 +49,8 @@ app.use( ...@@ -30,8 +49,8 @@ app.use(
30 resave: false, 49 resave: false,
31 saveUninitialized: true, 50 saveUninitialized: true,
32 cookie: { 51 cookie: {
33 - maxAge: 1000 * 60 * 60 // 쿠키 유효기간 24시간 52 + maxAge: 1000 * 60 * 60, // 쿠키 유효기간 24시간
34 - } 53 + },
35 }) 54 })
36 ); 55 );
37 56
...@@ -119,7 +138,7 @@ app.post("/api/signup", async (req, res) => { ...@@ -119,7 +138,7 @@ app.post("/api/signup", async (req, res) => {
119 if (err) { 138 if (err) {
120 res.send({ 139 res.send({
121 code: 400, 140 code: 400,
122 - message: "error", 141 + message: "Change ID or NickName",
123 }); 142 });
124 } else { 143 } else {
125 res.send({ 144 res.send({
...@@ -173,28 +192,28 @@ app.post("/auth/login", (req, res) => { ...@@ -173,28 +192,28 @@ app.post("/auth/login", (req, res) => {
173 ); 192 );
174 }); 193 });
175 194
176 -app.get("/auth/logout", async (req,res,next) => { 195 +app.get("/auth/logout", async (req, res, next) => {
177 - console.log(req.session.userName+ "is logout"); 196 + console.log(req.session.userName + "is logout");
178 req.session.destroy(); 197 req.session.destroy();
179 - res.clearCookie('sid'); 198 + res.clearCookie("sid");
180 res.redirect("/"); 199 res.redirect("/");
181 -}) 200 +});
182 201
183 -app.get("/auth", (req,res) =>{ 202 +app.get("/auth", (req, res) => {
184 - try{ 203 + try {
185 - if(req.session.userName){ 204 + if (req.session.userName) {
186 res.send({ 205 res.send({
187 - message: "Authenticated user" 206 + message: "Authenticated user",
188 - }) 207 + });
189 - }else{ 208 + } else {
190 - console.log("Unauthorized access") 209 + console.log("Unauthorized access");
191 res.send({ 210 res.send({
192 - message: "Unauthenticated user" 211 + message: "Unauthenticated user",
193 - }) 212 + });
194 } 213 }
195 - }catch(e){ 214 + } catch (e) {
196 console.log(e); 215 console.log(e);
197 } 216 }
198 -}) 217 +});
199 218
200 app.listen(port, () => console.log(`Listening on port ${port}`)); 219 app.listen(port, () => console.log(`Listening on port ${port}`));
......