Showcase의 컴포넌트 미리보기 렌더링 과정은 다음과 같은 주요 단계로 진행됩니다.

1. 요청 처리

• http://localhost:3000/docs/showcase/previews/components/button과 같은 URL 요청은 `Showcase::PreviewsController

show 액션으로 라우팅되며, id` 파라미터는 “components/button”으로 설정됩니다.

2. Showcase::Path 객체 생성

• show 액션은 params에서 추출한 “components/button”을 인자로 사용하여 Showcase::Path 객체를 인스턴스화합니다. 이 객체는 미리보기의 id와 basename을 저장합니다.

3. Showcase::Preview 객체 생성 및 데이터 채우기

• `Showcase::Path

preview_for 메서드는 view_context, id, basename을 인자로 받아 새로운 Showcase::Preview` 객체를 생성합니다.

• 이후 `Showcase::Preview

render_associated_partial 메서드가 호출되며, 이는 @view_context.render를 사용하여 실제 미리보기 partial(예: showcase/previews/components/button`)을 렌더링합니다.

• 흥미로운 점은 이 partial이 뷰처럼 동작하지만, 실제로는 showcase 로컬 변수(즉, Showcase::Preview 인스턴스)에 정의된 badge, description 등의 메서드를 호출하여 Showcase::Preview 인스턴스의 @badges, @description, @title과 같은 인스턴스 변수들을 채운다는 것입니다.

4. 최종 뷰 렌더링

• Showcase::PreviewsController는 최종적으로 app/views/showcase/engine/show.html.erb 뷰를 렌더링합니다. 이 뷰는 @preview 인스턴스 변수(데이터가 채워진 Showcase::Preview 객체)를 showcase/engine/preview partial에 전달하여 제목, 배지, 설명을 화면에 표시합니다.

이러한 아키텍처는 사용자에게는 마치 뷰 파일을 작성하는 것처럼 느껴지지만, 실제로는 모델(Showcase::Preview)에 데이터를 채워 최종 뷰 렌더링에 활용하는 방식으로, 깨끗한 인터페이스와 뛰어난 개발자 경험을 제공합니다.