Jackie F - Litter Patrol

[jfahmy]

Litter Patrol

Congratulations! You're submitting your assignment!

Comprehension Questions

Question	Answer
How are events / event handlers and this.state connected?	Event handlers can be used to make changes to state, and I suppose event handlers are also called on "this" so they are being executed on the object currently occupying "this.
What are two ways to do "dynamic styling" with React? When should they be used?	There is an option to do styling inline or with css style sheets. We should default to css style sheets when possible.
Much like Rails works with the HTTP request->response cycle, React works with the browser's input->output cycle. Describe React's cycle from receiving user input to outputting different page content.	When a user interacts with a web page, if there is an event handlers, then it sends a message to the DOM to make a change/update. And then the DOM renders what needed to change in the browser.
Compare how React and Rails' views differ. Given different circumstances, these systems have different goals. How does this impact on their design and how we are supposed to use them?	React sites are meant to be built of many re-usable components, where a rails website does not have components. Also, user interaction in Rails was always in the form of clicking a link or submitting a form. React appears to have more options for dynamic, jquery like functions. React can render changes for what the user is viewing without sending an http request.
What was a challenge you were able to overcome on this assignment?	I found it very difficult to access the itemIcons. I knew I had to access these, but was unaware I could access the images for the different items like an object. I tried to google how to access images from a component in React and really couldn't find anything. (Eventually I asked for help and the solution seemed obvious...)

CS Fundamentals Questions

Question	Answer
Consider the code on the first few lines of App.render (it starts with this.state.items.map). What is the Big-O time complexity of this code, where n is the number of active game items?	O(n) because we need to go through each item in items. It has linear time complexity as it increases with the number of items it's given.
What part of React might benefit most from the use of specific data structure and algorithms?	Anywhere we have something interactive we need to have a function that will be as efficient as possible.
Consider what happens when React processes a state change from setState -- it must re-render all of the components that now have different content because of that change. What kind of data structure are the components in, and what sort of algorithms would be appropriate for React's code to "traverse" those components? Speculate wildly about what the Big-O time complexity of that code might be.	The DOM and the events that take place in it are probably in a tree-like structure and React is also tree-like in that there are child parent relationships between components. It's probably using some kind of pre-order traversal algorithm that allows us to search quickly through the tree - maybe O(n)

[dHelmgren]

Litter Patrol

What We're Looking For

Feature	Feedback
Core Requirements
Git hygiene	Good
Comprehension questions	Good
Functionality
Clicking on litter or nature shows a check or X respectively	No, see comment.
Clicking on litter appropriately updates the score	Yes, but when you click on a piece of litter more than once, the score keeps going up. How could you improve this?
Under the Hood
JavaScript is well-organized and easy to read	Yes
Functions are named appropriately	Yes
Callback functions are passed to components appropriately	yes
Overall	This is a good submission with a fatal flaw: you didn't get the CSS styling attached appropriately. Otherwise, you've done a great job getting this applet working!