file: public>index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
</html>
file:src>index.js
내보내줌 entry file
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById('root')
);
reportWebVitals();
file:src>App.js
import React from 'react';
import Test7 from './components/Test7';
const App = () => {
return (
<div>
<Test7 />
</div>
);
};
export default App;
file:src>components/Test7.js
import React, { Component } from 'react';
class Test7 extends Component {
//클래스 영역 ->this
handleClick1 = () => {
alert('연습')
}
handleClick2 = () =>{
alert('연습중')
}
handleClick3 = () =>{
alert('연습중 입니다.')
}
render() {
return (
<div>
<p>
<button onClick={this.handleClick1}>클릭1</button>
<button onClick={this.handleClick2}>클릭2</button>
<button onClick={this.handleClick3}>클릭3</button>
</p>
</div>
);
}
}
export default Test7;
'개발자 > React.js' 카테고리의 다른 글
| [210131] React.js 설치 및 실행 (0) | 2021.01.31 |
|---|