CRA is deprecated

오전 공부를 시작하기 전, 프론트엔드 톡방에서 알림이 왔다. CRA가 결국 공식적으로 Deprecated 되었다는 소식이었다.

사실 CRA는 몇 년 전부터 유지보수 모드(maintenance mode)에 들어갔지만, 공식적으로 "CRA is deprecated" 라는 표시는 없었다. 그러나 최근 논란이 커지면서 React 코어 팀이 공식적으로 CRA를 Deprecated 상태로 표시했고, npm에서도 이를 반영했다고 한다.

기존 프로젝트의 대응 방법

CRA를 사용하던 기존 프로젝트는 당장 문제없이 유지 가능하지만, 더 이상 업데이트가 없을 것이므로 장기적으로 본다면 다른 도구로 마이그레이션을 권장한다고 한다.

보통 Vite, Next.js 등으로 이전할 수 있는데, Vite가 CRA와 가장 유사한 개발 환경을 제공하면서도 더 빠르기 때문에 좋은 대안이 될 것 같다.

왜 CRA가 Deprecated가 되었을까?

CRA가 유지보수 모드에 들어간 이유는 여러 가지가 있겠지만,

• 느린 개발 환경: CRA의 Webpack 기반 빌드 시스템은 Vite보다 느리고, 개발자 경험도 상대적으로 떨어짐

• 구성 옵션 부족: CRA는 설정을 내부적으로 관리하여 기본적으로 숨기는 방식(eject 전까지)이므로, 커스텀 설정이 필요한 프로젝트에서는 한계가 있었음

예를 들어, 특정 플러그인을 추가하거나 Webpack/Babel 설정을 직접 변경하려면, 기본 상태에서는 불가능하다. 이를 위해 eject 명령어를 실행하면, CRA가 내부적으로 관리하던 Webpack, Babel, ESLint 등의 설정 파일이 프로젝트 루트 디렉토리로 풀려나며 수정할 수 있게 된다. 하지만 eject를 실행한 후에는 되돌릴 수 없고, CRA의 자동 업데이트 기능도 사용할 수 없게 된다.

반면, Vite나 Next.js 같은 도구들은 기본적으로 설정을 숨기지 않고, 필요할 경우 vite.config.js 또는 next.config.js 등을 직접 수정할 수 있도록 열려 있다. 이처럼 유연한 설정 관리 방식이 CRA와의 큰 차이점 중 하나다.

• 경쟁 도구의 발전: Vite, Next.js, Remix 등의 발전으로 CRA를 사용할 필요성이 점점 줄어들었음

앞으로의 React 프로젝트 선택지

CRA를 대체할 도구로 React 공식 문서에서도 CRA 대신 다른 React 프레임워크를 권장하고 있다.

• Vite: 가장 가벼운 SPA 환경

• Next.js: 서버 사이드 렌더링(SSR), 정적 사이트 생성(SSG) 지원

• Remix: 서버 중심 아키텍처, 점진적 페이지 로딩 최적화

프론트엔드를 배우기 전부터 이 업계는 끊임없이 변화하며, 사라지는 기술도 많아 지속적인 학습이 필수적이라는 말을 많이 들었다. 하지만 막상 내가 실제로 사용했던 기술이 곧 사라진다고 하니, 처음으로 이런 변화를 직접 겪는 입장에서 묘한 기분이 든다.