Folder Structuring Techniques for Beginner to Advanced React Projects
DEV Community
📌 React 프로젝트를 위한 폴더 구조화 기법
어떤 방식으로 React 코드를 정리하시나요?
create-react-app 을 통해 프로젝트를 생성한 것만으로 서비스를 유지하기 어렵죠. 오늘 글에선 초급, 중급, 고급으로 나누어 React 폴더 구조화 기법을 소개합니다.
더 많은 콘텐츠를 보고 싶다면?
이미 회원이신가요?
2023년 1월 26일 오전 2:07
댓글 6
항상 공유해주시는 자료들에서 많이 배우고 있어서 감사합니다! 현재는 프로젝트에서 components 폴더 내부에 layout, feature, shared 폴더를 만들어서 사용중이고 services 폴더 대신 core 라는 폴더를 사용중인데, 글을 읽고나니 외부로 꺼내야할지 명칭을 변경하는것이 좋을지 고민이 되네요! 혹시 조은님만의 폴더 구조를 정하는 팁 같은게 있을까요?? *질문이 정보를 불충분하게 담고 있을수 있어서 현재 진행중인 프로젝트의 레포지토리 주소도 첨부해 봅니다(https://github.com/jong6598/daangn_FE_refactoring)
@종현 개인적으론 꼭 가이드를 따를 필요는 없다고 생각해요! 지금 방식으로 작업하시다가 불편한 점이 생겼을 때 참고 자료로 보시고 개선하셔도 되지 않을까요? 저는 프로젝트 규모가 작은 초기에는 본문의 ‘중급’정도로만 폴더를 구조화해요. 이후에 서비스가 복잡해지고 함께 작업하는 사람이 늘어나면 pages, features, components 정도로 나누는 편입니다. 프로젝트 시작 전에 팀원들과 함께 ‘폴더 트리를 세 댑스 이상으로 늘리지 말자’ 같은 규칙을 세워두고 규칙을 지키기 어려워지면 폴더 구조를 다시금 생각해보는 방법도 좋더라구요.
@하조은 오 좋은것 같아요! 서비스 개선을 하면서 프로젝트가 커지면 좀 더 효율적으로 폴더구조를 관리할 수 있는 방법이 있을지 고민해봐야겠네요...감사합니다 주말 잘보내세요 조은님!
@하조은 조은님 폴더구조와 관련해서 비슷한 고민을 하고 계신분이 있어서 답변 일부를 공유하려고 하는데 괜찮을까요?
@종현 그럼요! 감사하죠~
감사합니다. 현재 리액트로 개발중인 프로젝트에 적용을 해봐야겠네요
