컴포넌트

AI에게 화면을 맡기면 “이건 컴포넌트로 빼자”는 말을 자주 해요. 화면을 ‘뺀다’니, 처음 들으면 무슨 소린가 싶죠. 사실 이건 정리 정돈에 가까운 개념이에요.

컴포넌트는 화면을 이루는 재사용 가능한 조각이에요. 버튼 하나, 카드 하나, 상단 메뉴 하나가 각각 컴포넌트가 될 수 있어요. 레고 블록을 떠올리면 쉬워요. 같은 모양 블록을 여러 자리에 끼워서 큰 걸 조립하잖아요. 화면도 이 조각들을 조립해서 만들어요.

장점은 ‘한 번 만들어 여러 곳에 쓰고, 고칠 땐 한 곳만 고친다’예요.

그래서 “컴포넌트로 빼자”는 건, 반복되는 화면 조각을 하나로 만들어 재사용하자는 뜻이에요. 버튼 스타일을 바꾸고 싶을 때 스무 군데를 다 손대는 대신, 버튼 컴포넌트 하나만 고치면 전부 바뀌죠. 바이브코딩에서 이 개념을 알면 AI에게 “이 부분 컴포넌트로 정리해줘” 하고 더 정확히 시킬 수 있어요.