728x90 react22 #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. #14. React Js를 위한 CSS FrameWork React Js를 위한 CSS FrameWork 5가지 🎉 1. Material UI 2. React bootstrap 3. Semantic UI 4. Ant Design 5. Materialize 가장 깔끔하고 간편한 Antd를 추천합니다 ! ant.design/ Ant Design - The world's second most popular React UI framework ant.design Ant Design 설치 방법 npm install antd --save 2021. 2. 7. 이전 1 2 3 4 ··· 6 다음 반응형