Per ardua ad astra.

asChild 속성들어가며@asChild@ 속성에 대해 정리해본다. asChild 속성개념Radix UI와 같은 라이브러리에서 사용되는 속성컴포넌트가 래핑(Wrapping)된 자식 컴포넌트의 스타일이나 기능을 그대로 유지하면서 특정 기능을 제공하기 위해 사용된다. 의미자식 요소를 그대로 사용한다.래핑된 컴포넌트가 새로운 DOM 노드를 생성하지 않고, 해당 자식 요소의 DOM을 그대로 사용하여 기능만 추가한다.불필요한 DOM 노드가 추가되지 않아 HTML 구조를 깔끔하게 유지하고, 스타일이 깨지지 않도록 보장한다. 사용 예 Menu ⇒ @@은 @@의 자식이지만, @@가 새로운 DOM 노드를 만들지 않는다.⇒ 대신 @@ 자체가 @DropdownMenuTrigger@로 작동하게 된다. 사용하면 좋은 경우추가..

토스트 메시지 띄우기 간단 예제 (ReactDOM.createPortal)들어가며리액트(React.js)를 이용하여 구현해본 토스트(Toast) 메시지 띄우기 간단 예제 코드를 올려본다.기능을 구현하기 위해 @react-dom@ 패키지의 @createPortal@ 함수를 사용하였다. 코드 App.jsximport React from 'react';import Toast from './Toast';function App() { const [isToastVisible, setIsToastVisible] = React.useState(false); function handleEnrol() { setIsToastVisible(true); setTimeout(() => { setIs..