corin

배경지식 01. 점심 뭐먹지와 동일한 ui이다. 02. 레스토랑을 추가하고 삭제하는 기능은 구현하지 않으며 클릭했을 때 모달창이 켜지는 것만 실행된다. 03. 기존에 바닐라로 구현한 것을 리액트로 구현한다. 04. 리액트를 접해보지 않은 사람들을 위해 익숙한 이전 미션을 다시 해보며, 기능도 줄어들었다. 05. 리액트 온보딩 같은 느낌이라서 짧은 미션기간이었다. 1단계가 화-목/ 2단계가 금-월었다. 06. 1단계는 class형으로 컴포넌트를 작성했다. 2단계는 이를 function형으로 수정했다. 이번에 처음 리액트를 만졌기 때문에 걱정이 많았는데 페어가 리액트를 잘 다루고 파일분리를 잘하는 크루라서 도움을 많이 받았다. 사실 거의 배우는 시간이었다고 할 수 있을 정도로 따라가는 시간이 많았는데, 아예..

배경지식! 01. 추가해야 하는 기능이 여럿 있었다. 모달창을 키고 끄는것. 무한 스크롤로 수정. 별점주기 기능(로컬 스토리지 활용) 02. 모달과 별점은 이전에 했던 것과 유사하여 크게 어렵지는 않았으나 무한 스크롤이 좋은 자료가 없어서 좀 헤맸다. 역시 좋은 자료는 영어로 되어 있다. 후 03. 개인적인 일정으로 인해서 시간이 없었다. 월요일까지 제출인데 토요일 오후에 시작하였다. 1번째 Push 설계 의도 * 각 컴포넌트 안 함수들은 그 컴포넌트 밖으로 내보이지 않기 * 각 컴포넌트에서 관련 이벤트 부여하기 가능한 이벤트를 삭제/재등록하지 않기 * 무한 스크롤 이벤트에서 옵저버 이벤트를 app.ts에 배치하여 최초 랜더링 시 이벤트 세팅 * itemList 에 이벤트를 부여해서 모달 여는 이벤트 위..

배경지식! 01. 처음으로 API를 사용해보기 > 비동기로 처리하기 위해 promise / asnyc / await 사용 02. 이벤트 부여하는 것을 유틸에 모아다가 렌더링 후 부여하는 방식을 사용해봄 03. 검색 API가 있다는 것을 처음에는 몰라서 헤메다가 나중에 검색 API를 사용 04. 렌더링 테스트는.. 어떻게 하는 거죠..? 1번째 Push 설계 의도 * 컴포넌트는 본인의 템플릿과 이벤트를 가지고 있습니다. * 컴포넌트 파일에서 이벤트를 부여하는 경우 렌더링이 이루어지지 않은 상태이기 때문에 이벤트 부여를 모아다가 렌더링이 끝난 이후 모은 이벤트를 부여해주었습니다. * 처음에는 맨 상위 컴포넌트에서 랜더링을 해주었지만, 그런 경우 async가 상위 파일까지 타고 올라가버립니다. 때문에 API에..

배경지식! 01. 점차 체력이 떨어져간다. 02. 추가되는 기능/ 선호목록 만들기, 선호-비선호, 세부정보 모달 03. 꼬여버린 임포트 1. PR 메세지 + 리뷰(답변) Q. 대략적인 파일 임포트 : 위에서 보실 수 있다시피 굉장히 파일이 엉켜있습니다. 이를 해결하기 위해서 붙잡고 있었지만 도저히 해결할 수 없었습니다. 이렇게 된 원인을 제 생각대로 말하자면, 컴포넌트의 불명확한 정의라고 생각합니다. 컴포넌트를 재활용이 가능한 엘리먼트 단위정도로 생각했습니다. 때문에 파일 안에 템플릿과 그 엘리먼트 용도에 맞는 함수들을 넣었습니다. 그 결과 다른 곳에서 그 함수를 필요로 한다면 그 파일을 임포트하게 되고, 이것이 상하관계 없이 이어지며 결국 서로가 서로를 임포트하는 상황에 이르렀습니다. 이 상황이 굉장히..

배경지식! 01. 여기서부턴 나혼자 리팩토링! 02. 악 테스트 어려워 1. PR 메세지 1. 구상 * 템플릿 분리: 일단 동적 컴포넌트로 따로 변경되지 않을 컴포넌트는 템플릿 파일에 따로 저장하였습니다. 파일로 분리해 놓는 것이 좋을 수 있지만, 적어도 지금은 분리되어있으면 가독성만 해친다고 생각하였습니다. 다만, 모달창을 하나의 폼으로 다시 정의한 과정에서 템플릿이 너무 길어졌다는 문제가 있습니다. 거슬리기는 하지만 따로 빼는 것은 다른 컴포넌트와의 통일성을 해친다고 생각해 동일하게 넣었습니다. * 컴포넌트: 일전에 했던 것처럼 컴포넌트 안에 이벤트리스너를 추가하는 함수를 구현했으나 로직들을 다른 파일에 만들어 불러오는 식으로 만들었습니다. 다만 이런 경우에 다른 파일에 종속된다고도 생각이 들었습니다..

배경지식! 01. 컴포넌트란 무엇일까. 컴포넌트 중심 개발이 미션 목표 02. 주어진 탬플릿으로 보다 원활한 css but 많아진 기능구현 03. 지금까지 중 제일 시간이 부족. 3일 중 마지막날에 이르기까지 못한 기능구현 04. 설계.. 했다고 생각했는데 어디까지가 도메인이죠? 1. PR 메세지 1. 구상 * 컴포넌트 분리: 컴포넌트를 처음 접했습니다. 때문에 컴포넌트가 무엇인지를 익히는 것이 가장 우선이었습니다. 페어와 이야기한 끝에 컴포넌트를 html 태그 중 기능을 가지는 것으로 정의하고 이를 하나의 파일로 만들었습니다. 해당 컴포넌트 파일은 컴포넌트를 랜더링할 수 있게 템플릿을 가지고 있고, 이벤트-모달창을 키거나, 필터를 하는 등-를 가지고 있는 경우 이벤트를 부여하는 함수를 포함했습니다. *..

배경지식! 01. 2단계는 1차 PR을 보내고 리뷰를 받고 그에 수정을 하고 2차 PR을 보내 머지까지 된 과정을 적었다. 02. 기술적인 부분에서 많은 아쉬움이 남는다. 03. 해야할 것들이 눈에 보이는데도 시간이 없고 내 마음의 여유가 없어 구축하지 못했다. 04. 해야할 것들과 배워할 것들이 쌓여있는데 코드도 짜기에도 바쁘고, 짠다고 해서 배움이 없으니 맘에 들지도 않는 상태이다. 지난 PR 때 작성한 질문에 대한 리뷰에 대한 리뷰 Q. 인터페이스와 상호작용하는 경우가 처음이라 이걸 여러 파일로 나누어도 되는 것인지, 이벤트 별로 나누는 것이 좋을지, 화면 별로 나누는 것이 좋을지, 혹은 다른 기준이 있을지 궁금합니다. A .크게 화면(페이지)에 따라 나누기와 컴포넌트에 따라 나누기가 있을거 같습니..

고민이 많은 날이 계속 되었다. 구조적으로 어느 것이 좋은 건지 모르겠고, 사람들은 이렇게 하고 있다고 말하는데 그걸 동의할 수 없었다. 사람들은 나름의 근거를 대며 그렇게 이어가고 있었고, 나는 그런 근거도 없이 일단 그게 아닌거 같은데, 하는 마음만 들었다. 그래서 일단 여러가지를 따라 이미 만든 코드를 분리해보고자, 리팩토링해보고자 했지만 손을 댈수록 이상해졌고, 이게 맞는 방법인지 의문이 들었다. 그러다가 코치분들이랑 이야기를 할 기회가 생겼다. - 내가 가장 고민을 하던 구조에 대해 질문을 했고, 왜 그걸 고민하는 지에 대해 물어보셨다. 결국 이야기의 종합적인 결론은 다른 사람을 너무 의식하지 말고 맞다고 생각하는 것을 하라는 것이다. 전공자이니 뭐니 해도 물어보면 사실 정답이 없는 부분도 많고..

배경지식! 01. 2단계는 웹으로 인터페이스를 만들어야해서 html, css를 연결해야 했다. 02. 기간은 길었고 많은 리뷰를 받으려면 빠르게 했어야 했다. 03. 바닐라 자바스크립트로 한 경험이 적어서 일단 index.js로 몰아넣었는데 후에 이걸 분리하기가 어려웠다. 04. 다른 사람들은 뷰를 만들거나 기능 단위로 구분하거나 했는데.. 나느.. 1단계 PR 리뷰의 리뷰 일단 1단계를 페어 끝내고 받은 피드백들과 질문에 대한 답변은 아래와 같다. 1. 작성 의도 1) mvc패턴에 대한 고민 : 코치님은 본 미션에서 나눈다면 어떤식으로 나누실지 궁금합니다. > M (모델): 데이터와 비즈니스 로직을 관리 V (뷰): 레이아웃과 화면을 처리 C(컨트롤러): 명령을 모델과 뷰 부분으로 라우팅이라는 기준에 ..

배경지식! 01. 로또는 프리코스때 했었다. 02. 인덴트(깊이)가 하나로 제한되었고, 인수도 2개로 제한되었다. -크게 상관은 없었다.- 03. 1단계는 페어로 이루어져 하나의 컴퓨터로 같이 코드를 짠다. 04. 기간은 총 3일이며 야근도 했다. 05. 하나의 컴퓨터로 돌아가며 진행하며 이번에는 시간을 기준으로 했다. 이번 미션은 이미 해봤던 거라 괜찮을 줄 알았는데 여전히 같이 하는건 에너지가 많이 소모된다. 이전에는 미션이 어떻게 진행되는 지에 대해 적응하는 기간이었다면, 이번에는 생각해보던 것들을 조금이나마 시도해보는 시간이었다. 저번 교육때 말씀하시기로 pr에는 코드 작성에 대한 내용을 담으라고 해서 이번에는 내가 의도한 바와 궁금한 점을 적었다. 아래가 그것이다. 1. 작성 의도 1) mvc패..