Inspiration Board React App - Emilce - Octos

[emilcecarlisa]

Inspiration Board

Congratulations! You're submitting your assignment!

Comprehension Questions

Question	Answer
Explain the steps in creating a new Card from the form.	The form receives information from the user, changes the local state of the form as the user types input, then upon form submission we make a callback to the Board where the new card is added to the current list.
How did you learn how to use the API?	Examples from class and additional readings.
What function did you use to place the GET request from the API to get the list of cards? Why use that function?	Used componentDidMount() because it runs after the initial render and retrieves the list which the user wants to see immediately upon landing on the page.
Explain the purpose of a Snapshot test.	A snapshot test is used to tests components as they interact with each other or in the case of a shallow test, allows you to test only certain parts of a component's lifecycle.
What purpose does Enzyme serve in testing a React app?	Enzyme is a library that allows you to manipulate DOM for the purpose of running tests and makes things human readable through serialization.
Summary

[Hamled]

Because this JSX code does not use the Card component, this doesn't actually constitute a test for that component.

Instead we should use something like:

const wrapper = shallow(
  <Card id={0} text="Hello" emojis="" onDeleteCard={onClick} />
);

[Hamled]

Inspiration Board

What We're Looking For

Feature	Feedback
Core Requirements
Git hygiene	✅
Comprehension questions	✅
General
Card Component renders the data provided as props	✅
Board Component takes a URL and renders the list of Cards and passes in callback functions	Mostly. The Board component does receive a URL through props, but actually uses three constants defined within the same file instead. A more modular approach would be to have the component use the base URL prop and combine it with the boardName prop to create the complete URL needed for Axios requests.
NewCardform Component is a controlled form and uses a callback function to return entered data to the parent component	✅
API
GET request made in componentDidMount	✅
DELETE request made in callback function
POST request made in callback function passed to NewCardForm component.	✅
Snapshot testing	Mostly. There are a few cases where we're not truly testing a snapshot of the component being tested (see comments), or where we could probably have additional snapshot tests.
Styling	✅
Overall