Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
Tags
- backend
- NextJs
- JavaScript
- Component
- MongoDB
- GRID
- DART
- 리액트
- node.js
- Session
- Mongoose
- Flutter
- HTML
- frontend
- ES6
- nodejs
- javscript
- API
- react
- pug
- graphQL
- heroku
- CSS
- ECMAScript
- form
- 자바스크립트
- express
- CLONE
- clonecoding
- TypeScript
Archives
- Today
- Total
목록SET (1)
Enjoy Programming

component 의 life cycle까지 알아보았고. 이제 movie app을 만들기 위해 movie component를 구성해본다. state를 만들어주고 기본적으로 컴포넌트가 마운트 되면 라이프 사이클이 시작된다. 라이프 사이클은 마운트 되는 순간 시작되었으니 isLoading은 당연히 true이다. render에서 isLoading이 true이면 Loading을 아니라면~ Ready라고 알려준다. 자 이제 로딩이 끝나면 ready로 변경이 되어야 하는데~ 컴포넌트의 render를 하면 호출되는 life cycle method인 componentDidMount함수를 통해 setTimeout함수로 5초뒤 setState를 이용해 isLoading을 false로 바꿔준다. 6초뒤 브라우저는 Loadi..
JavaScript/React
2021. 6. 1. 03:22