[Flutter] GoRouter vs Navigator 뭐가 다를까?

Flutter에서 화면을 전환하는 방법은 크게 두 가지가 있습니다. 기본적으로 제공되는 Navigator, 그리고 Flutter 2.5 이후 많은 앱에서 도입 중인 Gorouter입니다.

이 글에서는 Navigator와 Gorouter의 개념과 역할, 자주 사용하는 메서드, 그리고 각각의 장단점과 사용 시기를 비교하고, 예시까지 다뤄보겠습니다!!

Gorouter란?

Gorouter는 Flutter에서 제공하는 선언형 라우팅 라이브러리입니다.
Flutter 2.5 이후 공식적으로 권장되기 시작했고, URL 기반 라우팅, 딥링크, 브라우저 히스터리 처리에 유용하게 쓰입니다.

Gorouter 특징

• 선언형 방식 : URL과 화면을 선언적으로 연결
• 딥링크 자동 처리
• path, params, query, redirect등 라우팅 요소를 명확히 정의 가능
• 웹 호환성이 뛰어남

자주 쓰는 메서드

• go() : 현재 라우트를 새 경로로 바꿈 (기존 스택 제거)
• push() : 현재 스택 위에 경로 추가
• pushReplacement() : 현재 경로를 새 경로로 교체
• replace() : URL만 바꾸고 화면은 유지 (웹 전용)
• pop() : 현재 화면 제거(뒤로가기)
• canPop() : 디ㅜ로가기 가능 여부 확인

코드 예시

GoRouter.of(context).go('/home');

GoRouter.of(context).push('/profile');

GoRouter.of(context).pop();

Navigator란?

Navigator는 Flutter의 기본 라우팅 시스템으로 명령형 방식입니다.
화면 전환을 직접 push, pop 등의 메서드로 제어하고, 라우팅 스택을 세부적으로 다룰 수 있습니다.

Navigator 특징

• 명령형 방식 (코드에서 직접 전환 명령)
• 라우팅 스택 직접 제어
• 커스텀 애니메이션이나 복잡한 트랜지션 구현 가능
• 딥링크는 직접 처리

자주 쓰는 메서드

• push() : 새 화면 추가
• pop() : 현재 화면 제거 (뒤로가기)
• pushReplacement() : 현재 화면을 새 화면으로 대체
• pushAndRemoveUtil() : 조건을 만족할 때까지 이전 스택 제거 후 새 화면 push
• popUntil() : 특정 조건까지 pop 반복
• canPop() : pop 가능 여부 확인
• maybePop() : 가능할 경우만 pop

예시

Navigator.of(context).push(
  MaterialPageRoute(builder: (_) => ProductDetail()),
);

Navigator.of(context).pushAndRemoveUntil(
  MaterialPageRoute(builder: (_) => TargetScreen()),
  (route) => false,
);

Gorouter vs Navigator 비교

항목	Gorouter	Navigator
방식	선언형	명령형
딥링크 지원	자동 처리	수동 처리 필요
URL 관리	가능	불가
스택 제어	제한적	자유로움
뒤로가기 커스터마이징	어려움	쉬움
적합한 상황	웹, 딥링크, 구조화된 앱	복잡한 흐름, 푸시알림, 조건부 제어

마무리

Gorouter와 Navigator 중 어떤걸 써야할지 고민하시는 분들에게 도움이 되었으면 좋겠습니다! 하나만 쓰는게 아니라 적절한 상황에 적절한 기능을 적용해 섞어 쓰는게 가장 좋은 방법입니다.