Skip to content

Michelle - Edges - Inspiration Board#40

Open
kangazoom wants to merge 10 commits intoAda-C10:masterfrom
kangazoom:master
Open

Michelle - Edges - Inspiration Board#40
kangazoom wants to merge 10 commits intoAda-C10:masterfrom
kangazoom:master

Conversation

@kangazoom
Copy link

@kangazoom kangazoom commented Dec 18, 2018

Inspiration Board

Congratulations! You're submitting your assignment!

Comprehension Questions

Question Answer
Explain the steps in creating a new Card from the form. tbd.
How did you learn how to use the API? I read the documentation and explored it in PostMan.
What function did you use to place the GET request from the API to get the list of cards? Why use that function? I placed the GET request inside the componentDidMount function. I did this to make sure that the Board component had fully mounted before attempting the GET request to populate with all the Card components.
Explain the purpose of a Snapshot test. Snapshot testing allows us to keep track of whether the page's elements/ui is rendering as expected or if any changes have ruined its integrity. It saves the HTML elements as JSON to make this comparison.
What purpose does Enzyme serve in testing a React app? Enzyme allows us to choose between a deep or a shallow snapshot. In this project, we employed a shallow snapshot in order to check that the components are rendering as we would expect at the top-most level. HTML children are not considered.
note mis-prioritized this week. got carried away with capstone research - still working on wave 3 and its related comprehension question

@tildeee
Copy link

tildeee commented Dec 20, 2018

Inspiration Board

What We're Looking For

Feature Feedback
Core Requirements
Git hygiene x
Comprehension questions x
General
Card Component renders the data provided as props x, but propTypes isn't defined!
Board Component takes a URL and renders the list of Cards and passes in callback functions x
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 x
DELETE request made in callback function x
POST request made in callback function passed to NewCardForm component.
Snapshot testing
Styling x
Overall

Aw Michelle!

Well, you know that this project is pretty incomplete. With what I saw though, it was the makings of a good start. I've added just a couple comments on the current code as is. Otherwise, just to be completely thorough, what I saw missing was:

  • Being able to add a new card with a form
  • Snapshot testing
  • Overall tidiness/clean-up (which usually happens at the end of a project I'm sure)

You mention in your PR that mostly you ran out of time, but if you have any questions about the material, let me know.

}

componentDidMount() {
const GET_CARDS_URL = 'https://inspiration-board.herokuapp.com/boards/mightymichelle/cards';
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

it would be nice if you used the props passed into Board from App -- url and boardName!

let card = this.state.cards.find((card) => card.id === response.data.card.id);
let updatedCardCollection = this.state.cards.filter(element => element !== card);

this.setState({cards: updatedCardCollection});
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hm, weird, the list of cards isn't immediately updating for me after deleting a card... I haven't looked into debugging this though

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants