23.07.08(토)

하루 요약

1. 10시 : DND 회의
2. 13 ~ 15시 : OSCCA(오픈소스 컨트리뷰션 아카데미) 발대식
3. 17 ~ 21시 : Gloddy 개발
4. 21시 ~ 22시 : Frontend 공부

오늘 한 일

1. Glody 개발
   1. Client Component - Server Component 분리
   2. layout 설정 휴대폰에 맞게 수정
   3. Join/Step1 페이지 Zutand로 전역 상태 관리 (진행 중)
2. Frontend 공부
   1. 아이콘 디자인 가이드
   2. React에서 타입지정
   3. 좋은 코드

오늘 배운 내용 요약

1. Server Component는 page.tsx에 두고, 그 안의 컴포넌트들을 Client Component로 분리하면 깔끔하다.
2. dvh를 사용하면 모바일 화면에 맞게 높이 레이아웃을 설정할 수 있다. 그리고, 가로 너비는 max-width를 사용하여 일정 너비까지 넓어지고, 그 이상은 넓어지지 않는 방법으로 반응형을 구현할 수 있다.
3. React Component의 타입은 JSX.Element타입으로 지정할 수 있다.
4. 아이콘은 그리드 비율을 정하여 8,16,24,32.. 단위로 사이즈를 제작하는 것이 좋다.
5. 터치 영역은 간격 조정을 통해 아이콘 주변도 터치할 수 있도록 아이콘을 제작하는 거싱 좋 다.
6. Airbnb 스타일 가이드 - Javascript
   1. 메서드의 단축구문 사용(const item = {getName(){}})
   2. 유사배열을 배열로 변환할 때 Array.from()사용
   3. array와 object의 구조화 사용 (const {name, age} = item)
   4. 함수형보다는 함수 선언 사용 (function getName(){})

추가로 학습할 것

1. Airbnb 스타일 가이드 - Javascript 계속 읽기
2. 클린 코드 계속 읽기

오늘의 생각

다른 참고 프로젝트들, 그리고 다른 프로젝트에서 수행한 방법들, 그것들의 장단점 분석, 그리고 내 생각들을 메모하면서 개발을 진행하였다. 생각이 정리되고, 정리가 착착 되는 것 같고 깔끔했다. 앞으로 Github Discussions를 애용해야겠다.

OSCCA를 다녀왔다. 프로젝트 목표가 MDN문서 번역이여서 상당히 아쉬웠다. 오픈소스로 React.js, Next.js 번역에 기여한 경험이 이미 있다. 문서 번역은 굳이 같이하지 않고 혼자서도 충분히 가능한 것이라는 생각이 들어 아쉬웠다.