2023년 회고에서 내년에 할 거라고 잠깐 언급했던 그 프로젝트를 하게 되었다!
이 프로젝트의 팀원은 총 3명으로 이루어져있다.
팀 이름은 '나람쥑'인데, 각자의 닉네임에서 한글자씩 따와서 만들었다. 정말 잘 만든 것 같다!
프로젝트를 시작하기 전에 어떤 프로젝트를 하고 싶은지 이야기를 나누어보았다. 우리는 공통적으로 '재미있고', '실제로 사용자가 있는' 프로젝트를 하고 싶어했다. 그래서 채택된 주제는 '트위터 명함 만들기'였다.
피그마 작성을 포함한 기획이 회의 두번만에 빠르게 끝났다. 그리고 빠르게 배포하는 것을 목표로 잡고 개발에 들어갔다.
평일에 매일 9시에 모여서 회의를 했고, 2주차 부터는 오전 9시-12시 코어타임을 가져서 화면공유를 하며 작업했다.
너는, 나는 프로젝트 때도 그렇고, 모달 컴포넌트를 만드는 일은 항상 어려운 일인 것 같다.
// 📄 모달 컴포넌트를 사용하는 페이지.tsx
const Page = () => {
const showBottomSheet = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
if (e.target !== overlayRef.current) {
e.stopPropagation();
}
NiceModal.show(BottomSheet);
};
return (
<button onClick={showBottomSheet}>
명함 전달하기
</button>
);
};
export default Page;
// 📄 모달 컴포넌트.tsx
const BottomSheet = () => {
const overlayRef = useRef(null);
const modal = useModal();
const closeBottomSheet = () => {
modal.remove();
};
return (
<div
ref={overlayRef}
onClick={closeBottomSheet}
/>
);
};
export default NiceModal.create(BottomSheet);
1, 2주차에는 UI 작업 위주로 했다. 3주차에는 아래 목록을 작업하고 싶다.
그리고 이번에 알게 된 nice-modal-react 라이브러리에 대해 더 알고 싶어서 공부해보는 시간을 갖고싶다!
팀에서 백엔드를 맡으신 람쥐님이 멋진 회고를 써주셨다👏
람쥐님🐿️의 회고 보러가기