Rumi

by Pritesh Patel

HTML

<!--
Build below mockup using reactJS

Mockup:
https://imgur.com/s013euY

1. Build a product module with complete CSS with below JSON
2. When user clicks on Add button, he should be able to increment and decrement the Qty with + and - 

JSON:
{
	"statusCode": "0",
	"statusMessage": "The API View Merchandised Content was executed successfully",
	"products": [{
		"id": "910000374507",
		"name": "ASDA Grower's Selection Satsumas",
		"price": "£1.00",
		"imageURL": "https://ui2.assets-asda.com:443/g/v5/981/313/5051413981313_130_IDShot_4.jpeg",
    "volume": "500gm",
    "pricePerUom": "14.0p/each",
    "quantity": 0
	}, {
		"id": "1121465",
		"name": "ASDA Grower's Selection Ripen at Home Kiwi Fruit",
		"price": "£0.75",
		"imageURL": "https://ui2.assets-asda.com:443/g/v5/677/308/5051413677308_130_IDShot_4.jpeg",
    "volume": "8pk",
    "pricePerUom": "20.0p/each",
     "quantity": 0
	}, {
		"id": "910000911005",
		"name": "ASDA Chosen by Kids Pears",
		"price": "£1.00",
		"imageURL": "https://ui2.assets-asda.com:443/g/v5/013/823/5054070013823_130_IDShot_4.jpeg",
    "volume": "1.2kg",
    "pricePerUom": "12.5p/each",
     "quantity": 0
	}]
}

  
Please make the component fully functional. 
-->

<div id="app"></div>

React

class ProductComponent extends React.Component {
	render() {
		return (
    	<div>Hello</div>
		)
	}
}

ReactDOM.render(<ProductComponent />, document.querySelector("#app"));