Sigrid Benezra - Edges - Litter Patrol

[sdbenezra]

Litter Patrol

Congratulations! You're submitting your assignment!

Comprehension Questions

Question	Answer
How are events / event handlers and this.state connected?	A click event on a game item triggers that game item's onClick handler function defined in it's code. The game item's onClick handler function in turn calls the onClickCallback function it was passed through props from the app file. This.state is used in the app file's onItemClicked function to access state values to update through setState in response to click events.
What are two ways to do "dynamic styling" with React? When should they be used?	You can either do dynamic styling inline with the style attribute or use a css file and the className attribute. Normally you want to stick with a css file, but if you have a specific element that needs styling based on specific logic, an inline style is the way to go.
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.	In React you can connect react components to specific browser events. For instance, when a user clicks on a specific React component like a button, you can create an onClick event that will update the look of that component or another component on the screen.
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?	Rails views are focused on presenting information statically, and the styling and presentation logic are contained in controller files that are separate from the html. React views are more dynamic and combine presentation logic with html in their components.
What was a challenge you were able to overcome on this assignment?	Understanding the process behind how to pass onClick functions back and forth between the app and it's game item child components was challenging and I was quite proud of myself when I understood it. It's an awesome concept and I'm looking forward to using it more.

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?	The time complexity is O(n) because map will iterate over all of the items in the array before they're actually rendered to the screen.
What part of React might benefit most from the use of specific data structure and algorithms?	State makes extensive use of arrays and hashes to organize data, and these structures make it easy to select and update state data.
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 component data is contained in an array of hashes, so you could use a loop like for-of or a .map function to traverse the components. The time complexity would be O(n) with n being the number of components in the list because in the worst case all the components would have changed and you would need to traverse all of them.