- Clock.jsx
import React from "react";
function Clock(props) {
return (
<div>
<h1>안녕, 리액트!</h1>
<h2>현재 시간: {new Date().toLocaleTimeString()}</h2>
</div>
);
}
export default Clock;
- index.js
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import Clock from './chapter_04/Clock';
const root = ReactDOM.createRoot(document.getElementById('root'));
setInterval(() => {
root.render(
<React.StrictMode>
<Clock />
</React.StrictMode>
);
}, 1000);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();
'Front-end > React' 카테고리의 다른 글
[React] 실습 - 댓글 컴포넌트 만들기 (0) | 2023.05.24 |
---|---|
[React] JSX 정의, 장점, 사용법 (0) | 2023.05.24 |
[React] create-react-app (0) | 2023.05.17 |
[React] HTML 코드에 직접 리액트 연동 (0) | 2023.05.17 |
[React] 리액트의 정의, 장단점 (0) | 2023.05.17 |