Anime Search

Inspiration

Wanted to take part in the Hackathon

What it does

Uses Elastic App Search's Search API to search Animes and clicking the Search Result displays the Details extracted from MyAnimeList. I have used this part of this dataset Anime Recommendations Database from kaggle

How we built it

• I used Vue.JS for the Front-End. I created a reactive search that calls the Search API of https://www.elastic.co/app-search/ whenever the Search Query changes. The search results are displayed in Card-like elements clicking on which takes one to the Anime Details View/Page.
• To obtain the details of the Anime I created an Express Server in Node.JS that uses this npm package - https://www.npmjs.com/package/mal-scraper to obtain details of an Anime
• I used this package - https://github.com/elastic/app-search-javascript - to use the Search API of the ElasticAppSearch in the VueJS Frontend

Challenges we ran into

• Time
• CSS
• Had no Idea what Elastic Stack was

Accomplishments that we're proud of

• Created a Reactive Search Engine
• Learned About Elastic Stack
• Took part in my first Hackathon

What we learned

• About Elastic Stack
• Hackathons are Fun!

What's next for Anime Search

• Don't Know

Built With

• bootstrap-vue
• elasticappsearch
• express.js
• node.js
• vuejs