cohort3-react-1

First React Assignment

1. Make a React Application using create-react-app
2. Using this Array:

[
  {
    first: "Heath",
    last: "Richmond",
    age: 27,
    isBestFriend: true
  },
  {
    first: "Cox",
    last: "Estrada",
    age: 27,
    isBestFriend: true
  },
  {
    first: "Norma",
    last: "Mccoy",
    age: 35,
    isBestFriend: false
  },
  {
    first: "Wallace",
    last: "Montoya",
    age: 27,
    isBestFriend: false
  },
  {
    first: "Concepcion",
    last: "Mccarthy",
    age: 22,
    isBestFriend: true
  },
  {
    first: "Albert",
    last: "Wade",
    age: 25,
    isBestFriend: true
  },
  {
    first: "Sykes",
    last: "Gonzalez",
    age: 29,
    isBestFriend: false
  },
  {
    first: "Alisa",
    last: "Ryan",
    age: 30,
    isBestFriend: true
  },
  {
    first: "Holmes",
    last: "Bright",
    age: 28,
    isBestFriend: false
  },
  {
    first: "Estrada",
    last: "Pittman",
    age: 25,
    isBestFriend: false
  }
];

Set a value in your component to friendList = above_data

3. Make a list showing all your friends names
4. Make a list only showing your best friends right next to it
5. Show the average age of your best friends in a final section

In Class

• Create a friends name component
• Create a friends list component
• Use these components to complete 3 - 5.

Homework Feb 13

After completing the above:

• Create a text input field that filters the list of all based on what you have typed into the input
• Bonus: create a text input field that filters the list of best friends as well