starting point for part 2 exercise

parts/2/courseExercise/src/App.jsx

@@ -0,0 +1,63 @@
+const Header = (props) => {
+  return <h1>{props.course}</h1>
+}
+
+const Part = (props) => {
+  return <p>{props.partName} {props.exerciseCount}</p>
+
+}
+
+const Content = (props) => {
+  return (
+    <>
+    {props.sections.map((section) => {
+    return <Part partName={section.part} exerciseCount={section.exerciseCount}/>
+  })}
+    </>
+  )
+}
+
+const Total = (props) => {
+  return (
+    <>
+    <p>Number of exercises {props.sections.reduce(
+      (sum, section) => {
+        return sum + section.exerciseCount
+      },
+      0
+    )}</p>
+    </>
+  )
+}
+
+
+const App = () => {
+  const course = {
+    name: 'Half Stack application development',
+    sections: [
+      {
+        part: 'Fundamentals of React',
+        exerciseCount: 10
+      },
+      {
+        part: 'Using props to pass data',
+        exerciseCount: 7
+      },
+      {
+        part: 'State of a component',
+        exerciseCount: 14
+      },
+      
+    ]
+  }
+
+  return (
+    <div>
+      <Header course={course.name}/>
+      <Content sections={course.sections}/>
+      <Total sections={course.sections}/>
+    </div>
+  )
+}
+
+export default App