일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
31 |
- html
- 미디어쿼리
- 리액트
- object array
- for of
- 천단위 콤마
- for in
- media query
- 웹개발
- 일정 간격
- 반응형
- 배열
- js
- intl
- React
- 세 자리 콤마
- React 시작하기
- javascript html 연동
- 타입스크립트
- setinterval
- Array
- 배열 자르기
- 배열 값 삭제
- Typescript
- CSS
- 일정 간격 코드 실행
- 상대시간
- javascript
- clearinterval
- 숫자 포맷
- Today
- Total
목록React (3)
ryxxn
간단한 Timer 컴포넌트의 예시를 보자. import React, { useState, useEffect } from 'react'; const Timer = () => { const [count, setCount] = useState(0); useEffect(() => { const intervalId = setInterval(() => { // count 상태 갱신 setCount(prevCount => prevCount + 1); }, 1000); // 1초마다 실행 // 컴포넌트가 언마운트되면 setInterval 정리(cleanup) return () => clearInterval(intervalId); }, []); return ( Timer: {count} ); }; export defau..
리액트와 타입스크립트를 같이 사용하고 싶다면 npx create-react-app my-app --template typescript 위와 같이 기존 프로젝트 생성 명령어 뒤에 --template typescript만 붙여주면 된다. 리액트 시작하는 법이 궁금하다면 아래 글을 참고하자. [React] 리액트 프로젝트 시작하기 drxxn.tistory.com

HTML 삽입 미리보기할 수 없는 소스 1. node.js 설치하기 node.js 환경에서 구동해야 하기 때문에 node.js가 설치되어 있지 않다면 설치해준다. Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 2. 프로젝트 생성 프로젝트를 저장할 폴더로 이동 후 터미널에서 다음과 같이 명령어를 친다. npx create-react-app 프로젝트명 ※ 프로젝트명에 대문자는 들어갈 수 없다. 3. 프로젝트 실행 프로젝트 폴더로 이동 후 npm run start 또는 npm start 명령어를 통해 프로젝트를 실행한다. cd 프로젝트명 npm start 프로젝트를 실행하면 다음과 같이 페이지..