React로 시작하는 프론트 개발은 필자(seolim)의 경험을 기반으로 작성되며 절대 정답이 아닙니다! 이점을 유념하며 읽기 바랍니다.
React를 처음 접할 때 사용될 수 있는 환경 셋팅 툴체인은 크게 3가지로 나뉜다.
그 외에도 Nx나 Razzle등의 툴체인들이 있지만 자주 활용되지도 않고 위의 툴체인과 기능적으로는 유사하다. 간단하게 3개의 툴체인을 살펴보자.
처음 React를 시작하는 사람들은 CRA를 통해 React app을 최초 구성한다. CRA는 frontend 빌드 구조만 webpack과 babel을 통해 생성하기 때문에 나머지 작업(서버 연결 등)은 자유롭게 할 수 있다.
자세한 내용은 cra github를 참고하자.
Gatsby는 정적 사이트를 빠르게 만들기 위한 툴체인이다. gatsby에서 기본적인 routing 시스템과 정적 파일 빌드를 포함하고 있으며, 통신에 GQL을 활용하여 최신 트렌드에 맞는 개발을 하기 용이하다.
자세한 내용은 Gatsby 정식 가이드를 참고하자.
Next는 React로 SSR환경을 자동 구축해주는 툴체인이다. Node서버를 기반으로 동작하는 Next 서버 위에서 HTML랜더링을 React로 가능하게 구성되어 있다. 이외에 서버를 자율적으로 설정할 수 있는 등 customize도 자유로운 편이다.