

Mui에는 많은 소스가 있다. 그 중에서 내가 이번 플젝 때 사용한 많~은 컴포넌트 중 하나는
바로
데이트레인지피커!
캘린더다.
Range기때문에 start date, end date로 기간을 설정하는 달력인데, 이게 우리 플젝에서 나름 중요하게 쓰이는 컴포넌트였고, 당연히 다양한 기획이 있었기에 커스텀을 진행했다.
1차 땐 차장님이 만들어주신 공통 컴포넌트를 가져와 적용하면서 이해도를 높였다면 2차 땐 스스로 공통을 개발해보는 시간들이 많았는데 정말 큰 성장을 할 수 있었던 기회였다.
공통을 만든다면 대부분 재사용 가능성, 이해하기 쉬운 로직, 쉬운 유지보수가 중요할텐데
우물 안 개구리처럼 내가 만든 페이지에서 사용하는 컴포넌트들이 다른 영역에서 어떻게 쓰이는지를 경험할 수 있었던 시간이었다.
그리고 공통 개발은 정말 어렵지만 뿌듯한 파트다라고 생각이 든다.
공통을 개발하면서 늘어나는 건, 내 파트가 아니어도 다른 페이지의 이해도가 올라가고 그 경험을 말미암아 협업할 때도 다른 사람들이 내가 만든 컴포넌트를 쓸 때 굳이 나한테 와서 재확인 시간을 갖지 않아도 되게 하려는 그런...어떤 스킬?들이 쌓이게 된다.
의외로 또 알게 된 점
사실 좀 귀찮아하던 영역인데 변수명 함수명 짓는 거..ㅋㅋ
중요성은 이미 알고 있었지만, 남이 내가 만든 컴포넌트를 쓴다고 생각하니까 더 열정을 가지고 짓게 되었다.이 변수명이 진짜 그 변수 설명대로 로직을 갖고 있나? 이 변수명 외에 다른 로직이 끼어들어서 괜히 이해하기 어렵게 합쳐진 로직은 없나?
이 로직이 이 위치에 있는 게 맞나? 이 페이지에 이런 함수를 놓는 게 맞나?등등 변수명 짓기를 하면 확실히 내가 가야할 방향을 정하는 것과도 같아서 나한텐 그게 약간 방향 표지판이 되었다 ㅎㅎ
또 커스텀을 한다는 게 진짜 너무 어려웠는데..막상 하고나서 후회되는 점들을 고칙다보면 예상 못했던 사이드이펙트를 만나고, 그 사이드 이펙트를 통해 내가 그 전에 인지하지 못하고 사용중이던 기능의 영향이 여기까지 닿는 걸 깨닫게 된다. 그게 너무 신기했고 깨닫는 큰 시간들이었다.
난 아직 2년차 주니어인데 기쁘게도 이렇게 경험해볼 수 있어서 조금씩 확실하게 알아가는 것 같다..ㅋㅋ
근데 진짜 1차 끝나고 인수인계 받은 페이지들에소 에러가 2차 때 발견되서 고치는데 리액트 훅 폼을 쓰고 공통으로 다 만든 페이지다 보니까, 솔직히 처음 보는 페이지여도 금방 고친다. 이래서 공통이 중요하고 공통 프로세스 양식대로 만들어진 페이지가 유지보수가 용이하다는 걸 피부로 깨닫게된다..
'front > react' 카테고리의 다른 글
[ react, MUI ] 대리님이 알려준 CheckBox onChange에대한 데이터 타입 변환 공통 처리 (0) | 2024.08.22 |
---|---|
[ react, useHook ] 공통 컴포넌트의 실시간 데이터 전달 useImperativeHandle 훅 소개 (0) | 2024.08.22 |
[ react, MUI ] mui의 dataGrid props "apiRef" 활용 (0) | 2024.08.22 |
useMemo, useCallback 차이점 (0) | 2024.06.26 |
[ React, Typescript ] ChartJs 사용하기 (0) | 2024.01.08 |