@Malik
Before I start please know that I greatly appreciate your help and understanding with what might seem laughable when you read this, however, it looks like ive been having a hackathon of my own taking place over here. 
In fact I think ive actually broken the internet with my frankenstein code - trying to impliment what might be something overly simple and im just all over the place with this search bar functionality.
below is what ive put together on the index.html for the search bar.
<form class="mx-2 d-inline flex-md-fill">
<input type="text" id="search" class="bg-transparent border-light form-control text-light mr-sm-2 rounded-pill" placeholder="Search for NFTs">
</form>
Below is frankenstein who know resides in my main.js
search = async () => {
const showItems = await Moralis.Cloud.run("getItems");
user = await Moralis.User.current();
items.forEach(item => {
if (user){
if (user.attributes.accounts.includes(item.ownerOf)){
const userItemListing = document.getElementById(`user-item-${item.tokenObjectId}`);
if (userItemListing) userItemListing.parentNode.removeChild(userItemListing);
getAndRenderItemData(item, renderUserItem);
return;
}
}
getAndRenderItemData(item, renderItem);
});
}
const search_input = document.getElementById('search');
let search_term = '';
search_input.addEventListener('input', e => {
// saving the input value
search_term = e.target.value;
});
showItems = async () => {
const showItems = await Moralis.Cloud.run("getItems");
user = await Moralis.User.current();
items.forEach(item => {
getAndRenderItemData(item, renderItem);
});
}
const showItems = document.getElementById("showItems");
To be honest, I would imagine, it would be best if you didnt even look at this for reference in seeing what went wrong. In fact the comment about having broken the intenet is - Console log isnt even showing any errors. It just gave up on me i guess. lol.
What im hoping you might tell me - whenever it might be convenient to share any simple implimentation that could work I would be very grateful. As although you explained it previously what might be a simple vanilla JS to make this work, I cant seem to wrap my head around changing what would be a typical call to an API, to using the moralis query.
What im trying to achieve is similar to the table set of marketplace items that display when a user lands on the page, that populates based on user input in the search bar, where items are removed or added automatically based on a match in the title or description. Something extra coool would be as you explained, each could even be clickable - maybe to open the item up in a modal or even just be displayed by itself with some added details about it, clickable still to buy etc.
Any framework you can might provide to start experimenting? Like a basic example to start with in my actual main.js, rather than an explanation of where to find ideas that I would need to be rewrite of figure out where to fit the moralis query requirement. Please let me know when you can - again, my humbled thanks in advance - and not pressing of course - so whenever it might be convenient.
Hereās a link to the implimentation as well.
https://deusex.me/sothenfts/binance_smart_chain/
By the way, have a look at the really cool, image editing application I have now embedded into the create item link, allows for the on the fly nft creation with massive amounts of filtering and image editing features like a built in photoshop.
In any event, I really apprecite you guys, and hope to continue learning - and building together with you all. Any help you might offer - would be sincerely appreciated.
Deus
and you have this amazing app