Низа за креирање на деца компоненти во React

Да претпоставиме дека имаме низа со производи:

const prods = [
	{id: id(), name: 'product1', cost: 100},
	{id: id(), name: 'product2', cost: 200},
	{id: id(), name: 'product3', cost: 300},
];

Ајде да прикажеме три компоненти Product, пренесувајќи им ги податоците од нашата низа како пропсови. За сега нема да користиме циклус, туку едноставно ќе се повикуваме на елементите од низата и објектот:

function App() {
	return <div>
		<Product name={prods[0].name} cost={prods[0].cost} />
		<Product name={prods[1].name} cost={prods[1].cost} />
		<Product name={prods[2].name} cost={prods[2].cost} />
	</div>;
}

Направете компонента User која ќе ги прикажува податоците за корисникот на екранот. Нека овие податоци бидат име, презиме, возраст. Оформете ги податоците за корисникот во вид на таг tr, кој содржи три тага td.

Во компонентата App е дадена следнава низа:

const users = [
	{id: id(), name: 'user1', surn: 'surn1', age: 30},
	{id: id(), name: 'user2', surn: 'surn2', age: 31},
	{id: id(), name: 'user3', surn: 'surn3', age: 32},
];

Со помош на оваа низа прикажете три корисници. Оформете го нивното прикажување во вид на табела table.