Redux 란?
Redux에서 상태는 Store에 저장되며 모든 상태가 Store 안에 단일 객체로 저장됩니다.
이를 Single Store 아키텍쳐를 따른다고 합니다.
이렇게 저장된 상태를 Dispatch 함수를 사용해서 Action을 전달하게 됩니다.
Dispatch는 액션을 발생시키는 함수를, Action은 상태 변경을 나타내는 객체를 의미합니다.
이후에 Reducer에서 이전 상태와 Action을 처리하여 새로운 상태를 반환합니다.
이처럼 Redux는 Flux 패턴을 차용해 데이터 흐름을 단방향으로 만들고,
하나의 스토어에서 모든 상태를 관리하면서 Reducer 함수를 통해서 불변성을 유지하기 때문에
상태 변화의 예측이 쉽고 일관성있게 관리할 수 있습니다.
애플리케이션의 규모가 커지면 커질수록 이러한 장점이 부각되어 유지보수성을 높여주고
효과적으로 상태를 관리할 수 있습니다.
flux?
Dispatcher, store, view 세 가지 요소로 구성된
애플리케이션 아키텍처 패턴입니다. 데이터 흐름을 단방향으로 구성해서
상태 변화를 예측하기 쉽고 관리하기 쉬워지도록 설계하는 방법입니다.
inline 요소는 텍스트를 강조하거나 링크를 추가하는데 사용되고
block 요소는 페이지 레이아웃을 구성하는데 사용됩니다.
우선 레이아웃의 측면에서 보면 block 요소는
화면 전체의 가로폭을 가능한 한 많이 차지하려고 하는데 반해
inline 요소는 필요한 만큼의 공간을 차지하게 됩니다.
박스 모델도 이와 비슷하게 block 요소는 width, height 속성을 지정할 수 있는데 반해
inline 요소는 width, height 속성을 지정할 수 없고 내부 컨텐츠에 따라 크기가 결정됩니다.
대표적인 inline 요소로는 span, a 태그 등이 있고
block 요소는 div,h, p 태그 등이 있습니다.
inline-block
inline과 같이 같은 줄에 다른 요소와 함께 나란히 표시될 수 있는 동시에
block처럼 width, height 속성을 지정할 수 있는 박스 모델을 갖는 요소입니다.
보통 텍스트나 이미지 등을 포함하는 요소에 크기를 지정할 때 사용합니다.