import './App.css';
function Alert(props) {
	return (
		<div className="alert">
			<h2>{props.title}</h2>
			<p>{props.content}</p>
		</div>
	)
}
function Card(props) {
	return (
		<div className="card">
			<h2>{props.title}</h2>
			<p>{props.content}</p>
		</div>
	)
}
function App() {
	const list = [
		{ title: 'リスト1', content: 'リスト1の内容です。' },
		{ title: 'リスト2', content: 'リスト2の内容です。' },
		{ title: 'リスト3', content: 'リスト3の内容です。' },
	]
	return (
		<div className='App'>
			<h1>React sample</h1>
			<header className="container">
				{list.map((item) => (
					<Card title={item.title} content={item.content} />
				))}
			</header>
		</div>
	);
}
export default App;