CodeSquad Day 74 : Team Project 2 - Day 4

 

CodeSquad🔹Day 74

 

어제에 이어 오늘도 햄디와 카페에서 페어 프로그래밍으로 팀 프로젝트를 진행했다. 이번에는 우리의 체력을 고려해서 오전에는 온라인으로 하고 오후 2시가 조금 넘은 시간에 만났다. 

글을 쓰다가 사진을 넣으려던 중에 갑자기 티스토리가 멈춰버려서 쓰던 내용이 날아가서 다시 쓴다. 티스토리에 이런 불편함이 있다. 블로그 만드는 방법을 좀 배워서 블로그 이사를 갈까 고민이 된다. 

 

# Scrum 

우리의 게더타운에서 햄디, 동기와 만났다. 준은 어제 새벽까지 열심히 구현하느라 피곤하셨는지 참석하지 못하고 셋이서 진행했다. 간단히 각자의 컨디션과 어제 한 일, 오늘 할 일을 이야기했다.

분명 오늘 컨디션이 좋았는데.. 체해버렸다.

오늘 음식을 잘못 먹었는지 카페에 도착하고 나서 매우 속이 좋지 않았다. 속이 메슥거려서 팀 프로젝트를 원활하게 진행하지 못하고 있었는데 햄디가 무려 상비약을 휴대하고 있었다! 감사하게도 약을 먹고 나서는 매우 멀쩡해져서 이후 진행이 원활하게 될 수 있었다. 햄디의 꼼꼼함과 준비성에 내가 살아날 수 있었다. 

 

# 헤더 네비게이션 바에 Mouse 이벤트 주기

오전에는 온라인으로 페어 프로그래밍을 했다. 일단 헤더에 위치한 네비게이션 바에 마우스를 올리면 서브 메뉴가 펼쳐지고, 마우스가 밖으로 이동되면 다시 접혀야 했다. 우리는 MouseEnter와 MouseLeave 이벤트를 활용해서 구현했다. 

여기에 transition 이벤트를 줘서 좀 더 부드럽게 펼쳐지는 효과를 주고 싶었는데, 그게 잘 되지 않아서 어려웠다. 일단은 그 부분은 보류하고 넘어가기로 했다. 

React State Batch Update

이벤트를 붙이게 되면서 어려운 부분이 있었다. React의 setState는 비동기로 처리가 되는데, 그 부분을 잘 몰랐어서 햄디와 많이 헤맸다. 위의 링크를 제대로 학습해야겠다. 

 

# GitHub Issue 기반 Branch 생성

GitHub로 프로젝트 관리하기 Part1 - 이슈 발급 부터 코드리뷰까지 | Popit

github - issue 관리하기

햄디가 Issue에서 바로 그 이슈에 해당하는 브랜치를 만드는 것을 보고 이런 식으로 이슈 관리를 할 수 있다는 것을 배우게 되었다. 관련 자료를 찾아보다가 도움이 될 것 같은 두 링크를 첨부해본다. 

 

# 백엔드와의 협업 - 서버 터트리기, 소소한 웃김

기획전 부분을 구현하는데 백엔드분들이 만든 API를 fetch를 사용해서 데이터를 그려줘야 했다. 처음에는 CORS Error가 떠 버리는 바람에 서버가 바로 죽어버렸다.

빨간 글씨 팍팍. 비상!

게더타운에서 준에게 이 에러를 공유해드렸고, 얼마 지나지 않아 에러를 소멸시켰다! 그 과정은 같이 보지는 못했는데 어떻게 그렇게 금방 에러를 잡았는지 궁금했다. 

 

드디어 API로 기획전 부분을 그려줄 수 있었다. 그런데 준이 넣은 이미지가 김치인데 하필 내용은 중국 전통음식이라고 되어 있었다. 이것 때문에 슬랙의 그룹 채팅에서 한동안 준의 사상검증(?)을 하고 난리가 났는데 정말 웃겼다. 

햄디의 깨알 그림

 

 

---

원래는 내일도 카페에서 만나서 페어로 진행을 할 계획이었지만, 우리의 체력 + 내일 스케쥴은 거의 발표로 이루어져 있어서 그냥 온라인으로 하기로 했다. 어차피 내일은 2시까지 PR을 제출해야 하고, 오후 시간은 계속 지금까지 했던 것에 대한 공유를 해야 하는데 카페에서 하면 잡음이 많이 들려서 발표가 어려울 것 같았다. 그래서 우리는 다음 주 월요일과 화요일에 다시 만나기로 했다. 

페어 프로그래밍을 직접 만나서 하는 경험이 나에겐 정말 새롭고 재미있었다. 온라인으로 할 때보다 집중력이 훨씬 올라간다는 것, 온라인에서 했던 것처럼 화면공유 할 필요가 없고 바로바로 화면을 손가락으로 짚으면서 소통이 된다는 점 등등 편리하다는 것도 많이 느꼈다. 이번 프로젝트가 정말 재미도 있고 즐기면서 하고 있다! 체력만 좀 잘 유지하고 끝까지 열심히 해야겠다는 생각이 든다.