space - Nora

[thenora]

React Tic Tac Toe

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?	Events are typically an action prompted by a user, examples include onClick or onButtonClick. An event handler tells the program what to do when that happens after that event. And the 'useState' lets us set a 'state' that will consistently hold until reset.
What are two ways to do "dynamic styling" with React? When should they be used?	You can use inline or external style sheets to create dynamic styling in React. Typically inline styling is discouraged as external style sheets are cleaner, more consistent, and easier for other developers or designers to find your styles. You can also use classes and conditional statements to dynamically change the way that content displays on a page.
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.	React components are updated when a user triggers an event (square clicked), a callback function handles the event and passes information from a parent to child components, sets a new state with the setState hook, and the app outputs JSK to update the page as is relevant.

CS Fundamentals Questions

Question	Answer
What do you think is the BigO complexity of the method you use to compute a winner?	Mine was broken... but if it had worked I'd guess a time complexity of O(n) and a space complexity of O(n^2) because I make a copy of the squares.
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.	React is in a tree data structure with components made up of child components. A binary search should work and have a time complexity of O (log n) base don the number of nodes.

[thenora]

I never got wave 3 working, but I wanted to turn something in rather than get too far behind.

[kaidamasaki]

React Tic Tac Toe

Major Learning Goals/Code Review

Criteria	yes/no, and optionally any details/lines of code to reference
Demonstrates proper JavaScript coding style.	✔️
Correctly passes props to child components.	✔️
Correctly passes callback functions to child components and calls them to respond to user events.)	✔️
Maintains the status of the game in state.	✔️
Practices git with at least 6 small commits and meaningful commit messages	✔️
Uses existing stylesheets to render components	✔️

Functional Requirements

Functional Requirement	yes/no
The Square component renders properly and executes the callback on a click event.	✔️
The Board component renders a collection of squares	✔️
The App component renders a board and uses state to maintain the status of the game.	✔️
Utilizes callbacks to UI events to update state	✔️

Overall Feedback

Overall Feedback	Criteria	yes/no
Green (Meets/Exceeds Standards)	5+ in Code Review && 3+ in Functional Requirements	✔️
Yellow (Approaches Standards)	4+ in Code Review && 2+ in Functional Requirements, or the instructor judges that this project needs special attention
Red (Not at Standard)	0-3 in Code Review or 0,1 in Functional Reqs, or assignment is breaking/doesn’t run with less than 5 minutes of debugging, or the instructor judges that this project needs special attention

Code Style Bonus Awards

Was the code particularly impressive in code style for any of these reasons (or more...?)

Quality	Yes?
Perfect Indentation	✅
Elegant/Clever	(A little too clever.)
Descriptive/Readable	✅
Concise
Logical/Organized	✅

[kaidamasaki]

Good job! Even though winner detection was broken everything else worked and your code was generally quite well organized. 😄

[kaidamasaki]

Yeah, that's legit. I'll go fix that.

[kaidamasaki]

It looks like you tried to get a little too clever here. A bit if/else if statement would have been fine. It's gross but starting with the brute force way is generally a good way to get something working.