🏈 React Football Scoreboard — Student README

Welcome! In this workshop, we’ll build a simple Football Scoreboard app with React.

---

🚀 Getting Started

1. Clone the repo and install dependencies:

npm install
npm run dev

2. Open the app in your browser (usually http://localhost:5173).
3. Open src/App.jsx in your editor.

---

✏️ Where to Code

👉 All your coding happens only in App.jsx.
The other files (Scoreboard.jsx, PlayButtons.jsx, Controls.jsx, App.css) are already complete.

In App.jsx, you’ll see 5 TODOs:

1. TODO(1): Implement addPoints(team, points)
2. TODO(2): Implement reset()
3. TODO(3): Add <Scoreboard /> for Team A and Team B
4. TODO(4): Add <PlayButtons /> for both teams
5. TODO(5): Hook up the <Controls /> reset button

---

✅ End Result

When finished, you’ll have a working scoreboard that lets you:

• Rename each team.
• Add points for touchdowns, field goals, etc.
• Reset the scores.

Scores will show in green (left team) and blue (right team), with styling already included in App.css.

---

💡 Tips

• Use the spread operator { ...t } when updating state so you don’t lose properties.
• Pass functions as props (onPlay, onNameChange, onReset) to connect children to parent state.
• Don’t worry about CSS today — it’s ready to go.

---

🎯 Goal

By the end of the workshop, you’ll understand how to use:

• useState to store values.
• Props to pass values and functions.
• Event handlers to update state.
• Components to keep your app organized.

---

Happy coding! 🎉