본문 바로가기
반응형

분류 전체보기266

함수형 컴포넌트에서 리덕스 데이터 사용하기 클래스형 컴포넌트에서 connect() 함수를 이용해서 리덕스 스토어와 컴포넌트를 연결했다. 함수형 컴포넌트에서는 useSelector() 훅을 사용해서 store에 접근하여 변수를 가져올 수 있고 useDispatch() 훅을 통하여 직접 action creator들을 dispatch 시킬 수 있다. 클래스형 컴포넌트의 connect와 다른 점은 connect 함수를 사용하는 경우 해당 컨테이너의 부모 컴포넌트가 리렌더링 될 때 해당 컴포넌트의 props가 바뀌지 않았다면 리렌더링이 자동으로 방지되지만, hook은 그렇지 않기 때문에 React.memo를 사용해서 컴포넌트의 성능 최적화를 해야한다. useSelector() 리덕스 스토어의 데이터(=state를) 조회할 수 있다. 사용하기 위해서는 "r.. 2021. 11. 11.
[빔프로젝터] 애니빔 ALP-500 리뷰 안녕하세요! 오랜만이에요. 이번에는 빔프로젝터를 구매하게 되었어요 ㅎㅎ 빔프로젝터는 친구가 구매한 것을 보고 갑자기 저도 가지고 싶어 구매하게 되었답니다!!! 빔프로젝터가 워낙 가격이 천차만별인데 학생이다 보니 30만원 예산으로 구매했답니다. 구매한 제품은 아래 제품입니다 애니빔 ALP-500 제품 선택 기준은 가격 / 최소한의 안시루멘 / FHD 화질 / 명암비 였어요. 처음에는 프로젝터매니아 PM1080 프로 제품을 구매하려 했는데 아래 영상을 참고하여 구매를 하지 않게 되었어요. 따라서 명암비가 비교적 아쉽지만, 안시루멘이 550이고, FHD인 애니빔 ALP-500을 선택하였어요. 명암비가 비교적 낮은 고정 2000:1 / 동적 10000:1 이라고 해요. 이부분이 가장 걱정되었는데, 아래에서 결과.. 2021. 11. 11.
블루투스 무선 키보드 만렙 BK101 사용기 안녕하세요! 오랜만에 블로그 글을 작성하네요 ^_^ 아이패드를 사면서 몇일 써본 결과, 무선 마우스와 키보드가 있다면, 더 유용하게 사용할 수 있어서 구매했던 것들이에요. 만렙 BK101 실버 무선 블루투스 키보드 구매한 제품은 만렙 무선키보드 BK101 실버 제품이에요. 쿠팡에서 단순 박스훼손 제품이 4천원이나 싸길래 박스훼손으로 주문했답니다. 배송 로캣배송으로 금방 배송왔고 특별한 뽁뽁이는 없이 왔답니다! 쿠팡이 배송이 진짜 빨라서 조금 비싸도 이용하게 되는거 같아요 ㅎㅎ 패키징 패키징은 박스훼손 제품이라는게 이해 안될정도로 새것이 왔어요. 따로 박스가 있었나?? 싶더라구요. 박스훼손임에도 완전 세제품이 와서 기분 좋았답니다 ㅎㅎ. 쿠팡 박스훼손 제품을 앞으로도 이용해 보아도 좋을것 같아요. 포장은 .. 2021. 10. 10.
[ 청주 ] 청주한우 방문기 안녕하세요! 이번에는 추석을 맞이하여 올리는 포스팅이에요! 청주 한우 방문기랍니다. 부모님을 뵈러 청주를 갔을때 제가 한우를 사드리고 싶어 방문한 곳이에요. 사실 제가 찾은곳은 아니고 부모님이 여기가 저렴하다고 이곳으로 가보자고 하시더라구요. 그래서 방문해보았습니다!. 위치 청주한우는 청주인들에게 익숙한 충청북도 경찰청 주변에 위치해 있어요! 외곽에 위치해있기 때문에 업장이 매우 넓어 쾌적해요. 내/외부 애초에 가성비로 승부하는 집인 만틈 외관과 내부가 한우집답게 고급스럽지는 않아요. 창고형? 건물에 위치한 한우집이랍니다. 정육점 / 구매 고기를 먼저 사서 내부에서 구워먹는 방식이에요! 저희는 2등급 한우모둠과 1등급 업진살, 치맛살을 구매해서 들어갔답니다. 다른 곳 같을때보다 양은 많지만 엄청 싼건 아.. 2021. 9. 17.
클래스형 컴포넌트에서 리덕스 데이터 사용하기 클래스형 컴포넌트에서 리덕스 데이터 사용하기 1. 리덕스 모듈과 connect 함수를 불러온다. // 리덕스 스토어와 연결하기 위해 connect 호출 import {connect} from 'react-redux'; // 리덕스 모듈에서 (bucket 모듈에서) 액션 생성 함수 두개를 가져오기 import {loadBucket, createBucket} from './redux/modules/bucket'; connect()는 리덕스 스토어와 컴포넌트를 연결한다. 사용할 때 'react-redux'에서 import해야 하고 컴포넌트를 export할 때 mapStateToProps, mapDispatchToProps 같은 함수를 매개변수로 컴포넌트와 묶는다. 2. 상태값을 가져오는 함수와 액션 생성 함수.. 2021. 9. 3.
리덕스와 컴포넌트 연결 리덕스와 컴포넌트 연결 (index.js) import import { Provider } from 'react-redux'; import store from './redux/configStore.js'; import는 두가지가 필요하다. ReactDOM.render( , document.getElementById('root') ); Provider로 감싸준다. 완성코드 import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; // 라우터 설정 yarn add react-router-dom import {BrowserRouter} from 'react-router-dom.. 2021. 9. 3.
반응형