React/라이브러리
-
React - reselect 사용하기React/라이브러리 2020. 8. 31. 23:37
들어가기에 앞서, 우선 Selector를 먼저 알아야 한다. Selector는 무엇인가? selector는 state에서 필요한 데이터를 가져오거나, 계산을 수행해서 원하는 형태의 데이터를 가져오는 역할을 말한다. 왜 써야 하는가? 다음 예제를 살펴보자. todoApp 리듀서와 getIncompleteTodos selector가 존재한다. // Reducer function todoApp(state = [], action) { switch (action.type) { case GET_ALL_TODOS: return { todos: action.data.todos }; default: return state; } } // Selector function getIncompleteTodos(state) { r..
-
React - Font Awesome과 Toastify 사용하기React/라이브러리 2020. 5. 26. 10:00
Font Awesome 이란? - 웹에서 아이콘이 필요할 때 가장 많이 사용되는 라이브러리 중 하나이다. Font Awesome fontawesome.com Font Awesome 패키지 설치 방법 1. FontAwesome의 SVG 기반 아이콘을 활성화 시키기 위해 기본 패키지를 설치한다. 2. FontAwesome 아이콘 대한 패키지를 설치해야 한다. 여기서 무료로 제공하는 Solid, Regular, Brands 3개의 카테고리에 대한 패키지만 설치한다. 3. 마지막으로 FontAwesome을 React 컴포넌트 형태로 사용할 수 있도록 하는 패키지를 설치한다. 그러고 나서, 적용 시켜보자. 인스타그램 클론 했던 소스에서 Header 컴포넌트에 적용해보았다. 저렇게 돋보기 아이콘이 생긴 것을 확인할..