본문 바로가기
728x90

분류 전체보기27

#17. Setting Up Redux ! Redux를 셋팅 시작해볼까요? ? 다운 받아야 Dependency는 총 4가지 입니다. 1. redux 2. reaxt-redux 3. redux-promise 4. redux-thunk npm install redux react-redux redux-promise redux-thunk --save ( 한번에 다운받을 코드 ) Redux-promise, Redux-thunk가 필요한 이유는 무엇일까요? 리덕스를 잘 사용하기 위해서 필요한데.. 그렇다면..어떻게 잘 사용하는거지..? action은 언제나 객체형식으로 받는거이 아닌, Promise, Functions형태로 받을 때도 있답니다! 2021. 2. 14.
#16. React Hooks React Component ( Class Componet / Function Component ) Class Component 1. 더 많은 기능 사용 가능하다. 2. 코드가 더 길어지고 복잡해지고 성능이 조금 늘어지는 면이 있다. import React, {Component} from 'react' export default class Hello extends Component { render(){ return( hello my friends! ) } } Function Component 1. 한정적인 기능이 제공된다. 2. 코드가 간결해지고 성능이 빨라진다. import React from 'react' export default function Hello() { return ( hello my f.. 2021. 2. 14.
#15. Redux 기초 What is Redux ? Redux is a predictable state container for JavaScript apps. 리덕스랑 상태관리 라이브러리입니다. 그렇다면 state 는 무엇일까요 ? Props VS State Props 1. shorthand for properties 2. Props are how components talk to each other. 컴포넌트 간 무언가를 주고 받을 때 Props를 사용해야 합니다. 3. props flow downwards from the parent component 4. Props are immutable from the child perspective if you want to change that value ? the parent s.. 2021. 2. 13.
Warning: Prop `className` did not match next에서 styled-components로 스타일을 적용하고, 개발서버를 실행시키니 첫 화면은 정상적으로 로딩되다가 새로고침 이후 다음과 같은 에러 메시지가 발생하면서 적용된 스타일이 모두 사라져버렸습니다 🤦🏻‍♀️ ( 아니 이건 또 무슨 새로운 에러인가... ) Warning: Prop `className` did not match. Server : "~~~" Client : "~~~~" 라는 경고 메시지와 함께 화면 스타일도 모두 증발..! ⚠️ 구글링으로 검색해보니 저와 비슷한 사례가 몇가지가 있더라구요! " 첫 페이지는 SSR로 작동하며 이후 CSR로 화면을 렌저링하게 되는데, 이때 서버에서 받은 해시+클래스명과 이후 클라이언트에서 작동하는 해시+클래스 명이 달라지면서 스타일을 불러 올 수 없.. 2021. 2. 10.
반응형