Skip to content

Conversation

@RachaelGomez
Copy link

Congratulations! You're submitting your assignment. Please reflect on the assignment with these questions.

Reflection

Prompt Response
How are events / event handlers and useState connected? useState is managed by the event handler and changes during events. useState returns the current value of a state variable and a function to update the state. When an event like a mouse click occurs, an event handler function is called which references the update function that was provided by useState. Calling the update function will re-render the component. After re-rendering, useState will again return the new, current value of the state variable and a function to update the state.
What are two ways to do "dynamic styling" with React? When should they be used? You can change the value of a className inside a conditional statement to dynamically style, such as changing background color from red to green if a value is within a certain range. You can also do inline styling and conditionally change the values of an object that gets passed into a style attribute.
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. As React receives new input from the user and notices changes to state, the app re-renders the page, thereby outputting different page content.

CS Fundamentals Questions

Question Answer
What do you think is the BigO complexity of the method you use to compute a winner? Our compute winner method has a big O of O(1). While it uses two nested loops to go through the 2D array, the nested array is always 3x3. So the time complexity is constant.
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.
BigO of this must be able to render it fairly quickly but also get through all of the content. I'd hope it was doing so efficiently with a binary traversal but I feel like that would make it so it doesn't hit each part of the content that it would need to since everything needs to be rendered in order.

Copy link

@CheezItMan CheezItMan left a comment

Choose a reason for hiding this comment

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

For TicTacToe we reviewed test results, the checkForWinner function, and onClickCallback function. nice work, they all seem to do what's needed, I would suggest taking out the console.log statements when you submit the project, it just shows up in the test output in Learn.

Good work implementing a React project using state and callback functions!

// Then pass it into the squares as a callback


const checkForWinner = () => {

Choose a reason for hiding this comment

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

👍 Nicely done

const updateSquares = (id) => {

const newSquares = [...squares]
if (winner == null) {

Choose a reason for hiding this comment

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

Well done.

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.

3 participants