Web&Dev

리덕스는 왜 쓰는가?

- 리덕스란? - 컴포넌트는 local state를 갖고, 앱은 global state를 갖기 떄문이다. 문제는 많은 컴포넌트로 만들어진 앱은 local state를 관리하기 어렵다는것. - 예를들어)모든 컴포넌트는 로그인 유무를 알 필요가 있는데, 포스트의 하트 여부는 모든 컴포넌트가 알 필요가 없지. - Redux가 필요없는 경우: 그냥 단순히 블로그 포스트와 댓글을 뿌려주는경우 - Redux가 필요한 경우. : 대댓을 달 경우.(내가 누구인지 ? + 어떤 댓글에 대댓인지) - 만약 억지로 Redux없이 개발한경우 : 과도한 props 낭비, flying prop라고 사용할지도 모르는 정보를 오버해서 넘겨 주어야 겠지. | 컴포넌트 자식간의 소통이 어렵다. 그 길을 부모가 다 텨줘야함. - 리덕스는 ..

React JS 개발일지 AntDesign 튜토리얼 CSS 프레임워크 시작

AntDesign 핀터레스트 Gestalt 사용하려다가, 차라리 좀더 완성된 컴포넌트 UI 프레임 워크를 배우자. !! CSS 프레임워크를 사용하면 빠르게 프로토 타입을 만들 수 있다. 즉, 페이지 디자인에 시간을 많이 쏟는다면 애초에 프레임워크를 사용해서, 웹구조만으로 디자인까지 얻어가려는 목적이다. CSS 프레임 워크는 두 종류로 나뉜다. 컴포넌트 프레임워크 : 부트스트랩, MD 부트스트랩, AntDesign 등 유틸리티 프레임워크 : tailwind 등 각 장단점은 있다. 컴포넌트 프레임워크는 컴포넌트 단위로 다자인이 되어있기때문에, 빠르게 페이지를 구성하는 반면, 프레임워크 티가 난다. 반면, 유틸리티 프레임워크는 직접 디자인을 하면서 컴포넌트를 써 내려가기 때문에, 다소 번거롭지만 디자인은 할때..

블로그 꾸미기 - 해커같은 배경 및 글자색 변경하기 CSS,HTML 편집 2

#블로그 꾸미기 - 해커같은 배경 및 글자색 변경하기 CSS,HTML 편집 2 저번 시간에 footer부분(웹 페이지중 아래 부분)의 배경색과 글자색을 바꾸는 작업을 했습니다. 그러나, 링크가 걸려있는 text는 적용이 되지 않았는데요. 이제 링크가 걸려있는 부분도 색깔을 바꿔 봅시다. 코드 : #footer a[href], #footer-widget a[href]{ color:#00E6f9; } 코드해석 : #(id를 만드는 겁니다. 원하는 디자인을 하고 이 디자인 모듈을 id로 만들어서 원하는 태그에 적용합니다. div태그에 적용하고 싶으면 div="footer" 라고 적용합니다. footer (id 이름이 footer입니다. a[href] (id d이름이 footer이고 그 아래 태그중에서 또 a태..

블로그 꾸미기 - 해커같은 배경 및 글자색 변경하기 CSS,HTML 편집

#블로그 꾸미기 - 해커같은 배경 및 글자색 변경하기 CSS,HTML 편집 요약~. 1. 내가 바꾸고 싶은 요소를 찾는다. 2. 그 요소에 적용된 CSS을 찾아서 배경과 글자색을 변경한다. F12을 눌러서 소스코드 보기를 합니다. 크롬기준 소스부분에서 찾기(crtl + f)을 눌러 foot을 검색합니다. foot이란 페이지 하단부분을 가르키는 말입니다. 그리고 하단부는 여러 박스모델로 이루어져 있는데 하나의 박스가 태그입니다. 박스중 id = footer-widget을 찾습니다. 해석하자면, 이 박스(div)는 footer-widget이라는 디자인이 id로 적용이 되었다 입니다. 그러면 footer-widget이라는 디자인만 바꾸면 되죠 ~. 하나더 뺀아래 저작권 표시 박스도 찾아줍니다. 저 박스는 fo..