Jaypedia

React project 본격적으로 Mountain project를 시작했다. 나는 산 검색과 리스트 페이지를 하고 있다. 내가 맡은 부분을 구현하기 위해 search라는 브랜치를 만들어서 거기에 커밋하고 있다. 내일 미팅 때 검토를 받고, 구현했을 때 막혔던 부분들이나 미흡한 부분을 피드백 받은 후 merge를 진행할 예정이다. 네비게이션 바는 이런 식으로 만들어 보았다. Ant Design의 Menu 컴포넌트를 활용했다. 여기에 React router dom의 Link 컴포넌트를 써서 클릭하면 해당 페이지로 이동하도록 구현했다. 로고는 우선 삼각형 아이콘으로 대체했는데, 산 이미지로 바꾸는 게 나아 보인다. 산의 리스트를 보여주는 부분은 전에 했던 영화 보여주는 것과 로직이 흡사하다. 아직 백엔드와 ..

1. Git & Github, Sourcetree 본격적인 협업을 위해서 알아야 하는 필수적인 깃 사용법을 다지려고 했다. 혼자서 프로젝트 할 때와는 또 다르기 때문에 알아둬야 할 것들이 좀 있었다. 책은 예전에 구매해뒀던 라는 유명한 책을 읽었다. 총 9챕터인데, 아직 4챕터를 읽는 중이다. 사실 3챕터에 있는 내용이 협업 때 정말 필수적이라 이 부분을 잘 읽고 협업 때 깃 사용할 때 적용하려고 한다. VS Code의 Source control과 CLI만 계속 써오고 있었는데 Sourcetree를 써보니 정말 편리하고 시각적으로 잘 들어오는 게 느껴졌다. 색깔 구분도 명확하고, 포인터가 딱 있어서 좋다. 다운만 받아보고 읽지 않았던 도 읽기 시작했다! 많이 읽진 않았지만 오늘부터 꾸준히 읽어 보려고 한..

12월 2일부터 24일, 지금까지 계속 리액트로 미니 프로젝트를 진행 중이다. 중간에 다른 이벤트들이 있어서 잠깐 보류한 적도 있었지만, 그래도 계속해서 달려오고 있고, 31일에 최종 마무리를 해서 완성할 예정이다. 사실 이번 프로젝트는 리액트를 알고 활용하면서 작품을 만든다기보다는 리액트를 배워나가면서 하나의 프로젝트를 완성시켜보는, 공부와 경험을 위한 프로젝트이다. 그렇기 때문에 코드의 품질은 아직 신경쓰지 않고, 우선 기능 구현과 익숙해지는 것을 우선하면서 진행하고 있다. CRUD 기능을 구현하고 있는데, 그중에 Update 기능을 어떻게 구현했는지 풀어서 써 보려고 한다. 사실 기능 구현은 다 했기 때문에 구현만 끝내고 넘어갈 수도 있겠지만, 한 번 정리를 해 두면 나중에 다시 같은 기능을 구현할..

1. React movie project (1) 영화 별점 로직 수정 별점 부분을 수정하느라 꽤나 많은 시간을 소요했다. Ant Design에서 별점(rating)을 가져와서 영화 별점을 매기는 것이었는데, 5점 만점 체계였다. 그런데 나는 10점 만점 체계로 하고 싶었다. 처음에는 단순하게, 그냥 데이터도 5점 만점으로 저장하고 렌더링할 때만 2배로 해서 할까 싶었다. 그러나 멘토로부터 피드백을 받았는데 DB와 UI의 일관성이 있어야 한다고 했다. 그래서 다른 방법을 구상해 보기로 했다. 우선 사용자가 입력한 rating을 db에 저장 시 2배로 저장해 줘야 한다. Ant Design 체계에서는 5점 만점에 4로 설정했더라도, db에서는 그게 8점으로 저장이 되어야 한다. 그렇게 하기 위해 46번째 라..