const Viewer = () => {
return (
<div>
<div>현재 카운트 : </div>
<h1>0</h1>
</div>
);
};
export default Viewer;
import './App.css';
import Viewer from './ponent/Viewer';
function App() {
return (
<div className="App">
<h1>Simple Conter</h1>
<section>
< Viewer/>
</section>
</div>
);
}
export default App;
import './App.css';
import Viewer from './ponent/Viewer';
function App() {
return (
<div className="App">
<h1>Simple Conter</h1>
<section>
< Viewer/>
</section>
</div>
);
}
export default App;
import './App.css';
import Controller from './ponent/Controller';
import Viewer from './ponent/Viewer';
function App() {
return (
<div className="App">
<h1>Simple Conter</h1>
<section>
< Viewer/>
</section>
<section>
<Controller />
</section>
</div>
);
}
export default App;
body{padding: 20px;};
.App {margin: 0 auto; width: 500px;}
.App > section{padding: 20px; background-color: #f8f8f8; border: 1px solid #cccccc; border-radius: 5px; margin-bottom: 10px;}
<aside> 💡 Props
</aside>