18 | {player.team} 19 |
20 | 21 | 24 |
3 | 
4 |
22 |
23 | ## Images
24 | 
25 | 
26 | 
27 | 
28 |
29 | ## API
30 | [api-sports.io](https://api-sports.io/documentation/nba/v2#tag/Teams/operation/get-teams)
31 |
32 | ### Acknowledgments
33 | * Previous Class Recordings
34 | * ChatGPT - created data to test my backend.
35 | * PerScholas
36 |
--------------------------------------------------------------------------------
/public/vite.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/App.jsx:
--------------------------------------------------------------------------------
1 | /* cSpell:disable */
2 | import { useEffect, useState } from "react"
3 | import { Routes, Route, useNavigate } from "react-router-dom";
4 | import HomePage from "./pages/HomePage";
5 | import TeamsPage from "./pages/TeamsPage";
6 | import PlayersPage from "./pages/PlayersPage";
7 | import PlayersDetails from "./pages/PlayersDetails";
8 | import Nav from "./components/Nav";
9 |
10 |
11 | function App() {
12 | const [teams, setTeams] = useState([]);
13 | const [players, setPlayers] = useState([]);
14 |
15 | useEffect(() => {
16 | const fetchPlayers = async () => {
17 | const res = await fetch(`${import.meta.env.VITE_API_BASE_URL}/players`);
18 | const playerData = await res.json();
19 | setPlayers(playerData)
20 |
21 | }
22 | fetchPlayers();
23 | }, []);
24 |
25 | useEffect(() => {
26 | const fetchTeams = async () => {
27 | const res = await fetch('https://v2.nba.api-sports.io/teams?id=14', {
28 | headers: {
29 | 'x-rapidapi-host': 'v2.nba.api-sports.io',
30 | 'x-rapidapi-key': import.meta.env.VITE_API_KEY
31 | }
32 | });
33 | const teamData = await res.json();
34 | setTeams(teamData.response)
35 | }
36 | fetchTeams();
37 | }, []);
38 |
39 |
40 | return (
41 | <>
42 |
43 |