I've made an Emoji Search with React.js. In which emoji comes by searching favourite emoji, And it's completely responsive, who gives as a card.
NOTE : @komal_Bhatt helped me in making this small project. I want to say my heartfelt thanks.
THANK YOU SO MUCH FOR HELP ME LOT OF : @komal_Bhatt ❤️❤️😊❤️❤️
Today we will know, how to make it.
First of all, I took the data, First of all, I took the data from the same hook, like this..
{SearchFilter.slice(7, 50).map((emoji, index) => {
return <div key={index} className="items">
//..... you data, like {emoji.title}.. etc
</div >
Note: Don't forget to import your file of JSON
And after that, I put up a search bar to help us by funding emoji...
constructor() {
super();
this.state = {
search: ''
}
}
handleChange = (event) => {
this.setState({
search: event.target.value
});
}
render() {
const { search } = this.state;
const SearchFilter = EmojiData.filter(item => {
if (item.title.toLowerCase().indexOf(search.toLowerCase()) !== -1)
return true
if (item.keywords.toLowerCase().indexOf(search.toLowerCase()) !== -1)
return true
return false
})
Project Code 👨💻
source code: github.com/NavidMansuri5155/Emoji_Search.io Live Demo: emoji-search1.herokuapp.com
Tech Stack 💻
HOW TO MAKE EMOJI SEARCH APP.
HOW TO IMPORT JSON FILES.
HOW USE slice
.
Thank you for reading 🙏
If you enjoyed this article or found it helpful, give it a thumbs-up 👍
Feel free to connect 👋