diff --git a/src/Question1-Header.js b/src/Question1-Header.js
index 1527b3b..44addfb 100644
--- a/src/Question1-Header.js
+++ b/src/Question1-Header.js
@@ -1,5 +1,4 @@
-/* DELETE THIS LINE AND WRITE THE ANSWER TO QUESTION 1 HERE */
-
+import React from 'react';
/*
* ============= Question 1 =============
*
diff --git a/src/Question2-LionsExhibit.js b/src/Question2-LionsExhibit.js
index b31af8c..a02b503 100644
--- a/src/Question2-LionsExhibit.js
+++ b/src/Question2-LionsExhibit.js
@@ -10,6 +10,13 @@
import React from "react";
-const LionsExhibit = () => null;
+const LionsExhibit = () => {
+ return (
+
+ Lions
+ The mane is the most recognisable feature of the species
+
+ );
+};
export default LionsExhibit;
diff --git a/src/Question3-TigersExhibit.js b/src/Question3-TigersExhibit.js
index ccfd252..c632fb2 100644
--- a/src/Question3-TigersExhibit.js
+++ b/src/Question3-TigersExhibit.js
@@ -18,12 +18,12 @@
import React from "react";
-function TigersExhibit() {
+function TigersExhibit(props) {
return (
Tigers
-
There are ... tigers in the world
-
{/* DELETE THIS LINE AND WRITE THE ANSWER PART B HERE */}
+
There are {props.population} tigers in the world
+
{props.habitats.map((habit, index) => - {habit}
)}
);
}
diff --git a/src/Question4-MonkeysExhibit.js b/src/Question4-MonkeysExhibit.js
index bfefca0..ef5d24b 100644
--- a/src/Question4-MonkeysExhibit.js
+++ b/src/Question4-MonkeysExhibit.js
@@ -5,18 +5,20 @@
*/
import React from "react";
+class MonkeysExhibit extends React.Component {
-function MonkeysExhibit(props) {
- return (
-
- Latin name: {props.latinName}
-
- {props.commonSpecies.map((speciesName, index) => {
- return - {speciesName}
;
- })}
-
-
- );
+ render() {
+ return (
+
+ Latin name: {this.props.latinName}
+
+ {this.props.commonSpecies.map((speciesName, index) => {
+ return - {speciesName}
;
+ })}
+
+
+ );
+ }
}
export default MonkeysExhibit;
diff --git a/src/Question5-AnimalSpotter.js b/src/Question5-AnimalSpotter.js
index b7136a2..d57e37d 100644
--- a/src/Question5-AnimalSpotter.js
+++ b/src/Question5-AnimalSpotter.js
@@ -13,9 +13,11 @@ import React, { Component } from "react";
class AnimalSpotter extends Component {
constructor(props) {
super(props);
- this.state = {};
+ this.state = { animalSpotted: 0 };
}
-
+ spotAnimal = () => {
+ this.setState({ animalSpotted: ++this.state.animalSpotted })
+ };
render() {
return (
@@ -28,7 +30,7 @@ class AnimalSpotter extends Component {
function CounterButton(props) {
return (
-