Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/yashkathe/get-anime-sauce
Upload screenshots of anime scenes or image url to fetch the exact anime scene and its episode. Made with reactJS
https://github.com/yashkathe/get-anime-sauce
anime anime-search-engine anime-searcher css framer-motion javascript jsx reactjs
Last synced: about 2 hours ago
JSON representation
Upload screenshots of anime scenes or image url to fetch the exact anime scene and its episode. Made with reactJS
- Host: GitHub
- URL: https://github.com/yashkathe/get-anime-sauce
- Owner: yashkathe
- Created: 2022-01-11T12:46:48.000Z (almost 3 years ago)
- Default Branch: master
- Last Pushed: 2022-09-07T18:11:04.000Z (about 2 years ago)
- Last Synced: 2023-03-06T03:18:46.093Z (over 1 year ago)
- Topics: anime, anime-search-engine, anime-searcher, css, framer-motion, javascript, jsx, reactjs
- Language: JavaScript
- Homepage: https://getsauce.netlify.app
- Size: 19.2 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Get Anime Sauce
This web app helps you trace back the exact scene and episode from where the anime screenshot is taken from.
## Powered by trace moe
This web app uses the trace moe api.
Trace.moe is an Anime Scene Search Engine that helps users to trace back the original anime
by a screenshot. It searches in ~30000 hours of anime and find the best matching scene.
It can tell the anime, the episode and the exact time that scene appears. [Read more](https://trace.moe/about)
[Official trace moe docs](https://soruly.github.io/trace.moe-api/#/docs)
[Official repository](https://github.com/soruly/trace.moe)
## Hosted on Netlify ✔️
https://getsauce.netlify.app/
## Screenshots
- Paste an Image URL
- Or directly upload an image
- Also optimised for mobile devies
## Run this project on your machine
- Clone this repository or download the zip file
```bash
git clone https://github.com/yashkathe/Get-Anime-Sauce
```
- From within the project directory, \
run this command to download the node modules
```bash
npm install
```
- Start the development server on local host
```bash
npm start
```
## Folder Structure
| Component Name | Parent Directory | Description |
| :---------------- | :----------------- | :------------------------------------------- |
| ImageResponse.js | /Components/Form | Shows Image when user uploads an image |
| UploadForm.js | /Components/Form | Contains form to upload image and insert Url |
| ReceivedResult.js | /Components/Result | Displays result |
| ResultCard.js | /Components/Result | Child of ReceivedResult.js |
| Errormsg.js | /Components | Displays error if any |
| Parent.js | /Components | Wrapper of UploadForm.js |
| Card.js | /UI | Card Wrapper |
| Header.js | /UI | Header for this app |
| MetaTag.js | /UI | code from react-meta-tags |
| Spinner.js | /UI | Spinner component |
### Hooks and Store
| Component Name | Parent Directory | Description |
| :---------------- | :--------------- | :--------------------------------------------- |
| varients-store.js | /Store | contains varients for framer motion Components |
| use-http.js | /Hooks | useHttp hook to send request to the api |
All folders have same common directory src\*
## Feedback
If you have any feedback, please reach out to me at [email protected]