<repo_name>ChristianDarlington/React-Practice-First-Day<file_sep>/src/components/Menu.js
import React from 'react'
import MenuItems from './MenuItem'

function Menu() {
  return (
    <ul>
<MenuItems item="Chicken Fingers" />
<MenuItems item="Fried Chicken" />
<MenuItems item="Noodles" />
<MenuItems item="Soup" />
    </ul>
  )
}

export default Menu <file_sep>/src/components/MainImage.js
import React from 'react';
import heroImage from '../Image/Meatball.jpeg'




function MainImage(){
  return(
    <div className="image-container">
      <img className="main-image" src={heroImage} />
      <img src={heroImage} />
    </div>
  )
}

export default MainImage

<file_sep>/src/components/FoodItem.js
import React from 'react';

function FoodItem (props){
  return(
    <div>
      <h5>{props.item.foodName}</h5>
      <p>{props.item.foodName}</p>
      <p><strong>{props.item.price}</strong></p>
    </div>
  )
}

export default FoodItem<file_sep>/src/components/Header.js
import React from 'react'



function Header() {
return( 
  <>
  <h4 className="header">Sanchise Meatballs</h4>
  </>
 )
}

export default Header <file_sep>/src/components/FoodItems.js
 import React from 'react';
import FoodItem from './FoodItem';

const food = [
  {
    id:1,
    foodName: "Italian Combo",
    price:"$12.99",
    ingredients:"deli meat, lettuce, tomato, bread, provolone"
  },
  {
    id:2,
    foodName:"Pastrami Sandwhich",
    price:"$13.99",
    ingredients:"pastrami, rye bread"
  },
  {
    id:3,
    foodName:"Peanut Butter and Jelly",
    price:"$4.99",
    ingredients:"Peanutbutter, Grape Jelly, Bread"
  }
]

function FoodItems () {
   return(
     <div>
       {food.map(sandwich => <FoodItem key={sandwich.id} item={sandwich} />)}
      </div>
       
    )
   }
   
 

 export default FoodItems