https://github.com/masoumehmohebbi/react-harry-potter-api

Harry Potter Api o-o⚡ - React Js
https://github.com/masoumehmohebbi/react-harry-potter-api

api clean-code context harry-potter harry-potter-api muli-contexts pagination react react-pagination react-router-dom reactjs responsive sing spa tailwind

Last synced: 3 months ago
JSON representation

Harry Potter Api o-o⚡ - React Js

• Host: GitHub
• URL: https://github.com/masoumehmohebbi/react-harry-potter-api
• Owner: masoumehmohebbi
• Created: 2023-09-20T06:14:50.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-09-27T19:07:31.000Z (over 1 year ago)
• Last Synced: 2025-01-02T23:14:19.301Z (5 months ago)
• Topics: api, clean-code, context, harry-potter, harry-potter-api, muli-contexts, pagination, react, react-pagination, react-router-dom, reactjs, responsive, sing, spa, tailwind
• Language: JavaScript
• Homepage: https://masoumehmohebbi.github.io/react-harry-potter-api/
• Size: 3.26 MB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# React-harry-potter-api

This is a harry-potter App; That I developped it with React Js and Tailwind css. The api i used is:https://hp-api.onrender.com/api/

working with muli-Contexts was a challenging for me in this App! 

In this app User can choose a category (Characters, Spells or Staff), The related data will be apear. adding item to favourite (LocalStorage) or removed it from favourites-part, searching in datas, Pagination between data are the features of this app!


  

  

  

## hooks:

| Built in hooks     | Custom hooks                                                     |

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

| useState           | useQuery                                                       

| useEffect          | useFetch

| useParams          | useFavourite

| useNavigate        | useSetLocalStorage

| useContext         | useSearch

|                    | usePagination

 

## Development setup

#### First, clone the project:

git clone https://github.com/masoumehmohebbi/react-harry-potter-api/

#### Then, install necessary npm packages:

npm i

#### Finally, run the `start` script and preview project on a local server:

npm run dev

## Author

Masoume mohebbi