2021년08월15일
수정하기
문서 생성 2021-08-15 22:38:25 최근 수정 2021-08-15 22:55:12
Note
React
- React 프로젝트 셋팅
npx create-react-app 프로젝트명
- 실행
npm start
- React는 내가 원하는 곳에 html element 를 넣어주는 역할을 한다.
- virtual dom 을 만들어서
Component
- HTML 을 반환하는 함수이다.
- JSX는 javascript와 HTML 의 조합이다. 컴포넌트는 JSX를 반환하는 것이다.
- 컴포넌트 간의 데이터 통신은 props를 이용한다.
const Animal = ({name, color, pic}) => {return <div><h2>I like {name}</h2><h4>{color}</h4><img src={pic} alt={name}/></div>...function App() {return (<Animal name="lion"color="yellow"pic="/images/lion.png"/>)}
- 전달한 props의 값이 정상적인지 유효성 체크를 하려면
prop-types
를 사용한다. npm install prop-types
Animal.propTypes = {name: PropTypes.string.isRequired,pic: PropTypes,string.isRequired,color: PropTypes.string,}
log
- 광복절이다. 직장에 다녔으면 휴일이라 딱 실감이 났을텐데 어제부터 관련 뉴스가 나와서 알게되었다. 광복절 관련 뉴스를 보면 열받는 소식이 종종 들려온다. 빠른 시일 내에 해결되었으면 하는 문제들이 많다. 이런걸 보면 나는 일개 국민으로서 뭘 할수있을까 하는 생각이 들기도 한다.
- 진짜 오랜만에 30분 달리기했다. 아버지랑 같이 달렸는데 1시간이나 달리셨다. 저번에 헬스장 갔다가 코로나 검사를 받으신 이후로 이제 헬스장 안가려고 하신다. 그래서 이틀에 한번은 따라갈테니 동생과 셋이서 운동하기로 했다.
- 오픈소스 컨트리뷰션 아카데미 첫 미팅이 있었다. 일주일 내내 생각한 문제지만 과연 내가 여기서 뭘 남길 것인가를 진지하게 생각해야겠다. 그리고 꼭 정리하고 되새겨야 한다. 일주일간 눈팅을 했는데 다른 개발자분들을 보며 정말 배울 것이 많다는 생각이 들었다. 나도 기여를 꼭 할 수 있도록 하고, 지금 이런걸 할 수 있는 기회를 정말 정말 감사히 여겨야겠다.
- 한 1년만에 리액트 공부를 했다. 옛날 자료를 보아서 class component로 되어있었는데 댓글에 왜 이걸로하냐는 말 천지였고 설명하는 분도 자신은 현재 hooks를 사용하고 있다고 하셨다. 중요한 것은 왜 지금은 function component를 많이 쓰는지 그걸 알아야하는 것 같다.