ewhk9887/korean_code_reviews_from_github huggingface dataset:
@@ -0,0 +1,42 @@
+package webserver.domain;
+
+import org.slf4j.Logger;
+import org.slf4j.LoggerFactory;
+import org.springframework.util.StringUtils;
+
+import java.util.Arrays;
+import java.util.HashMap;
+import java.util.Map;
+
+public class Cookies {
+    private static final Logger logger = LoggerFactory.getLogger(Cookies.class);
+
+    private Map<String, Cookie> cookies;
+
+    public Cookies() {
+        cookies = new HashMap<>();
+    }
+
+    public Cookies(String cookiesString) {
+        cookies = new HashMap<>();
+        Arrays.stream(cookiesString.trim().split(";")).forEach(str -> {
+            String[] keyValue = str.split("=");
+            cookies.put(keyValue[0].trim(), new Cookie(keyValue[0].trim(), keyValue[1].trim()));
+        });
+    }
+
+    public Cookie getCookie(String name) {
+        return cookies.get(name);
+    }
+
+    public void addCookie(Cookie cookie) {
+        cookies.put(cookie.getName(), cookie);
+    }
+
+    @Override
+    public String toString() {
+        StringBuilder sb = new StringBuilder();
+        cookies.forEach((key, value) -> sb.append(cookies.get(key)).append("\r\n"));
+        return sb.toString();
+    }
+}

리뷰: [Java8 Stream은 loop가 아니다.](https://www.popit.kr/java8-stream%EC%9D%80-loop%EA%B0%80-%EC%95%84%EB%8B%88%EB%8B%A4/)

```java
        for (String str : cookiesString.trim().split(";")) {
            String[] keyValue = str.split("=");
            cookies.put(keyValue[0].trim(), new Cookie(keyValue[0].trim(), keyValue[1].trim()));
        }
```
반복문도 큰 차이가 없긴하지만 stream.forEach만 할거라면 말그대로 반복문과 크게 다를게 없답니다.
그렇다면 일반적으로 더 친숙한 반복문이 더 좋다고 생각들어요.

개인적으로는 특정 연산을 연결해서 사용할 필요가 있거나, 가독성 측면에서 이점이 있을 때 위주로 스트림을 사용합니다.
@@ -0,0 +1,29 @@
+package webserver.domain;
+
+
+import java.util.HashMap;
+import java.util.Map;
+
+public class Session {
+    private Map<String, Object> attribute;
+
+    public Session() {
+        this.attribute = new HashMap<>();
+    }
+
+    public Object getAttribute(String name) {
+        return attribute.get(name);
+    }
+
+    public void addAttribute(String name, Object value) {
+        attribute.put(name, value);
+    }
+
+    public void removeAttribute(String name) {
+        attribute.remove(name);
+    }
+
+    public void invalidate() {
+        attribute.clear();
+    }
+}

리뷰: 군더더기 없이 잘 구현했네요. 👍
@@ -0,0 +1,48 @@
+import { SERVER } from '@/constants/url';
+import axios from 'axios';
+
+interface CreateReviewParams {
+  userId: string;
+  travelId: string;
+  reviewImgs: File[];
+  travelScore: number;
+  content: string;
+  title: string;
+  guideScore?: number;
+}
+
+export const createReview = async ({
+  userId,
+  travelId,
+  reviewImgs,
+  travelScore,
+  content,
+  title,
+  guideScore,
+}: CreateReviewParams) => {
+  try {
+    const formData = new FormData();
+    formData.append('userId', userId);
+    formData.append('travelId', travelId);
+    formData.append('travelScore', travelScore.toString());
+    formData.append('content', content);
+    formData.append('title', title);
+    if (guideScore !== undefined && guideScore !== null && guideScore !== 0) {
+      formData.append('guideScore', guideScore.toString());
+    }
+
+    reviewImgs.forEach((img) => {
+      formData.append('reviewImg', img);
+    });
+
+    const response = await axios.post(`${SERVER}/api/v1/reviews`, formData, {
+      headers: {
+        'Content-Type': 'multipart/form-data',
+      },
+    });
+
+    return response.data;
+  } catch (err) {
+    throw new Error(err instanceof Error ? err.message : '리뷰 생성 실패');
+  }
+};

리뷰: _:warning: Potential issue_

**폼 데이터 구성 시 0점 처리 주의**  
`guideScore`가 0점이면 `if (guideScore)` 조건에서는 누락됩니다. 유저가 의도적으로 0점을 입력할 가능성이 있다면, 조건문을 `guideScore !== undefined` 등의 방식으로 수정해보세요.  

```diff
-  if (guideScore) {
+  if (guideScore !== undefined && guideScore !== null) {
     formData.append('guideScore', guideScore.toString());
-  }
+  }
```


<!-- suggestion_start -->

<details>
<summary>📝 Committable suggestion</summary>

> ‼️ **IMPORTANT**
> Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

`````suggestion
  const formData = new FormData();
  formData.append('userId', userId);
  formData.append('travelId', travelId);
  formData.append('travelScore', travelScore.toString());
  formData.append('content', content);
  formData.append('title', title);
  if (guideScore !== undefined && guideScore !== null) {
    formData.append('guideScore', guideScore.toString());
  }

`````

</details>

<!-- suggestion_end -->

<!-- This is an auto-generated comment by CodeRabbit -->
@@ -0,0 +1,79 @@
+@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
+
+* {
+    box-sizing: border-box;
+}
+body{
+    background-color:#fafafa;
+}
+
+.login-wrap{
+    width:30%;
+    height:550px;
+    background-color:#fff;
+    border:3px solid rgba(221, 221, 221, 0.3);
+    margin:130px auto 0 auto;
+
+    h1{
+        width:80%;
+        height:50px;
+        font-size:55px;
+        font-family: 'Lobster', cursive;
+        padding-top:50px;
+        margin:0 auto 120px auto;
+        text-align: center;
+    }
+
+    .inner-wrap {
+        width:80%;
+        margin:auto;
+        height:300px;
+
+        input {
+            width:100%;
+            height:60px;
+            border-radius: 5px;
+            border:2px solid rgba(221, 221, 221, 0.2);
+            margin-bottom:10px;
+            padding:30px 10px;
+            font-size:18px;
+            color:#000;
+            cursor: pointer;
+            outline:none;
+            line-height: 30px;
+        }
+
+        .on {
+            background-color:#0094f6;
+        }
+
+        .off {
+            background-color:#0094f64b;
+        }
+
+        button {
+            width:100%;
+            height:50px;
+            margin-top:15px;
+            border:none;
+            background-color:#0094f64b;
+            border-radius: 8px;
+            color:#fff;
+            font-size:20px;
+            font-weight:600;
+            outline:none;
+            cursor:pointer;
+        }
+
+        p{
+            text-align:center;
+            margin-top:110px;
+
+            a{
+                color:#00376b;
+                font-size:16px;
+                text-decoration: none;
+            }
+        }
+    }
+}

리뷰: CSS 속성 순서대로 변경하면 더 좋을것 같아요
margin, padding 다음 font-size 순이네요 ;)
@@ -0,0 +1,32 @@
+import React from "react";
+import "./Footer.scss";
+
+class Footer extends React.Component {
+  render() {
+    return (
+      <footer>
+        <ul>
+          {RIGHT_FOOTER.map((element, index) => {
+            return <li key={index}>{element}</li>;
+          })}
+        </ul>
+        <p className="made">© 2021 INSTAGRAM FROM doheekim</p>
+      </footer>
+    );
+  }
+}
+
+export default Footer;
+
+const RIGHT_FOOTER = [
+  "소개",
+  "도움말",
+  "홍보 센터",
+  "API",
+  "채용정보",
+  "개인정보처라방침",
+  "약관",
+  "위치",
+  "인기 계정",
+  "해쉬태그",
+];

리뷰: footer 내용 잘 만드셨네요 bb
@@ -0,0 +1,79 @@
+@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
+
+* {
+    box-sizing: border-box;
+}
+body{
+    background-color:#fafafa;
+}
+
+.login-wrap{
+    width:30%;
+    height:550px;
+    background-color:#fff;
+    border:3px solid rgba(221, 221, 221, 0.3);
+    margin:130px auto 0 auto;
+
+    h1{
+        width:80%;
+        height:50px;
+        font-size:55px;
+        font-family: 'Lobster', cursive;
+        padding-top:50px;
+        margin:0 auto 120px auto;
+        text-align: center;
+    }
+
+    .inner-wrap {
+        width:80%;
+        margin:auto;
+        height:300px;
+
+        input {
+            width:100%;
+            height:60px;
+            border-radius: 5px;
+            border:2px solid rgba(221, 221, 221, 0.2);
+            margin-bottom:10px;
+            padding:30px 10px;
+            font-size:18px;
+            color:#000;
+            cursor: pointer;
+            outline:none;
+            line-height: 30px;
+        }
+
+        .on {
+            background-color:#0094f6;
+        }
+
+        .off {
+            background-color:#0094f64b;
+        }
+
+        button {
+            width:100%;
+            height:50px;
+            margin-top:15px;
+            border:none;
+            background-color:#0094f64b;
+            border-radius: 8px;
+            color:#fff;
+            font-size:20px;
+            font-weight:600;
+            outline:none;
+            cursor:pointer;
+        }
+
+        p{
+            text-align:center;
+            margin-top:110px;
+
+            a{
+                color:#00376b;
+                font-size:16px;
+                text-decoration: none;
+            }
+        }
+    }
+}

리뷰: 넵 수정하겠습니다!
@@ -0,0 +1,98 @@
+import { Component } from "react";
+import { Link, withRouter } from "react-router-dom";
+import "./Login.scss";
+
+class Login extends Component {
+  constructor() {
+    super();
+    this.state = {
+      id: "",
+      pw: "",
+    };
+  }
+
+  // localStorage.clear();
+  // localStorage.removeItem('key');
+  // localStorage.getItem('key');
+
+  //저장
+
+  //조회
+  // let getValue = localStorage.getItem('Token');
+  // console.log(getValue);
+  // localStorage
+
+  goToMain = () => {
+    fetch("http://10.58.2.229:8000/users/login", {
+      method: "POST",
+      body: JSON.stringify({
+        account: this.state.id,
+        password: this.state.pw,
+        // phone_number: "01034358181",
+        // name: "김도히",
+      }),
+    })
+      .then((res) => res.json())
+      .then((result) => {
+        console.log(result);
+        if (result.MESSAGE === "SUCCESS") {
+          localStorage.setItem("Token", result.Token);
+          alert("로그인성공!");
+          this.props.history.push("/maindh");
+        } else {
+          alert("🤬IT'S YOUR FAULT!🤬");
+        }
+      });
+  };
+
+  handleInput = (event) => {
+    const { name, value } = event.target;
+    this.setState({
+      [name]: value,
+    });
+  };
+
+  render() {
+    const { id, pw } = this.state;
+    return (
+      <>
+        <div className="login-wrap">
+          <h1 className="title">Westagram</h1>
+          <div className="inner-wrap">
+            <input
+              className="id"
+              type="text"
+              placeholder="전화번호, 사용자 이름 또는 이메일"
+              onChange={this.handleInput}
+              value={id}
+              name="id"
+            />
+            <input
+              className="password"
+              type="password"
+              placeholder="비밀번호"
+              onChange={this.handleInput}
+              value={pw}
+              name="pw"
+            />
+            <button
+              className={id.includes("@") && pw.length >= 5 ? "on" : "off"}
+              onClick={this.goToMain}
+            >
+              로그인
+            </button>
+            <p>
+              <Link to="/Main">비밀번호를 잊으셨나요?</Link>
+            </p>
+          </div>
+        </div>
+      </>
+    );
+  }
+}
+
+export default withRouter(Login);
+
+//객체 구조 분해 할당
+
+//const { fontState} = this.state

리뷰: this.state 는 구조분해할당을 사용해서 정리해주시면 더 깔끔할 것 같습니다!
@@ -0,0 +1,98 @@
+import { Component } from "react";
+import { Link, withRouter } from "react-router-dom";
+import "./Login.scss";
+
+class Login extends Component {
+  constructor() {
+    super();
+    this.state = {
+      id: "",
+      pw: "",
+    };
+  }
+
+  // localStorage.clear();
+  // localStorage.removeItem('key');
+  // localStorage.getItem('key');
+
+  //저장
+
+  //조회
+  // let getValue = localStorage.getItem('Token');
+  // console.log(getValue);
+  // localStorage
+
+  goToMain = () => {
+    fetch("http://10.58.2.229:8000/users/login", {
+      method: "POST",
+      body: JSON.stringify({
+        account: this.state.id,
+        password: this.state.pw,
+        // phone_number: "01034358181",
+        // name: "김도히",
+      }),
+    })
+      .then((res) => res.json())
+      .then((result) => {
+        console.log(result);
+        if (result.MESSAGE === "SUCCESS") {
+          localStorage.setItem("Token", result.Token);
+          alert("로그인성공!");
+          this.props.history.push("/maindh");
+        } else {
+          alert("🤬IT'S YOUR FAULT!🤬");
+        }
+      });
+  };
+
+  handleInput = (event) => {
+    const { name, value } = event.target;
+    this.setState({
+      [name]: value,
+    });
+  };
+
+  render() {
+    const { id, pw } = this.state;
+    return (
+      <>
+        <div className="login-wrap">
+          <h1 className="title">Westagram</h1>
+          <div className="inner-wrap">
+            <input
+              className="id"
+              type="text"
+              placeholder="전화번호, 사용자 이름 또는 이메일"
+              onChange={this.handleInput}
+              value={id}
+              name="id"
+            />
+            <input
+              className="password"
+              type="password"
+              placeholder="비밀번호"
+              onChange={this.handleInput}
+              value={pw}
+              name="pw"
+            />
+            <button
+              className={id.includes("@") && pw.length >= 5 ? "on" : "off"}
+              onClick={this.goToMain}
+            >
+              로그인
+            </button>
+            <p>
+              <Link to="/Main">비밀번호를 잊으셨나요?</Link>
+            </p>
+          </div>
+        </div>
+      </>
+    );
+  }
+}
+
+export default withRouter(Login);
+
+//객체 구조 분해 할당
+
+//const { fontState} = this.state

리뷰: 요 부분 노션에서 봤는데 handleId랑 handlePw같이 똑같은 형식의 event handler라서 합칠수 있더라구요! 저도 아직안했지만...^^ 같이 해보아요 ㅋㅋㅋ
@@ -0,0 +1,79 @@
+@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
+
+* {
+    box-sizing: border-box;
+}
+body{
+    background-color:#fafafa;
+}
+
+.login-wrap{
+    width:30%;
+    height:550px;
+    background-color:#fff;
+    border:3px solid rgba(221, 221, 221, 0.3);
+    margin:130px auto 0 auto;
+
+    h1{
+        width:80%;
+        height:50px;
+        font-size:55px;
+        font-family: 'Lobster', cursive;
+        padding-top:50px;
+        margin:0 auto 120px auto;
+        text-align: center;
+    }
+
+    .inner-wrap {
+        width:80%;
+        margin:auto;
+        height:300px;
+
+        input {
+            width:100%;
+            height:60px;
+            border-radius: 5px;
+            border:2px solid rgba(221, 221, 221, 0.2);
+            margin-bottom:10px;
+            padding:30px 10px;
+            font-size:18px;
+            color:#000;
+            cursor: pointer;
+            outline:none;
+            line-height: 30px;
+        }
+
+        .on {
+            background-color:#0094f6;
+        }
+
+        .off {
+            background-color:#0094f64b;
+        }
+
+        button {
+            width:100%;
+            height:50px;
+            margin-top:15px;
+            border:none;
+            background-color:#0094f64b;
+            border-radius: 8px;
+            color:#fff;
+            font-size:20px;
+            font-weight:600;
+            outline:none;
+            cursor:pointer;
+        }
+
+        p{
+            text-align:center;
+            margin-top:110px;
+
+            a{
+                color:#00376b;
+                font-size:16px;
+                text-decoration: none;
+            }
+        }
+    }
+}

리뷰: 자주쓰는 border variable 에다가 저장해놓고 쓰니까 편하고 좋더라구요!
@@ -0,0 +1,21 @@
+import React from "react";
+import "./MainRight.scss";
+import RecommendHeader from "./MainRight/RecommendHeader";
+import RecommendTitle from "./MainRight/RecommendTitle";
+import RecommendFriends from "./MainRight/RecommendFriends";
+import Footer from "./MainRight/Footer";
+
+class MainRight extends React.Component {
+  render() {
+    return (
+      <div className="main-right">
+        <RecommendHeader></RecommendHeader>
+        <RecommendTitle></RecommendTitle>
+        <RecommendFriends></RecommendFriends>
+        <Footer></Footer>
+      </div>
+    );
+  }
+}
+
+export default MainRight;

리뷰: 오 벌써 다 나누셨다닝 👍
@@ -0,0 +1,21 @@
+import React from "react";
+import "./MainRight.scss";
+import RecommendHeader from "./MainRight/RecommendHeader";
+import RecommendTitle from "./MainRight/RecommendTitle";
+import RecommendFriends from "./MainRight/RecommendFriends";
+import Footer from "./MainRight/Footer";
+
+class MainRight extends React.Component {
+  render() {
+    return (
+      <div className="main-right">
+        <RecommendHeader></RecommendHeader>
+        <RecommendTitle></RecommendTitle>
+        <RecommendFriends></RecommendFriends>
+        <Footer></Footer>
+      </div>
+    );
+  }
+}
+
+export default MainRight;

리뷰: 깔끔....🤭
@@ -0,0 +1,98 @@
+import { Component } from "react";
+import { Link, withRouter } from "react-router-dom";
+import "./Login.scss";
+
+class Login extends Component {
+  constructor() {
+    super();
+    this.state = {
+      id: "",
+      pw: "",
+    };
+  }
+
+  // localStorage.clear();
+  // localStorage.removeItem('key');
+  // localStorage.getItem('key');
+
+  //저장
+
+  //조회
+  // let getValue = localStorage.getItem('Token');
+  // console.log(getValue);
+  // localStorage
+
+  goToMain = () => {
+    fetch("http://10.58.2.229:8000/users/login", {
+      method: "POST",
+      body: JSON.stringify({
+        account: this.state.id,
+        password: this.state.pw,
+        // phone_number: "01034358181",
+        // name: "김도히",
+      }),
+    })
+      .then((res) => res.json())
+      .then((result) => {
+        console.log(result);
+        if (result.MESSAGE === "SUCCESS") {
+          localStorage.setItem("Token", result.Token);
+          alert("로그인성공!");
+          this.props.history.push("/maindh");
+        } else {
+          alert("🤬IT'S YOUR FAULT!🤬");
+        }
+      });
+  };
+
+  handleInput = (event) => {
+    const { name, value } = event.target;
+    this.setState({
+      [name]: value,
+    });
+  };
+
+  render() {
+    const { id, pw } = this.state;
+    return (
+      <>
+        <div className="login-wrap">
+          <h1 className="title">Westagram</h1>
+          <div className="inner-wrap">
+            <input
+              className="id"
+              type="text"
+              placeholder="전화번호, 사용자 이름 또는 이메일"
+              onChange={this.handleInput}
+              value={id}
+              name="id"
+            />
+            <input
+              className="password"
+              type="password"
+              placeholder="비밀번호"
+              onChange={this.handleInput}
+              value={pw}
+              name="pw"
+            />
+            <button
+              className={id.includes("@") && pw.length >= 5 ? "on" : "off"}
+              onClick={this.goToMain}
+            >
+              로그인
+            </button>
+            <p>
+              <Link to="/Main">비밀번호를 잊으셨나요?</Link>
+            </p>
+          </div>
+        </div>
+      </>
+    );
+  }
+}
+
+export default withRouter(Login);
+
+//객체 구조 분해 할당
+
+//const { fontState} = this.state

리뷰: 오옷 한번 시도해봐야겠어요!
@@ -0,0 +1,21 @@
+import React from "react";
+import "./MainRight.scss";
+import RecommendHeader from "./MainRight/RecommendHeader";
+import RecommendTitle from "./MainRight/RecommendTitle";
+import RecommendFriends from "./MainRight/RecommendFriends";
+import Footer from "./MainRight/Footer";
+
+class MainRight extends React.Component {
+  render() {
+    return (
+      <div className="main-right">
+        <RecommendHeader></RecommendHeader>
+        <RecommendTitle></RecommendTitle>
+        <RecommendFriends></RecommendFriends>
+        <Footer></Footer>
+      </div>
+    );
+  }
+}
+
+export default MainRight;

리뷰: 감사합니댯🤭
@@ -0,0 +1,79 @@
+@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
+
+* {
+    box-sizing: border-box;
+}
+body{
+    background-color:#fafafa;
+}
+
+.login-wrap{
+    width:30%;
+    height:550px;
+    background-color:#fff;
+    border:3px solid rgba(221, 221, 221, 0.3);
+    margin:130px auto 0 auto;
+
+    h1{
+        width:80%;
+        height:50px;
+        font-size:55px;
+        font-family: 'Lobster', cursive;
+        padding-top:50px;
+        margin:0 auto 120px auto;
+        text-align: center;
+    }
+
+    .inner-wrap {
+        width:80%;
+        margin:auto;
+        height:300px;
+
+        input {
+            width:100%;
+            height:60px;
+            border-radius: 5px;
+            border:2px solid rgba(221, 221, 221, 0.2);
+            margin-bottom:10px;
+            padding:30px 10px;
+            font-size:18px;
+            color:#000;
+            cursor: pointer;
+            outline:none;
+            line-height: 30px;
+        }
+
+        .on {
+            background-color:#0094f6;
+        }
+
+        .off {
+            background-color:#0094f64b;
+        }
+
+        button {
+            width:100%;
+            height:50px;
+            margin-top:15px;
+            border:none;
+            background-color:#0094f64b;
+            border-radius: 8px;
+            color:#fff;
+            font-size:20px;
+            font-weight:600;
+            outline:none;
+            cursor:pointer;
+        }
+
+        p{
+            text-align:center;
+            margin-top:110px;
+
+            a{
+                color:#00376b;
+                font-size:16px;
+                text-decoration: none;
+            }
+        }
+    }
+}

리뷰: 공통 scss를 잘 활용해봐야겠습니다!
@@ -0,0 +1,18 @@
+.recommend-title {
+    width:100%;
+    height:40px;
+    margin-bottom:5px;
+
+    .recommend-title-left {
+        float:left;
+        font-size:14px;
+        color:#888;
+        font-weight:700;
+    }
+
+    .recommend-title-right {
+        float:right;
+        font-size:12px;
+        font-weight:600;
+    }
+}
\ No newline at end of file

리뷰: 제목 깔끔하고 알아듣기 쉬워서 좋은거같아요!
@@ -0,0 +1,98 @@
+import { Component } from "react";
+import { Link, withRouter } from "react-router-dom";
+import "./Login.scss";
+
+class Login extends Component {
+  constructor() {
+    super();
+    this.state = {
+      id: "",
+      pw: "",
+    };
+  }
+
+  // localStorage.clear();
+  // localStorage.removeItem('key');
+  // localStorage.getItem('key');
+
+  //저장
+
+  //조회
+  // let getValue = localStorage.getItem('Token');
+  // console.log(getValue);
+  // localStorage
+
+  goToMain = () => {
+    fetch("http://10.58.2.229:8000/users/login", {
+      method: "POST",
+      body: JSON.stringify({
+        account: this.state.id,
+        password: this.state.pw,
+        // phone_number: "01034358181",
+        // name: "김도히",
+      }),
+    })
+      .then((res) => res.json())
+      .then((result) => {
+        console.log(result);
+        if (result.MESSAGE === "SUCCESS") {
+          localStorage.setItem("Token", result.Token);
+          alert("로그인성공!");
+          this.props.history.push("/maindh");
+        } else {
+          alert("🤬IT'S YOUR FAULT!🤬");
+        }
+      });
+  };
+
+  handleInput = (event) => {
+    const { name, value } = event.target;
+    this.setState({
+      [name]: value,
+    });
+  };
+
+  render() {
+    const { id, pw } = this.state;
+    return (
+      <>
+        <div className="login-wrap">
+          <h1 className="title">Westagram</h1>
+          <div className="inner-wrap">
+            <input
+              className="id"
+              type="text"
+              placeholder="전화번호, 사용자 이름 또는 이메일"
+              onChange={this.handleInput}
+              value={id}
+              name="id"
+            />
+            <input
+              className="password"
+              type="password"
+              placeholder="비밀번호"
+              onChange={this.handleInput}
+              value={pw}
+              name="pw"
+            />
+            <button
+              className={id.includes("@") && pw.length >= 5 ? "on" : "off"}
+              onClick={this.goToMain}
+            >
+              로그인
+            </button>
+            <p>
+              <Link to="/Main">비밀번호를 잊으셨나요?</Link>
+            </p>
+          </div>
+        </div>
+      </>
+    );
+  }
+}
+
+export default withRouter(Login);
+
+//객체 구조 분해 할당
+
+//const { fontState} = this.state

리뷰: import { Link, withRouter } from "react-router-dom"; 한줄로 만들어도 좋을거같아요!