https://github.com/younusaliakash/react-spanish-la-liga-simple

A practice project for practicing react js, react-router dom, react file system, and enhancing react js redevelopment skills. here I built a sports club information card using dynamic parameters of react js ecosystem.
https://github.com/younusaliakash/react-spanish-la-liga-simple

react-bootstrap reactjs

Last synced: 3 months ago
JSON representation

A practice project for practicing react js, react-router dom, react file system, and enhancing react js redevelopment skills. here I built a sports club information card using dynamic parameters of react js ecosystem.

• Host: GitHub
• URL: https://github.com/younusaliakash/react-spanish-la-liga-simple
• Owner: younusaliakash
• Created: 2021-04-27T15:40:37.000Z (about 4 years ago)
• Default Branch: main
• Last Pushed: 2021-04-27T15:41:19.000Z (about 4 years ago)
• Last Synced: 2025-02-01T05:23:05.563Z (5 months ago)
• Topics: react-bootstrap, reactjs
• Language: JavaScript
• Homepage:
• Size: 2.64 MB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# __Spanish La Liga__

Live Link: https://spanish-la-liga-devakash.netlify.app/

## **_Website features_** :

> User can see Different team card of Spanish La Liga in Home UI 

> If the user hovers on the team card then the user will watch a mind-blowing effect.

> If the user clicks the Explore button, the user will see the details of the team.

    

> On the details page, the user will see the team logo, banner, stadium, team details, and history. at end of this page, the user will see every team's social media linked icon. All information is dynamic.

## **_Usage Function_** :

1. Hooks 

    * useEffect()

    ```js

    useEffect(() =>{

        fetch("https://www.thesportsdb.com/api/v1/json/1/search_all_teams.php?l=Spanish%20La%20Liga")

        .then((response) => response.json())

        .then( data => setTeams(data.teams))

    },[])

    ```

    * useState()

    ```js

    const [name, setName] = useState([])

    ```

    * useParams()

    ```js

    const {id} = useParams()

    ```

2. React Router

    * Router

    * Route

    * Switch

    * Link

    

    | Thank you very much. |

    | ------------- |