일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
29 | 30 |
- nodeJS
- MongoDB
- React Component
- node
- React
- npm명령어
- 시퀄라이즈
- 리액트컴포넌트
- 리액트
- sementicversion
- 제로초예제
- sequelize
- 리액트스타디
- component
- nodejs교과서
- 클래스컴포넌트
- NoSQL
- 리액트기초
- mongoose
- mongo
- NPM
- 시퀄라이즈공부
- express-generator
- Today
- Total
목록전체 글 (115)
개발노트
리액트의 라이프 사이클 render 함수가 실행되면 DOM에 (render)함수를 붙여주는데 붙여주고난 그 순간에 이벤트잡아서 원하는 설정이 가능함 그게 componentDidMount, 컴포넌트가 첫 렌더링 된 후 componentDidMount -비동기 요청 컴포넌트가 제거되기 직전 componentWillUnmount (부모컴포넌트가 자식컴포넌트 없앴을때 자식이컴포넌트가 없어지기(unmount)전에 실행됨) 리렌더링후에 실행 componentDidUpdate -비동기 요청의 삭제 (컴포넌트를 삭제해도 만약 setInterval을 걸었을 경우 계속실행됨) 클래스컴포넌트 constructor state부분 render (ref) componentDidMount setState/부모가props바꿀때 ->..
jsx 구문 안에서 if const getAverage = () => { return result.length === 0 ? null : 평균시간: {result.reduce((a,c)=>a+c) / result.length} ms 리셋 } return ( {message} { getAverage() } ) return ( {message} { ( ()=>{ if(result.length === 0 ){ return null }else{ return (평균시간: {result.reduce((a,c)=>a+c) / result.length} ms 리셋); } })() } {/* { getAverage() } */} ) jsx안에 {} 쓰면 javascript쓸수 있으므로 즉시실행함수()=>{} 와 같이 i..
import React ,{ useState } from 'react'; const ResponseCheck = () => { const [ color, setColor ] = useState('waiting'); const [ message, setMessage ] = useState('클릭해서 시작'); const [ result, setResult] = useState([]); // timeout; // startTime; //시작시간 // endTime; //클릭한시간 const onClickScreen = ()=>{ if( color === 'waiting'){// waiting일때 클릭을 한 경우 setColor('ready'); setMessage('초록색이되면 클릭하시면 됩니다'); tim..
Rready상태 -> (클릭) -> 게임시작 기다려 상태 -> ( 2~3초 후 ) 클릭해 상태 -> (클릭) -> 반응속도를 체크! 1. 기본 state, if 만들기 import React ,{Component} from 'react'; class ResponseCheck extends Component{ state={ color:'waiting', message:'클릭해서 시작', result:[], } onClickScreen = ()=>{ const { color, result, message } = this.state; if( color === 'waiting'){// waiting일때 클릭을 한 경우 this.setState({ color:'ready', message:'초록색이되면 클릭하세요..