728x90 300x250 SMALL 컴포넌트3 리액트 합성(Composition)이란? 리액트 합성은 컴포넌트를 조합하여 더 큰 컴포넌트를 구성하는 방식이다.즉 여러 개의 컴포넌트를 합쳐서 새로운 컴포넌트를 만드는 것이라고 할 수 있다.이를 통해 재사용성과 유연성을 높이며, 상속보다 구성 철학을 따른다.합성은 컴포넌트를 다른 컴포넌트의 자식이나 속성으로 전달하여 구조를 구성하는 것을 의미한다. 리액트 합성의 주요 패턴1. 자식 컴포넌트를 사용하는 합성컴포넌트 내부에서 props.children을 통해 하위 컴포넌트를 포함하는 방식이 패턴은 레이아웃 컴포넌트(예: 카드, 모달, 컨테이너 등)에서 자주 사용된다.function Card(props) { return {props.children};}// Card 컴포넌트 사용 예시function App() { return ( .. 2025. 2. 12. React에서 하위 컴포넌트 간 상태 공유하는 방법 하위 컴포넌트에서 State 공유하기하위 컴포넌트에서 부모 컴포넌트의 상태를 공유하거나, 상위 컴포넌트와 상태를 주고받는 경우에는 상태를 위로 끌어올리거나(Lifting State Up) Context API와 같은 방법을 사용해 상태를 관리할 수 있다.1. 상태를 부모 컴포넌트로 올려서 공유하기(Lifting State Up)React에서 Lifting State Up(상태 끌어올리기)은 부모 컴포넌트에서 상태를 관리하고, 그 상태를 하위 컴포넌트에 props로 전달하는 방법이다.예시 : 상위 컴포넌트에서 하위 컴포넌트로 상태 전달하기// 부모 컴포넌트 (Parent)import React, { useState } from 'react';function Parent() { // 부모 컴포넌트에서 상태.. 2025. 2. 9. 소프트웨어 아키텍처(Software Architecture) 란? 소프트웨어 아키텍처(Software Architecture) 란? 개념적 의미 여러 가지 소프트웨어 구성요소와 그 구성요소가 가진 특성 중 외부에 드러나는 특성, 그리고 구성 요소 간의 관계를 표현하는 시스템 구조나 구조체 좀 더 자세히 설명하면 소프트웨어 아키텍처에서 아키텍처 = 구조 소프트웨어는 여러가지 기능들로 구성되어있습니다. 예를들어 포토샵만 봐도 도형그리기, 색칠하기, 저장하기, 글씨쓰기 등 다양한 기능들이 존재 합니다. 그래서 이렇게 수많은 기능 하나하나의 부품들을 어떻게 연결시켜 관계를 맺었는지 각각의 요소들간의 관계를 표현하는 것 각 부품의 기능들을 쭉 뽑아서 이해 관계자들이 모여서 이런이런 기능들을 어떻게 배치할지 얘기해서 결정합니다 하나의 의사소통 도구로 활용 되는 것입니다. 소프트웨.. 2021. 5. 28. 이전 1 다음 728x90 반응형 LIST
