1. function vs const
멘토님께서는 리액트에서 컴포넌트를 작성할 때
function
키워드를 선호하시는지, 아니면 const
키워드의 표현식을 선호하시는지 궁금합니다!
저는 개인적으로는 함수 컴포넌트는 function
으로 작성하고, 내부의 이벤트 핸들러는 const
로 작성해서 구분하려는 성향이 있었는데
간혹 forwardRef
나 memo
같은 고차 함수를 사용해야 할 때에는 const 를 사용해야 하는 경우도 있어서 그냥 모두 const로 통일하는게 나을지.. 고민이 있습니다.
이 부분은 선호의 차이일까요? 아니면 더 많이 사용되는 방법이 존재하는 것일까요?Function 과 const 표현식의 차이. 동적이냐 정적이냐의 차이. Arrow function을 주로 쓴다. Const 표현식은 클로져를 만들기에 유리하다.
2. 프로젝트 디렉토리 구조
소스코드 디렉토리 구조를 정리할 때
/pages/*
, /components/*
, /hooks/*
와 같이 유사한 파일의 종류별로 정리할지.. 아니면 함께 사용되는 기능별로 정리할지 고민이 되었습니다! 멘토님께서 제안해주실 수 있는 방법이나, 혹은 관련해서 찾아보면 좋은 키워드, 자료 등을 추천해 주실 수 있나요?
ex) 예를 들어서pages
디렉토리에 존재하는 특정 상세 페이지에서만 사용되는 컴포넌트인데, 이런 경우에는 /components/*
디렉토리로 뺴는 것 보다 그냥 /pages/상세페이지
경로에 함께 정리하는 게 더 괜찮을까요?큰 서비스는 기능중심으로, 간단한 서비스는 feature중심으로 한다. 상황과 어떤 것을 추구하느냐에 따라 다르다. https://ahnheejong.name/articles/package-structure-with-the-principal-of-locality-in-mind/ 참조
3. Tailwind 관련 질문
Tailwind CSS + SCSS or Tailwind CSS + CSS-in-JS 처럼, tailwind와 기타 CSS 작성 방법을 함께 사용하는 경우도 존재하나요?
간혹 복잡한 미디어 쿼리나 애니메이션 효과를 작성하려면 tailwind 만으로는 어려울 수도 있겠다는 생각을 했었습니다..
Vanila extract, stitches 참고. 과거를 잘 알아야 한다. (흐름, 시대에 따라서 기술스택들이 바뀐다)
4. 노트북 질문
가벼운 질문으로 멘토님께서 사용하시는 노트북이 무엇인지 궁금합니다!!
(7년쓴 그램이 버거워해서 하나 구매하려고 고민중입니다.. 😂)