Conversation
There was a problem hiding this comment.
안녕하세요 초롬님 리뷰어 민철입니다. 🤠
코드 리뷰 처음으로 제대로 해보는 것 같네요 😂
전체적으로 미션 내용을 잘 구현해 주었어요. 특히 변수나 클래스 네이밍 센스가 좋으신 것 같아요 !
언어와 라이브러리를 동시에 습득하는 건 참 어렵죠.
하지만 추가적으로 학습하면 좋을 것 같은 주제들에 대해서 코멘트 달아뒀으니 참고해주시고 피드백 반영해서 커밋 남겨주세요.
참고로 PR 을 다시 보낼 필요는 없고 원래 하던 작업 공간에서 추가적으로 코드를 작성하고 커밋 후 푸쉬를 하게 되면 아래에 자동으로 추가적으로 커밋한 내용이 달린답니다.
그럼 곧 스터디에서 봬요 !
| class App extends Component { | ||
| constructor(props){ | ||
| super(props); | ||
| this.state = { |
There was a problem hiding this comment.
{ key: value } 형식으로 만든 객체를 JSON(JavaScript Object Notation) 이라고 해요.
JSON 위키 백과 링크인데 학습에 참고하시면 좋을 것 같아요.
근데 이 안에 데이터가 많아지기 시작하면 한 줄에 쓰는 것 보다 줄을 나눠서 쓰는 게 더 보기 좋아요.
자바스크립트 스타일 가이드 인데 여기 중간에 보시면 Object Rules 라는 소제목 부분을 보면 짧은 객체들은 한 줄로 압축해서 표현해도 되지만 길어지면 줄을 나눠서 표기하는 것을 추천(?)하고 있네요 😂
| this.state = { | ||
| info:[{key:1, id:1, name:"최수민", univ:"서강", major:"컴퓨터공학", age:"25", emotion:"행복", animal:["사자", "토끼", "뱀"]}, | ||
| {key:2, id:2, name:"이한길", univ:"홍익" , major:"법학", age:"29", emotion:"불행", animal:["펭귄"]}, | ||
| {key:3, id:3, name:"김서영", univ:"이화여자", major:"사이버보안학", age:"22", emotion:"불행", animal:["웜", "트로이목마"]}] |
There was a problem hiding this comment.
자바스크립트에서 숫자를 더하는 방법은 생각보다 간단해요 😂
숫자에 숫자를 더하면 숫자가 더해지고 문자열에 숫자를 더하면 문자열이 돼요 !
문자열은 " 큰 따옴표로 묶여있고 숫자는 따옴표 없이 숫자만 ! 써야해요.
(그렇기 때문에 변수명 앞에 숫자가 먼저 나올 수 없다는 것은 안비밀이예요)
한번 age 에 있는 따옴표를 풀어보세요 ! ㅎㅎ
그리고 따옴표로 묶여있을 때의 숫자와 묶여있지 않을 때의 숫자의 차이점을 알아보는 것도 좋을 것 같아요.
링크 드릴테니 참고하세요 !
| render() { | ||
| var data = this.props.data; | ||
| var animalData = this.props.data.animal; | ||
| var animallist = []; |
There was a problem hiding this comment.
여기에 animallist 는 왜 다 소문자일까요 ? ㅎㅎ
lowerCamelCase 를 참고해보세요 !
|
|
||
| class Introduction extends Component { | ||
| render() { | ||
| var data = this.props.data; |
There was a problem hiding this comment.
시간이 되신다면 var, const, let 에 대하여 학습해보시는 것은 어떨까요?
이 글의 제목에 있는 ES가 슬랙 qna 방에 올린 글에서 설명한 ECMA Script (표준화된 자바스크립트) 예요 ㅎㅎ
링크 참고해주세요 !
| constructor(props){ | ||
| super(props); | ||
| this.state = { | ||
| info:[{key:1, id:1, name:"최수민", univ:"서강", major:"컴퓨터공학", age:"25", emotion:"행복", animal:["사자", "토끼", "뱀"]}, |
There was a problem hiding this comment.
univ 를 꼭 줄여 쓰는 것이 좋을까요 ?
변수명은 되도록 줄여쓰지 않는 것을 추천드려요 !
|
피드백 사항 수정해서 커밋 완료했습니다! 감사합니다 😃 |
MrKwon
left a comment
MrKwon
left a comment
There was a problem hiding this comment.
피드백 반영도 아주 잘해주었고, 미션을 진행하는데 있어 상당히 센스가 있으신 것 같아요 !
이만 머지하도록 하겠습니다. 고생하셨어요 !
| emotion:"행복", | ||
| animal:["사자", "토끼", "뱀"] | ||
| }, | ||
| { |
There was a problem hiding this comment.
Intellij WebStorm 을 쓴다면 이런 부분은 ctrl + alt + L (윈도우 맞죠?) 을 누르면 알아서 맞춰줄꺼예요 !
VS code 를 쓴다면 shift + alt + F 를 눌러보세요 !
이런 기능을 ide 의 auto formatting 이라고 합니다.
There was a problem hiding this comment.
감사합니다^^77 일일이 하는 거 번거로웠는데 좋은 기능 가르쳐주셔서 감사합니다.
2 participants
안녕하세요!
자바스크립트도, 리액트도 처음이고 html도 익숙치 않아서 은근 헤맸던 것 같습니다.
기능 구현 전에 기능 목록을 만들고 기능단위로 커밋하는 걸 잊었네요.
다음부터는 기능을 구현하기 전에 기능 목록을 만들고 기능 단위로 커밋해보겠습니다.
그리고 자바스크립트에서 숫자를 어떻게 더해야하는지 잘 모르겠습니다. 나이에 한살을 더 추가하고 싶었는데 age가 String으로 인식되어 버렸네요.
항상 감사합니다:)