[스크럼] 노션 프로젝트 팀 회고

Keep

(만족하고 있는 부분, 계속 이어나갔으면 하는 부분)

• 미해
• 디자인 면에서 만족한다. 특히 사이드 바 없애기/나타나기 부분 + 자연스러운 hover 기능
• 토글 정보를 저장하고 불러오는 방식에서 set을 사용해서 깔끔히 구현한 점.

• 창민
• 화면 전환 과정이 불편함이 없도록 한 점
• 리팩토링을 주기적으로 진행한 점

• 인수
• 기존 처럼 마음이 급한 상태로 프로젝트 기능위주로 구현하지 않고, 일련의 단계를 거쳐 프로젝트를 진행한 것 (요구사항분석 - 와이어프레임- 컴포넌트, state설계- feature산출- 기능개발- 이슈정리)
• 리렌더링 부분, 코드가독성부분 계속 생각하려고 한 것
• 고민사항을 적어두었던 것

• 준혁
• 처음으로 바닐라로 옵저버 패턴을 도입하여 부드러운 동작과 저장에 문제가 없도록 구현한것이 맘에 듭니다. 그리고 트리를 다룰 때 데이터를 fetch하지 않고 직접 손으로 트리 구조를 다루어 트리 동작 방식에 대하여 좀 더 깊은 이해를 할 수 있었습니다.
• 리팩토링을 통해 App의 슈퍼클래스가 되는 것을 막을 수 있었습니다. 300줄 가까이되던 앱 컴포넌트를 100줄로 거의 200줄 다이어트를 했습니다.! 😄

• 정환
• 배포를 하고 실제 사용자가 느낀 불편함을 개선했던점이 좋았습니다. (리아가 찝어준 자동 저장시 깜박힘 현상, 내용을 지우고 다시 적었을때 저장이 안되는 현상 등등..)
• contentEditable이랑 조금은 친해진 느낌이 납니다. 어떠한 조건에서 enter를 쳤을때 어떤 태그를 형성하는지 이걸 해결하는데 시간이 걸려서 .. 이해하니까 조금은 기본적인 html만 아는것이 아니라 더 능숙해진것 같습니다.

Problem

불편하게 느끼는 부분, 개선이 필요하다고 느낀 부분

• 미해
• 페이지 로딩 시 버벅임 / 저장 시 일부 내용이 가끔 날라가기/ 수정 자동저장 시 focus 날라가는 등의 문제가 남아있다.
• 컴포넌트를 어느 정도로 쪼개야 할지 확실하지 않았다 ⇒ 일단은 크게 쪼갰는데, 더 세분화시켜서 가독성을 높이고 & 렌더링을 줄이는 방향에서 좋을 것 같다!
• contentEditable, 문서 추가 시 하위 문서 렌더링, /누르면 옵션 설정 가능 이런 기능을 추가하고 싶다!

• 창민
• 시간 분배 실패
• 구현 방식 기록을 못한 점
생각해둔 방식을 기록해두지 않아 생각의 반복이 일어남
• 불필요한 리렌더링 발생
네비게이션 바에서 변하지 않는 DOM도 리렌더링 : 대표적으로 에디터에서 내용 작성 시 발생하는 경우

• 인수
• 개발속도가 너무 느렸던 것 → 아마 과감한 도전에 대한 불안감?
• debounce 모듈화, contenteditable 끝내 완성하지 못한 것
• 개발 중 기록 어느정도 해야할 지 모르겠다는 것. 추후에 도움이 될 것인지, 다시볼 것인지 판단하기 어려운 부분

• 준혁
• contentEditable
• 사이드바 버튼 active시 옆에 리스트도 같이 액티브되는 문제
• 사이드바 숨기고 표시하는 방식 도입하기!
• 배포 사이트에서 새로고침할 때 간헐적으로 발생하는 404문제
• 해결하고자 하는 이슈가 있다면 이것을 왜 해결하고 싶었는지(무슨 문제가 있어서인지, 아니면 어떤 부분에서 불편함을 느꼈는지에) 같이 기록하는 연습

• 정환
• 자동저장하고 state를 setting하는 과정에서만 마크다운이 지원되어 실제 입력한 시점보다 늦게 글씨 굵기가 바뀌는 사용성 문제
• 글삭제 버튼 사이드 제목 옆에 없고 상세페이지로 들어가야 삭제할 수 있는 사용성 문제
• 사이드바 토글 구현 안해서 서브 페이지까지 다 보이는 사용성 문제
• 자동저장 및 새로운 페이지 추가때 마다 화면이 새로고침되는 것처럼 번쩍이는 현상

Try

Problem에 대한 해결책, 다음 회고 때 판별가능하도록, 당장 실행가능한 것

• 미해
• 낙관적 업데이트나 일부 최적화가 덜 되어서 문제들이 발생하는 것 같다.
• 전반적인 컴포넌트 구조를 쪼개고 리팩토링을 할 예정이다.
• 쓸데없이 fetch되는 경우를 줄이는 것이 중요할 것이라고 생각된다.
• 개발 중에 어떻게 구현할지 고민 & 시행착오 한 부분이 많았는데, 개발 후 정리하려다 보니 기억나지 않는 부분이 많았다. 미리 정리해두는 습관을 기를 필요가 있다!

• 창민
• 기간이 정해져 있는 경우 시간 분배 필요(일정 계획)
• 생각한 구현 방식뿐 아니라 개발 중간에 지속적인 기록
• 리렌더링 발생 부분을 줄이기 위해 컴포넌트 분리 등 시행할 예정

• 인수
• 실제 개발에 들어가기 전 완벽히 과정을 이해하기는 어렵다는 것을 느낌
• state와 컴포넌트 구조는 실제 개발에 들어가서 충분히 바뀔 수 있는 부분이기 때문에, 모든 것을 완벽히 짜놓고 시작하려고 했던 것 강도 낮추어보기
• 과감한 기능구현 시도해보기
• 머릿속에 완벽히 정리되거나, 실제 어떻게 구현할 수 있을지 확신이 들지 않으면, 계속해서 망설이는 경향이 있었다.
• 기록은 커밋단위로 하되 이슈와 고민사항은 따로 빼서 적는 것이 좋겠다라고 생각

• 준혁:
• App 컴포넌트가 슈퍼 클래스가 되어가고 있었고, 쪼개야 할 필요성을 많이 느꼈다. (App 컴포넌트가 트리의 구조도 바꾸고, 상태도 다루고, 라우터도 다루고 있었다...) → 컴포넌트의 목적에 맞게끔 딱딱 분리하는 것이 매우 어려운것 같다.
• 기능을 구현하고 나면 쪼갤 수 있는 부분과 공통 부분을 찾고 공통된 부분을 밖으로 빼는 연습을 하자.
• 상태가 필요없는 컴포넌트도 하위 컴포넌트에 내려 유지보수가 점점 어려워지고, 이벤트 콜백 함수를 계속해서 넘겨주어 지저분했다. (굉장히 어려운 문제다)
• 앞으로는 구조를 잡아놓은 뒤 작성하는 연습을 해야겠다. → 구조를 한번 엎었다 (옵저버 패턴을 도입하느라 디버깅에 시간이 많이 걸렸다, 처음부터 구독 모델을 알았더라면 이런 문제는 없었겠지만..)
• 일단 더미 데이터로 작동하는지 확인 → 핵심 부분이 잘 동작하는지 확인하고 나머지 부분을 다루자.

• 정환
• setState를 할때 화면 새로고침이 일어나지 않도록 history.pushstate로 이동하지 않고 App에서 State를 갱신하는 방식으로 렌더링 최적화를 버그 리포트를 받고 핫픽스 한것
• 새로운 글을 추가하려고 할 시 글 저장이 안되는 버그 리포트 받은 후 contentEditable 속성 위치를 수정하고 DOM 요소를 조작하는 대상을 변경하여 해결한 것
• 시간이 촉박하여 급하게 작성하여 교육 받았던 논리만 적용되어 있는 것 다음에는 시간을 좀 더 가져 교육 받은 내용뿐 아니라 여러 내 생각이나 알고 있는 패턴을 적용해 볼 것